@corbado/react
Advanced tools
Comparing version 0.1.1-alpha.1 to 0.1.1-alpha.2
@@ -5,9 +5,9 @@ import type { FC, ReactNode } from 'react'; | ||
header: string; | ||
body: ReactNode; | ||
body?: ReactNode; | ||
confirmText?: string; | ||
cancelText?: string; | ||
inverseButtonVariants?: boolean; | ||
onClose: () => void; | ||
onConfirm: () => void; | ||
onClose: () => Promise<void> | void; | ||
onConfirm: () => Promise<void> | void; | ||
} | ||
export declare const Dialog: FC<DialogProps>; |
@@ -1,6 +0,7 @@ | ||
import type { AnchorHTMLAttributes, FunctionComponent, ReactNode, SVGProps } from 'react'; | ||
import type { AnchorHTMLAttributes, FunctionComponent, ReactNode } from 'react'; | ||
import { type IconProps } from './Icon'; | ||
export interface IconLinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> { | ||
Icon: FunctionComponent<SVGProps<SVGSVGElement>>; | ||
icon: IconProps; | ||
label: ReactNode; | ||
} | ||
export declare const IconLink: FunctionComponent<IconLinkProps>; |
export * from './Button'; | ||
export * from './HorizontalRule'; | ||
export * from './icons'; | ||
export * from './Icon'; | ||
export * from './Input'; | ||
@@ -5,0 +5,0 @@ export * from './FormInput'; |
import '../i18n'; | ||
import type { CorbadoAppParams, CorbadoUIConfig } from '@corbado/types'; | ||
import type { CorbadoProviderParams } from '@corbado/react-sdk'; | ||
import type { CorbadoUIConfig } from '@corbado/types'; | ||
import type { FC, PropsWithChildren } from 'react'; | ||
export type CorbadoProviderProps = PropsWithChildren<CorbadoUIConfig & CorbadoAppParams>; | ||
export type CorbadoProviderProps = PropsWithChildren<CorbadoUIConfig & CorbadoProviderParams>; | ||
declare const CorbadoProvider: FC<CorbadoProviderProps>; | ||
export default CorbadoProvider; |
import { useCorbado } from '@corbado/react-sdk'; | ||
import { CorbadoThemes } from '@corbado/shared-ui'; | ||
import CorbadoProvider from './hocs/CorbadoProvider'; | ||
import CorbadoProvider, { CorbadoProviderProps } from './hocs/CorbadoProvider'; | ||
import CorbadoAuth from './screens/CorbadoAuth'; | ||
import PasskeyList from './screens/PasskeyList'; | ||
export { CorbadoProvider, useCorbado, CorbadoAuth, PasskeyList, CorbadoThemes }; | ||
export { CorbadoProvider, useCorbado, CorbadoAuth, PasskeyList, CorbadoThemes, CorbadoProviderProps }; |
@@ -1,2 +0,2 @@ | ||
import*as e from"@corbado/react-sdk";import*as t from"@corbado/shared-ui";import*as a from"i18next";import*as r from"i18next-browser-languagedetector";import*as l from"react-i18next";import*as n from"react";var s={d:(e,t)=>{for(var a in t)s.o(t,a)&&!s.o(e,a)&&Object.defineProperty(e,a,{enumerable:!0,get:t[a]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t)};(()=>{var e;if("string"==typeof import.meta.url&&(e=import.meta.url),!e)throw new Error("Automatic publicPath is not supported in this browser");e=e.replace(/#.*$/,"").replace(/\?.*$/,"").replace(/\/[^\/]+$/,"/"),s.p=e})();var o={};s.d(o,{rX:()=>Be,Hg:()=>v,BN:()=>d.CorbadoThemes,XZ:()=>Oe,km:()=>c.useCorbado});const c=(i={CorbadoProvider:()=>e.CorbadoProvider,useCorbado:()=>e.useCorbado},u={},s.d(u,i),u);var i,u;const d=(e=>{var t={};return s.d(t,e),t})({CommonScreens:()=>t.CommonScreens,CorbadoThemes:()=>t.CorbadoThemes,FlowHandler:()=>t.FlowHandler,FlowHandlerEvents:()=>t.FlowHandlerEvents,LoginFlowNames:()=>t.LoginFlowNames,PasskeyLoginWithEmailOtpFallbackScreens:()=>t.PasskeyLoginWithEmailOtpFallbackScreens,PasskeySignupWithEmailOtpFallbackScreens:()=>t.PasskeySignupWithEmailOtpFallbackScreens,SignUpFlowNames:()=>t.SignUpFlowNames,aaguidMappings:()=>t.aaguidMappings,getParsedUA:()=>t.getParsedUA,handleTheming:()=>t.handleTheming,hasDarkMode:()=>t.hasDarkMode,i18n:()=>t.i18n,notANumberRegex:()=>t.notANumberRegex,numberRegex:()=>t.numberRegex}),m=(e=>{var t={};return s.d(t,e),t})({default:()=>a.default}),f=(e=>{var t={};return s.d(t,e),t})({default:()=>r.default}),p=(e=>{var t={};return s.d(t,e),t})({Trans:()=>l.Trans,initReactI18next:()=>l.initReactI18next,useTranslation:()=>l.useTranslation}),E="en";m.default.use(p.initReactI18next).use(f.default).init({resources:{en:{translation:d.i18n.en},de:{translation:d.i18n.de}},keySeparator:".",fallbackLng:E});const b=e=>{var t;null===(t=null===document||void 0===document?void 0:document.querySelector("html"))||void 0===t||t.setAttribute("lang",e)},y=(e=!0,t=E,a=null)=>{const r=window.navigator.language;if(e&&t===E&&r===E&&!a)return;for(const[e,t]of Object.entries(null!=a?a:{}))m.default.addResourceBundle(e,"translation",t,!0,!0);const l=e?(e=>e.split("-")[0])(r):t;try{m.default.changeLanguage(l),b(l)}catch{m.default.changeLanguage(t),b(t)}},h=(e=>{var t={};return s.d(t,e),t})({createContext:()=>n.createContext,createElement:()=>n.createElement,default:()=>n.default,forwardRef:()=>n.forwardRef,memo:()=>n.memo,useCallback:()=>n.useCallback,useContext:()=>n.useContext,useEffect:()=>n.useEffect,useMemo:()=>n.useMemo,useRef:()=>n.useRef,useState:()=>n.useState}),v=({children:e,...t})=>{const{defaultLanguage:a,autoDetectLanguage:r,customTranslations:l,darkMode:n,theme:s}=t;return(0,h.useEffect)((()=>(y(r,a,l),(0,d.handleTheming)(null!=n?n:"auto",s))),[]),h.default.createElement(c.CorbadoProvider,{projectId:t.projectId,apiTimeout:t.apiTimeout},e)},g=(0,h.memo)((({variant:e="primary",className:t=""})=>{const a=`${"primary"===e?"cb-spinner-primary":"cb-spinner-secondary"} ${t}`;return h.default.createElement("div",{className:a})}),((e,t)=>e.variant===t.variant&&e.className===t.className)),k={primary:"cb-button-primary",secondary:"cb-button-secondary",tertiary:"cb-button-tertiary",close:"cb-button-primary cb-button-close"},w=(0,h.forwardRef)((({variant:e="tertiary",isLoading:t=!1,className:a="",disabled:r,children:l,...n},s)=>{const o=`${k[e]} ${a}`;return h.default.createElement("button",{className:o,disabled:r,ref:s,...n},t?h.default.createElement(g,null):l)})),S=({children:e,className:t=""})=>h.default.createElement("div",{className:`cb-horizontal-divider ${t}`},e);var C,F,N,M,P;function B(){return B=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var r in a)Object.prototype.hasOwnProperty.call(a,r)&&(e[r]=a[r])}return e},B.apply(this,arguments)}var x,_,T,H,O,L,D,z,A,U,R,V,I,W,q,$,j,Z,X,G,K,Y=function(e){return h.createElement("svg",B({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 48 48"},e),C||(C=h.createElement("path",{fill:"#4caf50",d:"m45 16.2-5 2.75-5 4.75V40h7a3 3 0 0 0 3-3z"})),F||(F=h.createElement("path",{fill:"#1e88e5",d:"m3 16.2 3.614 1.71L13 23.7V40H6a3 3 0 0 1-3-3z"})),N||(N=h.createElement("path",{fill:"#e53935",d:"m35 11.2-11 8.25-11-8.25-1 5.8 1 6.7 11 8.25 11-8.25 1-6.7z"})),M||(M=h.createElement("path",{fill:"#c62828",d:"M3 12.298V16.2l10 7.5V11.2L9.876 8.859A4.298 4.298 0 0 0 3 12.298"})),P||(P=h.createElement("path",{fill:"#fbc02d",d:"M45 12.298V16.2l-10 7.5V11.2l3.124-2.341A4.298 4.298 0 0 1 45 12.298"})))};function J(){return J=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var r in a)Object.prototype.hasOwnProperty.call(a,r)&&(e[r]=a[r])}return e},J.apply(this,arguments)}s.p;var Q,ee,te,ae=function(e){return h.createElement("svg",J({xmlns:"http://www.w3.org/2000/svg",xmlSpace:"preserve",viewBox:"0 0 1831.085 1703.335"},e),x||(x=h.createElement("path",{fill:"#0A2767",d:"M1831.083 894.25a40.879 40.879 0 0 0-19.503-35.131h-.213l-.767-.426-634.492-375.585a86.175 86.175 0 0 0-8.517-5.067 85.17 85.17 0 0 0-78.098 0 86.37 86.37 0 0 0-8.517 5.067l-634.49 375.585-.766.426c-19.392 12.059-25.337 37.556-13.278 56.948a41.346 41.346 0 0 0 14.257 13.868l634.492 375.585a95.617 95.617 0 0 0 8.517 5.068 85.17 85.17 0 0 0 78.098 0 95.52 95.52 0 0 0 8.517-5.068l634.492-375.585a40.84 40.84 0 0 0 20.268-35.685"})),_||(_=h.createElement("path",{fill:"#0364B8",d:"M520.453 643.477h416.38v381.674h-416.38zM1745.917 255.5V80.908c1-43.652-33.552-79.862-77.203-80.908H588.204C544.552 1.046 510 37.256 511 80.908V255.5l638.75 170.333z"})),T||(T=h.createElement("path",{fill:"#0078D4",d:"M511 255.5h425.833v383.25H511z"})),H||(H=h.createElement("path",{fill:"#28A8EA",d:"M1362.667 255.5H936.833v383.25L1362.667 1022h383.25V638.75z"})),O||(O=h.createElement("path",{fill:"#0078D4",d:"M936.833 638.75h425.833V1022H936.833z"})),L||(L=h.createElement("path",{fill:"#0364B8",d:"M936.833 1022h425.833v383.25H936.833z"})),D||(D=h.createElement("path",{fill:"#14447D",d:"M520.453 1025.151h416.38v346.969h-416.38z"})),z||(z=h.createElement("path",{fill:"#0078D4",d:"M1362.667 1022h383.25v383.25h-383.25z"})),h.createElement("linearGradient",{id:"outlook_svg__a",x1:1128.458,x2:1128.458,y1:811.083,y2:1.998,gradientTransform:"matrix(1 0 0 -1 0 1705.333)",gradientUnits:"userSpaceOnUse"},h.createElement("stop",{offset:0,style:{stopColor:"#35b8f1"}}),h.createElement("stop",{offset:1,style:{stopColor:"#28a8ea"}})),A||(A=h.createElement("path",{fill:"url(#outlook_svg__a)",d:"m1811.58 927.593-.809.426-634.492 356.848c-2.768 1.703-5.578 3.321-8.517 4.769a88.437 88.437 0 0 1-34.407 8.517l-34.663-20.27a86.706 86.706 0 0 1-8.517-4.897L447.167 906.003h-.298l-21.036-11.753v722.384c.328 48.196 39.653 87.006 87.849 86.7h1230.914c.724 0 1.363-.341 2.129-.341a107.79 107.79 0 0 0 29.808-6.217 86.066 86.066 0 0 0 11.966-6.217c2.853-1.618 7.75-5.152 7.75-5.152a85.974 85.974 0 0 0 34.833-68.772V894.25a38.323 38.323 0 0 1-19.502 33.343"})),U||(U=h.createElement("path",{fill:"#0A2767",d:"M1797.017 891.397v44.287l-663.448 456.791-686.87-486.174a.426.426 0 0 0-.426-.426l-63.023-37.899v-31.938l25.976-.426 54.932 31.512 1.277.426 4.684 2.981s645.563 368.346 647.267 369.197l24.698 14.478c2.129-.852 4.258-1.703 6.813-2.555 1.278-.852 640.879-360.681 640.879-360.681z",opacity:.5})),R||(R=h.createElement("path",{fill:"#1490DF",d:"m1811.58 927.593-.809.468-634.492 356.848c-2.768 1.703-5.578 3.321-8.517 4.769a88.96 88.96 0 0 1-78.098 0 96.578 96.578 0 0 1-8.517-4.769l-634.49-356.848-.766-.468a38.326 38.326 0 0 1-20.057-33.343v722.384c.305 48.188 39.616 87.004 87.803 86.7H1743.277c48.188.307 87.5-38.509 87.807-86.696V894.25a38.33 38.33 0 0 1-19.504 33.343"})),V||(V=h.createElement("path",{d:"m1185.52 1279.629-9.496 5.323a92.806 92.806 0 0 1-8.517 4.812 88.173 88.173 0 0 1-33.47 8.857l241.405 285.479 421.107 101.476a86.785 86.785 0 0 0 26.7-33.343z",opacity:.1})),I||(I=h.createElement("path",{d:"m1228.529 1255.442-52.505 29.51a92.806 92.806 0 0 1-8.517 4.812 88.173 88.173 0 0 1-33.47 8.857l113.101 311.838 549.538 74.989a86.104 86.104 0 0 0 34.407-68.815v-9.326z",opacity:.05})),W||(W=h.createElement("path",{fill:"#28A8EA",d:"M514.833 1703.333h1228.316a88.316 88.316 0 0 0 52.59-17.033l-697.089-408.331a86.706 86.706 0 0 1-8.517-4.897L447.125 906.088h-.298l-20.993-11.838v719.914c-.048 49.2 39.798 89.122 88.999 89.169-.001 0-.001 0 0 0"})),q||(q=h.createElement("path",{d:"M1022 418.722v908.303c-.076 31.846-19.44 60.471-48.971 72.392a73.382 73.382 0 0 1-28.957 5.962H425.833V383.25H511v-42.583h433.073c43.019.163 77.834 35.035 77.927 78.055",opacity:.1})),$||($=h.createElement("path",{d:"M979.417 461.305v908.302a69.36 69.36 0 0 1-6.388 29.808c-11.826 29.149-40.083 48.273-71.54 48.417H425.833V383.25h475.656a71.493 71.493 0 0 1 35.344 8.943c26.104 13.151 42.574 39.883 42.584 69.112",opacity:.2})),j||(j=h.createElement("path",{d:"M979.417 461.305v823.136c-.208 43-34.928 77.853-77.927 78.225H425.833V383.25h475.656a71.493 71.493 0 0 1 35.344 8.943c26.104 13.151 42.574 39.883 42.584 69.112",opacity:.2})),Z||(Z=h.createElement("path",{d:"M936.833 461.305v823.136c-.046 43.067-34.861 78.015-77.927 78.225H425.833V383.25h433.072c43.062.023 77.951 34.951 77.927 78.013a.589.589 0 0 1 .001.042",opacity:.2})),h.createElement("linearGradient",{id:"outlook_svg__b",x1:162.747,x2:774.086,y1:1383.074,y2:324.259,gradientTransform:"matrix(1 0 0 -1 0 1705.333)",gradientUnits:"userSpaceOnUse"},h.createElement("stop",{offset:0,style:{stopColor:"#1784d9"}}),h.createElement("stop",{offset:.5,style:{stopColor:"#107ad5"}}),h.createElement("stop",{offset:1,style:{stopColor:"#0a63c9"}})),X||(X=h.createElement("path",{fill:"url(#outlook_svg__b)",d:"M78.055 383.25h780.723c43.109 0 78.055 34.947 78.055 78.055v780.723c0 43.109-34.946 78.055-78.055 78.055H78.055c-43.109 0-78.055-34.947-78.055-78.055V461.305c0-43.108 34.947-78.055 78.055-78.055"})),G||(G=h.createElement("path",{fill:"#FFF",d:"M243.96 710.631a227.05 227.05 0 0 1 89.17-98.495 269.56 269.56 0 0 1 141.675-35.515 250.91 250.91 0 0 1 131.114 33.683 225.014 225.014 0 0 1 86.742 94.109 303.751 303.751 0 0 1 30.405 138.396 320.567 320.567 0 0 1-31.299 144.783 230.37 230.37 0 0 1-89.425 97.388 260.864 260.864 0 0 1-136.011 34.578 256.355 256.355 0 0 1-134.01-34.067 228.497 228.497 0 0 1-87.892-94.28 296.507 296.507 0 0 1-30.745-136.735 329.29 329.29 0 0 1 30.276-143.845m95.046 231.227a147.386 147.386 0 0 0 50.163 64.812 131.028 131.028 0 0 0 78.353 23.591 137.244 137.244 0 0 0 83.634-24.358 141.156 141.156 0 0 0 48.715-64.812 251.594 251.594 0 0 0 15.543-90.404 275.198 275.198 0 0 0-14.649-91.554 144.775 144.775 0 0 0-47.182-67.537 129.58 129.58 0 0 0-82.91-25.55 135.202 135.202 0 0 0-80.184 23.804 148.626 148.626 0 0 0-51.1 65.365 259.759 259.759 0 0 0-.341 186.728z"})),K||(K=h.createElement("path",{fill:"#50D9FF",d:"M1362.667 255.5h383.25v383.25h-383.25z"})))};function re(){return re=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var r in a)Object.prototype.hasOwnProperty.call(a,r)&&(e[r]=a[r])}return e},re.apply(this,arguments)}s.p;var le=function(e){return h.createElement("svg",re({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 48 48"},e),Q||(Q=h.createElement("path",{fill:"#5c6bc0",d:"M42 37a5 5 0 0 1-5 5H11a5 5 0 0 1-5-5V11a5 5 0 0 1 5-5h26a5 5 0 0 1 5 5z"})),ee||(ee=h.createElement("path",{fill:"#fff",d:"M34 13H14a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h20a1 1 0 0 0 1-1V14a1 1 0 0 0-1-1m-1 4-9 4-9-4v-2h18z"})),te||(te=h.createElement("g",{fill:"#fff",transform:"translate(-72.063 127.866)scale(.63072)"},h.createElement("path",{d:"M132.266-150.491h2.385l1.389 3.552 1.407-3.552h2.322l-3.496 8.41h-2.337l.957-2.228zM142.186-150.633c-1.792 0-2.924 1.607-2.924 3.207 0 1.801 1.242 3.228 2.89 3.228 1.23 0 1.693-.749 1.693-.749v.584h2.08v-6.128h-2.08v.557c.001 0-.517-.699-1.659-.699m.443 1.97c.827 0 1.253.654 1.253 1.244 0 .636-.457 1.259-1.253 1.259-.66 0-1.256-.539-1.256-1.232-.001-.703.479-1.271 1.256-1.271M146.642-144.363v-8.834h2.175v3.284s.517-.719 1.599-.719c1.324 0 2.099.986 2.099 2.396v3.873h-2.159v-3.343c0-.477-.227-.938-.742-.938-.524 0-.797.468-.797.938v3.343zM156.224-150.632c-2.052 0-3.274 1.56-3.274 3.232 0 1.902 1.479 3.203 3.281 3.203 1.747 0 3.275-1.241 3.275-3.171.001-2.111-1.599-3.264-3.282-3.264m.02 1.987c.725 0 1.226.604 1.226 1.247 0 .549-.467 1.226-1.226 1.226a1.214 1.214 0 0 1-1.217-1.232c0-.649.433-1.241 1.217-1.241M163.131-150.632c-2.052 0-3.274 1.56-3.274 3.232 0 1.902 1.479 3.203 3.281 3.203 1.747 0 3.275-1.241 3.275-3.171.001-2.111-1.599-3.264-3.282-3.264m.02 1.987c.725 0 1.226.604 1.226 1.247 0 .549-.467 1.226-1.226 1.226a1.214 1.214 0 0 1-1.217-1.232c-.001-.649.433-1.241 1.217-1.241"}),h.createElement("circle",{cx:168.131,cy:-145.677,r:1.445}),h.createElement("path",{d:"M170.05-147.653h-2.601l2.308-5.545h2.591z"}))))};s.p;const ne=h.default.forwardRef((({id:e,className:t="",error:a,...r},l)=>{const n=`cb-input ${t} ${a?"cb-error":""}`;return h.default.createElement("input",{id:e,...r,className:n,autoComplete:r.autoComplete?r.autoComplete:"off",ref:l})})),se=({label:e,type:t,id:a,name:r,value:l,onChange:n,onFocus:s,onBlur:o,error:c,...i})=>{const[u,d]=h.default.useState(!1),m=`cb-form-input ${u?"cb-has-focus":""} ${l?"cb-has-content":""} ${c?"cb-has-error":""}`;return h.default.createElement(h.default.Fragment,null,h.default.createElement("div",{className:m},h.default.createElement(ne,{type:t,id:a||r,name:r,value:l,placeholder:e,onChange:n,onFocus:e=>{d(!0),s&&s(e)},onBlur:e=>{d(!1),o&&o(e)},error:c,...i}),h.default.createElement("label",{htmlFor:a||r},e),c?h.default.createElement("div",{className:"cb-form-input-error"},h.default.createElement("p",{className:"cb-error"},c)):null))},oe=({target:e="_blank",className:t,Icon:a,label:r,...l})=>h.default.createElement("a",{target:e,className:`cb-link-icon ${t}`,...l},h.default.createElement(a,{className:"cb-icon"})," ",h.default.createElement("p",{className:""},r)),ce=({emittedOTP:e,numberOfDigits:t=6,loading:a=!1,error:r})=>{const[l,n]=(0,h.useState)(new Array(t).fill("")),s=(0,h.useRef)([]);(0,h.useEffect)((()=>{s.current[0]&&s.current[0].focus()}),[]),(0,h.useEffect)((()=>{e(l)}),[l]);const o=e=>{e.preventDefault();const t=e.clipboardData.getData("text").slice(0,6).split("");t.every((e=>d.numberRegex.test(e)))&&(n(t.concat(new Array(6-t.length).fill(""))),s.current[t.length-1].focus())};return h.default.createElement("div",{className:"cb-email-otp-input-container"},l.map(((e,t)=>h.default.createElement(ne,{key:t,ref:e=>e&&(s.current[t]=e),id:`otp-${t}`,value:e,type:"tel",inputMode:"numeric",pattern:"[0-9]*",maxLength:1,onChange:e=>((e,t)=>{const a=e.value;if(d.notANumberRegex.test(a))return;const r=t+1;if(l[t]){if(r>=l.length)return;n(l.map(((e,t)=>t===r?a:e))),r+1<l.length&&s.current[r+1].focus()}else n(l.map(((e,r)=>r===t?a:e))),r<l.length&&a&&s.current[r].focus()})(e.target,t),onKeyDown:e=>((e,t)=>{switch(e.key){case"ArrowLeft":t>0&&s.current[t-1].focus();break;case"ArrowRight":t<l.length-1&&s.current[t+1].focus();break;case"Backspace":l[t]?n(l.map(((e,a)=>a===t?"":e))):t>0&&(s.current[t-1].focus(),n(l.map(((e,a)=>a===t-1?"":e))))}})(e,t),onPaste:o,disabled:a,className:"cb-email-otp-input",autoFocus:0===t,error:r}))))},ie=({children:e,className:t=""})=>h.default.createElement("h1",{className:`cb-header ${t}`},e),ue=({children:e,className:t=""})=>h.default.createElement("h2",{className:`cb-subheader ${t}`},e),de=({children:e,className:t=""})=>h.default.createElement("p",{className:`cb-body text-center ${t}`},e),me=({isOpen:e,header:t,body:a,confirmText:r="Yes",cancelText:l="Cancel",inverseButtonVariants:n=!1,onClose:s,onConfirm:o})=>e?h.default.createElement("div",{className:"dialog",onClick:s},h.default.createElement("div",{className:"dialog-content",onClick:e=>e.stopPropagation()},h.default.createElement("div",{className:"dialog-header"},t,h.default.createElement("div",{className:"dialog-x-button",onClick:s},"X")),h.default.createElement("div",{className:"dialog-body"},a),h.default.createElement("div",{className:"dialog-footer"},h.default.createElement(w,{variant:n?"close":"primary",className:"dialog-button",onClick:o},r),h.default.createElement(w,{variant:n?"primary":"close",className:"dialog-button",onClick:s},l)))):null,fe=({header:e,subHeader:t,secondaryHeader:a,body:r,primaryButton:l,secondaryButton:n,tertiaryButton:s,showHorizontalRule:o=!1,onClick:c,primaryLoading:i=!1,secondaryLoading:u=!1,hideFingerPrintIcon:d=!1})=>h.default.createElement("div",{className:"cb-layout-passkey"},h.default.createElement(ie,null,e),t&&h.default.createElement(ue,{className:"cb-subheader-spacing"},t),!d&&h.default.createElement("div",{className:"cb-finger-print-icon"}),a&&h.default.createElement(ie,{className:"cb-secondary-header-spacing"},a),r&&h.default.createElement(de,{className:"cb-body-spacing"},r),l&&h.default.createElement(w,{variant:"primary",onClick:()=>c("primary"),isLoading:i,disabled:i||u},l),o&&h.default.createElement(S,null,"or"),n&&h.default.createElement(w,{variant:"secondary",onClick:()=>c("secondary"),isLoading:u,disabled:i||u},n),s&&h.default.createElement(w,{variant:"tertiary",onClick:()=>c("tertiary"),disabled:i||u},s)),pe=({children:e,onSubmit:t,submitButtonText:a,disableSubmitButton:r,loading:l=!1})=>h.default.createElement("form",{className:"cb-form",onSubmit:e=>{e.preventDefault(),t()}},h.default.createElement("div",{className:"cb-form-body"},e),h.default.createElement(w,{variant:"primary",className:"cb-form-button",disabled:r,isLoading:l},a)),Ee={currentFlow:d.LoginFlowNames.PasskeyLoginWithEmailOTPFallback,currentScreen:d.CommonScreens.Start,currentUserState:{},initialized:!1,navigateBack:()=>d.CommonScreens.Start,emitEvent:()=>Promise.reject()},be=(0,h.createContext)(Ee),ye=(e=be)=>{const t=(0,h.useContext)(e);if(!t)throw new Error("Please make sure that your components are wrapped inside <FlowHandlerProvider />");return t},he=({header:e,body:t,verificationButtonText:a,backButtonText:r,onVerificationButtonClick:l,onBackButtonClick:n})=>{var s;const[o,c]=(0,h.useState)(""),{currentUserState:i}=ye(),[u,d]=(0,h.useState)(!1),m=(0,h.useRef)(null);(0,h.useEffect)((()=>{d(!1)}),[i]);const f=(0,h.useCallback)((e=>{const t=e.join("");c(t),6===t.length&&l(t,d)}),[c]);return h.default.createElement("form",{className:"cb-email-otp",onSubmit:e=>{e.preventDefault(),l(o,d)}},h.default.createElement(ie,null,e),h.default.createElement(de,null,t),h.default.createElement("div",{className:"cb-email-links"},h.default.createElement(oe,{Icon:Y,label:"Google",href:"https://mail.google.com/mail/u/0/#search/from%3A%40corbado+in%3Aanywhere"}),h.default.createElement(oe,{Icon:le,label:"Yahoo",href:"https://mail.yahoo.com/d/search/keyword=corbado.com"}),h.default.createElement(oe,{Icon:ae,label:"Outlook",href:"https://outlook.office.com/mail/0/inbox"})),h.default.createElement(ce,{emittedOTP:f,error:null===(s=i.emailOTPError)||void 0===s?void 0:s.translatedMessage}),i.emailOTPError&&h.default.createElement("p",{className:"cb-error"},i.emailOTPError.translatedMessage),h.default.createElement(w,{type:"submit",ref:m,variant:"primary",isLoading:u,disabled:u},a),h.default.createElement(w,{type:"button",onClick:n,variant:"tertiary",disabled:u},r))},ve={[d.PasskeyLoginWithEmailOtpFallbackScreens.Start]:()=>{var e;const{t}=(0,p.useTranslation)("translation",{keyPrefix:"authenticationFlows.login.start"}),{emitEvent:a,currentUserState:r}=ye(),[l,n]=(0,h.useState)(""),[s,o]=(0,h.useState)(!1),c=(0,h.useRef)(!1);(0,h.useEffect)((()=>{c.current||(c.current=!0,a(d.FlowHandlerEvents.InitConditionalUI))}),[]),(0,h.useEffect)((()=>{o(!1)}),[r]);const i=(0,h.useCallback)((e=>{n(e.target.value)}),[]),u=(0,h.useCallback)((()=>{o(!0),a(d.FlowHandlerEvents.PrimaryButton,{userStateUpdate:{email:l}})}),[l,a]);return h.default.createElement(h.default.Fragment,null,h.default.createElement(ie,null,t("header")),h.default.createElement(ue,null,t("subheader"),h.default.createElement("span",{className:"cb-link-secondary",onClick:()=>{a(d.FlowHandlerEvents.ChangeFlow)}},t("button_signup"))),h.default.createElement(pe,{onSubmit:u,submitButtonText:t("button_submit"),loading:s},h.default.createElement(se,{name:"username",type:"email",autoComplete:"email webauthn",label:t("textField_email"),onChange:i,value:l,error:null===(e=r.emailError)||void 0===e?void 0:e.translatedMessage})))},[d.PasskeyLoginWithEmailOtpFallbackScreens.EnterOtp]:()=>{const{t:e}=(0,p.useTranslation)("translation",{keyPrefix:"authenticationFlows.login.emailOtp"}),{emitEvent:t,currentUserState:a}=ye(),r=e("header"),l=h.default.createElement(h.default.Fragment,null,e("body_text1"),h.default.createElement("span",{className:"cb-text-secondary"},a.email),e("body_text2")),n=e("button_verify"),s=e("button_back"),o=(0,h.useCallback)((()=>t(d.FlowHandlerEvents.CancelOtp)),[]),c=(0,h.useCallback)((async(e,a)=>{a(!0),await t(d.FlowHandlerEvents.PrimaryButton,{emailOTPCode:e})}),[]),i=(0,h.useMemo)((()=>({header:r,body:l,verificationButtonText:n,backButtonText:s,onVerificationButtonClick:c,onBackButtonClick:o})),[e,a.email,c,o,r,l,n,s]);return h.default.createElement(he,{...i})},[d.PasskeyLoginWithEmailOtpFallbackScreens.PasskeyAppend]:()=>{const{t:e}=(0,p.useTranslation)("translation",{keyPrefix:"authenticationFlows.login.passkeyPrompt"}),{emitEvent:t}=ye(),[a,r]=(0,h.useState)(!1),l=(0,h.useMemo)((()=>h.default.createElement("span",null,e("header"),h.default.createElement("span",{className:"cb-link-primary",onClick:()=>{t(d.FlowHandlerEvents.ShowBenefits)}},e("button_showPasskeyBenefits")))),[e]),n=(0,h.useMemo)((()=>e("button_start")),[e]),s=(0,h.useMemo)((()=>e("button_skip")),[e]),o=(0,h.useCallback)((e=>"primary"===e?(r(!0),t(d.FlowHandlerEvents.PrimaryButton)):t(d.FlowHandlerEvents.SecondaryButton)),[t]),c=(0,h.useMemo)((()=>({header:l,primaryButton:n,secondaryButton:s,primaryLoading:a,onClick:o})),[l,n,s,a,o]);return h.default.createElement(h.default.Fragment,null,h.default.createElement(fe,{...c}))},[d.PasskeyLoginWithEmailOtpFallbackScreens.PasskeyError]:()=>{const{t:e}=(0,p.useTranslation)("translation",{keyPrefix:"authenticationFlows.login.passkeyError"}),{shortSession:t}=(0,c.useCorbado)(),{navigateBack:a,emitEvent:r}=ye(),[l,n]=(0,h.useState)(!1),s=(0,h.useMemo)((()=>e("header")),[e]),o=(0,h.useMemo)((()=>e("body")),[e]),i=(0,h.useMemo)((()=>e("button_retry")),[e]),u=(0,h.useMemo)((()=>t?"":e("button_emailOtp")),[e]),m=(0,h.useMemo)((()=>e(t?"button_cancel":"button_back")),[e,t]),f=(0,h.useCallback)((e=>{switch(e){case"primary":return n(!0),r(d.FlowHandlerEvents.PrimaryButton);case"secondary":return r(d.FlowHandlerEvents.SecondaryButton);case"tertiary":return a()}}),[a,r]),E=(0,h.useMemo)((()=>({header:s,body:o,primaryButton:i,secondaryButton:u,tertiaryButton:m,primaryLoading:l,onClick:f})),[o,f,s,i,u,l,m]);return h.default.createElement(h.default.Fragment,null,h.default.createElement(fe,{...E}))},[d.PasskeyLoginWithEmailOtpFallbackScreens.PasskeyBenefits]:()=>{const{t:e}=(0,p.useTranslation)("translation",{keyPrefix:"authenticationFlows.login.passkeyBenefits"}),{emitEvent:t}=ye(),[a,r]=(0,h.useState)(!1),l=(0,h.useMemo)((()=>e("header")),[e]),n=(0,h.useMemo)((()=>h.default.createElement(h.default.Fragment,null,e("body_introduction")," ",h.default.createElement("strong",null,e("body_loginMethods")))),[e]),s=(0,h.useMemo)((()=>e("button_start")),[e]),o=(0,h.useMemo)((()=>e("button_skip")),[e]),c=(0,h.useCallback)((async e=>"primary"===e?(r(!0),t(d.FlowHandlerEvents.PrimaryButton)):t(d.FlowHandlerEvents.SecondaryButton)),[t,r]),i=(0,h.useMemo)((()=>({header:l,body:n,primaryButton:s,secondaryButton:o,primaryLoading:a,onClick:c})),[n,l,s,o,a,c]);return h.default.createElement(h.default.Fragment,null,h.default.createElement(fe,{...i}))}},ge={name:"",fullName:""},ke={[d.PasskeySignupWithEmailOtpFallbackScreens.Start]:()=>{const{t:e}=(0,p.useTranslation)("translation",{keyPrefix:"authenticationFlows.signup.start"}),{currentUserState:t,emitEvent:a}=ye(),[r,l]=(0,h.useState)({...ge}),[n,s]=(0,h.useState)(null),[o,c]=(0,h.useState)(null),[i,u]=(0,h.useState)(!1);(0,h.useEffect)((()=>{u(!1),l({name:t.email||"",fullName:t.fullName||""}),s(null),c(null),t.emailError&&s(t.emailError),t.userNameError&&c(t.userNameError)}),[t]);const m=e=>{const{value:t,name:a}=e.target;l((e=>({...e,[a]:t})))};return h.default.createElement(h.default.Fragment,null,h.default.createElement(ie,null,e("header")),h.default.createElement(ue,null,e("subheader"),h.default.createElement("span",{className:"cb-link-secondary",onClick:()=>{a(d.FlowHandlerEvents.ChangeFlow)}},e("button_login"))),h.default.createElement(pe,{onSubmit:()=>{u(!0),a(d.FlowHandlerEvents.PrimaryButton,{userStateUpdate:{email:r.name,fullName:r.fullName}})},submitButtonText:e("button_submit"),disableSubmitButton:i,loading:i},h.default.createElement(se,{name:"fullName",label:e("textField_name"),onChange:m,value:r.fullName,error:null==o?void 0:o.translatedMessage}),h.default.createElement(se,{name:"name",type:"email",autoComplete:"email",label:e("textField_email"),onChange:m,value:r.name,error:null==n?void 0:n.translatedMessage})))},[d.PasskeySignupWithEmailOtpFallbackScreens.CreatePasskey]:()=>{const{t:e}=(0,p.useTranslation)("translation",{keyPrefix:"authenticationFlows.signup.passkey"}),{navigateBack:t,currentUserState:a,emitEvent:r}=ye(),[l,n]=(0,h.useState)(!1),[s,o]=(0,h.useState)(!1);(0,h.useEffect)((()=>{n(!1),o(!1)}),[a]);const c=(0,h.useMemo)((()=>h.default.createElement("span",null,e("header"),h.default.createElement("span",{className:"cb-link-primary",onClick:()=>{r(d.FlowHandlerEvents.ShowBenefits)}},e("button_showPasskeyBenefits")))),[e]),i=(0,h.useMemo)((()=>h.default.createElement("span",null,e("body")," ",h.default.createElement("span",{className:"cb-text-secondary"},a.email),".")),[e]),u=(0,h.useMemo)((()=>e("button_start")),[e]),m=(0,h.useMemo)((()=>e("button_emailOtp")),[e]),f=(0,h.useMemo)((()=>e("button_back")),[e]),E=(0,h.useCallback)((()=>t()),[t]),b=(0,h.useCallback)((e=>{switch(e){case"primary":return n(!0),r(d.FlowHandlerEvents.PrimaryButton);case"secondary":return o(!0),r(d.FlowHandlerEvents.SecondaryButton);case"tertiary":return t()}}),[E]),y=(0,h.useMemo)((()=>({header:c,subHeader:i,primaryButton:u,showHorizontalRule:!0,secondaryButton:m,tertiaryButton:f,primaryLoading:l,secondaryLoading:s,onClick:b})),[c,i,u,m,f,l,s,b]);return h.default.createElement(h.default.Fragment,null,h.default.createElement(fe,{...y}))},[d.PasskeySignupWithEmailOtpFallbackScreens.EnterOtp]:()=>{const{t:e}=(0,p.useTranslation)("translation",{keyPrefix:"authenticationFlows.signup.emailOtp"}),{emitEvent:t,currentUserState:a}=ye(),r=e("header"),l=h.default.createElement(h.default.Fragment,null,e("body_text1"),h.default.createElement("span",{className:"cb-text-secondary"},a.email),e("body_text2")),n=e("button_verify"),s=e("button_back"),o=(0,h.useCallback)((()=>t(d.FlowHandlerEvents.SecondaryButton)),[]),c=(0,h.useCallback)((async(e,a)=>{a(!0),await t(d.FlowHandlerEvents.PrimaryButton,{emailOTPCode:e})}),[]),i=(0,h.useMemo)((()=>({header:r,body:l,verificationButtonText:n,backButtonText:s,onVerificationButtonClick:c,onBackButtonClick:o})),[e,a,c,o,r,l,n,s]);return h.default.createElement(he,{...i})},[d.PasskeySignupWithEmailOtpFallbackScreens.PasskeyAppend]:()=>{const{t:e}=(0,p.useTranslation)("translation",{keyPrefix:"authenticationFlows.signup.passkeyPrompt"}),{emitEvent:t}=ye(),[a,r]=(0,h.useState)(!1),l=(0,h.useMemo)((()=>h.default.createElement("span",null,e("header"),h.default.createElement("span",{className:"cb-link-primary",onClick:()=>{t(d.FlowHandlerEvents.ShowBenefits)}},e("button_showPasskeyBenefits")))),[e]),n=(0,h.useMemo)((()=>e("button_start")),[e]),s=(0,h.useMemo)((()=>e("button_skip")),[e]),o=(0,h.useCallback)((e=>"primary"===e?(r(!0),t(d.FlowHandlerEvents.PrimaryButton)):t(d.FlowHandlerEvents.SecondaryButton)),[t]),c=(0,h.useMemo)((()=>({header:l,primaryButton:n,secondaryButton:s,onClick:o,loading:a})),[l,n,s,a,o]);return h.default.createElement(h.default.Fragment,null,h.default.createElement(fe,{...c}))},[d.PasskeySignupWithEmailOtpFallbackScreens.PasskeyBenefits]:()=>{const{t:e}=(0,p.useTranslation)("translation",{keyPrefix:"authenticationFlows.signup.passkeyBenefits"}),{navigateBack:t,emitEvent:a}=ye(),[r,l]=(0,h.useState)(!1),[n,s]=(0,h.useState)(!1),o=(0,h.useMemo)((()=>e("header")),[e]),c=(0,h.useMemo)((()=>h.default.createElement(h.default.Fragment,null,e("body_introduction")," ",h.default.createElement("strong",null,e("body_loginMethods")))),[e]),i=(0,h.useMemo)((()=>e("button_start")),[e]),u=(0,h.useMemo)((()=>e("button_skip")),[e]),m=(0,h.useCallback)((e=>{switch(e){case"primary":return l(!0),a(d.FlowHandlerEvents.PrimaryButton);case"secondary":return s(!0),a(d.FlowHandlerEvents.SecondaryButton);case"tertiary":return t()}}),[t,a]),f=(0,h.useMemo)((()=>({header:o,body:c,primaryButton:i,secondaryButton:u,primaryLoading:r,secondaryLoading:n,onClick:m})),[c,o,i,u,r,n,m]);return h.default.createElement(h.default.Fragment,null,h.default.createElement(fe,{...f}))},[d.PasskeySignupWithEmailOtpFallbackScreens.PasskeyWelcome]:()=>{const{t:e}=(0,p.useTranslation)("translation",{keyPrefix:"authenticationFlows.signup.passkeySuccess"}),{emitEvent:t}=ye(),a=(0,h.useMemo)((()=>e("header")),[e]),r=(0,h.useMemo)((()=>e("subheader")),[e]),l=(0,h.useMemo)((()=>h.default.createElement("span",null,e("body_text1")," ",h.default.createElement("strong",null,e("body_text2"))," ",e("body_text3"))),[e]),n=(0,h.useMemo)((()=>e("button")),[e]),s=(0,h.useCallback)((()=>{t(d.FlowHandlerEvents.PrimaryButton)}),[t]),o=(0,h.useMemo)((()=>({header:a,secondaryHeader:r,body:l,primaryButton:n,onClick:s})),[a,r,l,n,s]);return h.default.createElement(h.default.Fragment,null,h.default.createElement(fe,{...o}))},[d.PasskeySignupWithEmailOtpFallbackScreens.PasskeyError]:()=>{const{t:e}=(0,p.useTranslation)("translation",{keyPrefix:"authenticationFlows.signup.passkeyError"}),{shortSession:t}=(0,c.useCorbado)(),{navigateBack:a,emitEvent:r}=ye(),[l,n]=(0,h.useState)(!1),[s,o]=(0,h.useState)(!1),i=(0,h.useMemo)((()=>e("header")),[e]),u=(0,h.useMemo)((()=>h.default.createElement("span",null,e("body_errorMessage1"),h.default.createElement("span",{className:"cb-link-primary",onClick:()=>{r(d.FlowHandlerEvents.ShowBenefits)}},e("button_showPasskeyBenefits")),e("body_errorMessage2"))),[e]),m=(0,h.useMemo)((()=>e("button_retry")),[e]),f=(0,h.useMemo)((()=>t?"":e("button_emailOtp")),[e]),E=(0,h.useMemo)((()=>e(t?"button_cancel":"button_back")),[e,t]),b=(0,h.useCallback)((e=>{switch(e){case"primary":return n(!0),r(d.FlowHandlerEvents.PrimaryButton);case"secondary":return o(!0),r(d.FlowHandlerEvents.SecondaryButton);case"tertiary":return a()}}),[a,r]),y=(0,h.useMemo)((()=>({header:i,body:u,primaryButton:m,secondaryButton:f,tertiaryButton:E,primaryLoading:l,secondaryLoading:s,onClick:b})),[u,b,i,m,f,l,f,E]);return h.default.createElement(h.default.Fragment,null,h.default.createElement(fe,{...y}))}},we={[d.SignUpFlowNames.PasskeySignupWithEmailOTPFallback]:ke,[d.LoginFlowNames.PasskeyLoginWithEmailOTPFallback]:ve},Se=()=>h.default.createElement("div",{className:"cb-loading"},h.default.createElement(g,null)),Ce=({error:e})=>h.default.createElement("div",{className:"container"},h.default.createElement("div",{className:"title"},e.name," ",h.default.createElement("br",null),"(","client"===e.type?"client side":"server side",")"),h.default.createElement("div",{className:"error-details"},h.default.createElement("div",{className:"error-detail-row"},h.default.createElement("div",{className:"error-detail-title"},":Message"),h.default.createElement("div",{className:"error-detail-value"},e.message)),h.default.createElement("div",{className:"error-detail-row"},h.default.createElement("div",{className:"error-detail-title"},":Type"),h.default.createElement("div",{className:"error-detail-value"},e.detailedType)),h.default.createElement("div",{className:"error-detail-row"},h.default.createElement("div",{className:"error-detail-title"},":Link"),h.default.createElement("a",{className:"error-detail-value",href:e.link},e.link))),h.default.createElement("div",{className:"error-detail-row"},h.default.createElement("div",{className:"error-detail-title"},":RequestID"),h.default.createElement("div",{className:"error-detail-value"},e.requestId)),e.details&&h.default.createElement("button",{className:"error-button",onClick:()=>{window.open(e.details,"_blank")}},"See browser console for more details")),Fe=e=>{const{t}=(0,p.useTranslation)("translation",{keyPrefix:"authenticationFlows.unexpectedError"});return h.default.createElement("div",{className:"error-page"},h.default.createElement("div",{className:"prod-error-container"},h.default.createElement("div",{className:"prod-error-title"},t("header")),h.default.createElement("div",{className:"prod-error-details"},h.default.createElement("div",{className:"prod-error-apology"},t("subheader")),h.default.createElement("div",null,e?t("body_withCustomerSupport",e):t("body_noCustomerSupport"))),h.default.createElement("button",{className:"prod-error-button",onClick:()=>window.location.reload()},t("button"))))};class Ne extends h.default.Component{constructor(e){super(e),this.state={error:void 0}}static getDerivedStateFromError(e){return console.error(e),{hasError:!0}}componentDidCatch(e,t){console.error(e,t)}render(){return!this.props.globalError&&!this.state.error||this.props.isDevMode?this.props.globalError?h.default.createElement("div",{className:"error-page"},h.default.createElement(Ce,{error:this.props.globalError})):this.props.children:h.default.createElement(Fe,{customerSupportEmail:this.props.customerSupportEmail})}}const Me=({isDevMode:e,customerSupportEmail:t})=>{const{currentFlow:a,currentScreen:r,initialized:l}=ye(),{globalError:n}=(0,c.useCorbado)(),[s,o]=(0,h.useState)({});(0,h.useEffect)((()=>{const e=we[a];o(null!=e?e:{})}),[a]);const i=(0,h.useMemo)((()=>s[r]),[s,r]),u=(0,h.useCallback)((()=>{const e=s[d.CommonScreens.End];return e?h.default.createElement(e,null):null}),[s]);return h.default.createElement(Ne,{globalError:n,isDevMode:e,customerSupportEmail:t},l?i?h.default.createElement(i,null):h.default.createElement(u,null):h.default.createElement(Se,null))},Pe=({children:e,...t})=>{const{corbadoApp:a,getProjectConfig:r,user:l}=(0,c.useCorbado)(),[n,s]=(0,h.useState)(),[o,i]=(0,h.useState)(d.CommonScreens.Start),[u,f]=(0,h.useState)({}),[p,E]=(0,h.useState)(d.SignUpFlowNames.PasskeySignupWithEmailOTPFallback),[b,y]=(0,h.useState)(!1),v=(0,h.useRef)(0),g=(0,h.useRef)(0),k=(0,h.useRef)(0);(0,h.useEffect)((()=>{if(!b)return(async()=>{const e=await r();if(e.err)return;const l=new d.FlowHandler(e.val,t.onLoggedIn);v.current=l.onScreenChange((e=>i(e))),g.current=l.onFlowChange((e=>E(e))),k.current=l.onUserStateChange((e=>{f(e)})),await l.init(a,m.default),s(l),y(!0)})(),()=>{null==n||n.removeOnFlowChangeCallback(g.current),null==n||n.removeOnScreenChangeCallback(v.current),null==n||n.removeOnUserStateChange(k.current)}}),[]),(0,h.useEffect)((()=>{b&&l&&(null==n||n.update(l))}),[b,l]);const w=(0,h.useCallback)((()=>{var e;return null!==(e=null==n?void 0:n.navigateBack())&&void 0!==e?e:d.CommonScreens.Start}),[n]),S=(0,h.useCallback)(((e,t)=>null==n?void 0:n.handleStateUpdate(e,t)),[n]),C=(0,h.useMemo)((()=>({currentFlow:p,currentScreen:o,currentUserState:u,initialized:b,navigateBack:w,emitEvent:S})),[p,o,u,b,w]);return h.default.createElement(be.Provider,{value:C},e)},Be=({onLoggedIn:e,isDevMode:t=!1,customerSupportEmail:a=""})=>h.default.createElement("div",{className:"cb-container"},h.default.createElement(Pe,{onLoggedIn:e},h.default.createElement(Me,{isDevMode:t,customerSupportEmail:a}))),xe=h.default.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 -960 960 960"},h.default.createElement("path",{d:"M120-160v-112q0-34 17.5-62.5T184-378q62-31 126-46.5T440-440q20 0 40 1.5t40 4.5q-4 58 21 109.5t73 84.5v80H120ZM760-40l-60-60v-186q-44-13-72-49.5T600-420q0-58 41-99t99-41q58 0 99 41t41 99q0 45-25.5 80T790-290l50 50-60 60 60 60-80 80ZM440-480q-66 0-113-47t-47-113q0-66 47-113t113-47q66 0 113 47t47 113q0 66-47 113t-113 47Zm300 80q17 0 28.5-11.5T780-440q0-17-11.5-28.5T740-480q-17 0-28.5 11.5T700-440q0 17 11.5 28.5T740-400Z"})),_e=({aaguid:e})=>{var t,a;const r=d.aaguidMappings[e],l=(0,d.hasDarkMode)()&&null!==(t=null==r?void 0:r.iconDark)&&void 0!==t?t:null==r?void 0:r.icon;return h.default.createElement("div",{className:"cb-passkey-list-icon"},l?h.default.createElement("img",{src:l,alt:null!==(a=null==r?void 0:r.name)&&void 0!==a?a:"Passkey"}):h.default.createElement(h.default.Fragment,null,xe))},Te=({passkeyId:e,onPasskeyDelete:t})=>{const{t:a}=(0,p.useTranslation)("translation",{keyPrefix:"passkeysList"}),[r,l]=(0,h.useState)(!1),n=()=>{l(!1)};return h.default.createElement("div",{className:"cb-passkey-list-icon"},h.default.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",className:"cb-passkey-list-delete",onClick:()=>{l(!0)}},h.default.createElement("path",{d:"M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"})),h.default.createElement(me,{inverseButtonVariants:!0,isOpen:r,header:a("deleteDialog_header"),body:a("deleteDialog_body"),confirmText:a("deleteDialog_deleteButton"),cancelText:a("deleteDialog_cancelButton"),onClose:n,onConfirm:()=>{n(),t(e)}}))},He=({passkey:e})=>{var t,a;const{t:r}=(0,p.useTranslation)("translation",{keyPrefix:"passkeysList"}),l=(0,d.getParsedUA)(e.userAgent),n=null!==(a=null===(t=d.aaguidMappings[e.aaguid])||void 0===t?void 0:t.name)&&void 0!==a?a:"Passkey";return h.default.createElement("div",{className:"cb-passkey-list-details"},h.default.createElement("div",{className:"cb-passkey-list-header"},h.default.createElement("div",{className:"cb-passkey-list-header-title"},n),e.backupState?h.default.createElement("div",{className:"cb-passkey-list-header-badge"},r("badge_synced")):null),h.default.createElement("div",null,r("field_credentialId"),e.id),h.default.createElement("div",null,h.default.createElement(p.Trans,{i18nKey:"field_created",t:r,values:{date:e.created,browser:l.browser.name,os:l.os.name}})),h.default.createElement("div",null,r("field_lastUsed"),e.lastUsed),h.default.createElement("div",null,r("field_status"),e.status))},Oe=()=>{const{getPasskeys:e,appendPasskey:t,deletePasskey:a,shortSession:r}=(0,c.useCorbado)(),{t:l}=(0,p.useTranslation)("translation",{keyPrefix:"passkeysList"}),[n,s]=(0,h.useState)();(0,h.useEffect)((()=>{r&&o()}),[]);const o=async()=>{const t=await e();if(t.err)throw new Error(t.val.name);s(t.val)},i=async e=>{await a(e),await o()};return r?h.default.createElement("div",null,n?n.passkeys.map((e=>h.default.createElement("div",{key:e.id,className:"cb-passkey-list-card"},h.default.createElement(_e,{aaguid:e.aaguid}),h.default.createElement(He,{passkey:e}),h.default.createElement(Te,{passkeyId:e.id,onPasskeyDelete:i})))):h.default.createElement(g,null),n&&0===n.passkeys.length?h.default.createElement("div",null,l("message_noPasskeys")):null,h.default.createElement(w,{variant:"primary",className:"cb-passkey-list-primary-button",onClick:()=>{(async()=>{await t(),await o()})()}},l("button_createPasskey"))):h.default.createElement("div",null,l("warning_notLoggedIn"))};var Le=o.rX,De=o.Hg,ze=o.BN,Ae=o.XZ,Ue=o.km;export{Le as CorbadoAuth,De as CorbadoProvider,ze as CorbadoThemes,Ae as PasskeyList,Ue as useCorbado}; | ||
import*as e from"@corbado/react-sdk";import*as t from"@corbado/shared-ui";import*as a from"i18next";import*as n from"i18next-browser-languagedetector";import*as r from"react-i18next";import*as l from"react";var s={d:(e,t)=>{for(var a in t)s.o(t,a)&&!s.o(e,a)&&Object.defineProperty(e,a,{enumerable:!0,get:t[a]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t)},o={};s.d(o,{rX:()=>X,Hg:()=>k,BN:()=>d.CorbadoThemes,XZ:()=>te,km:()=>u.useCorbado});const u=(i={CorbadoProvider:()=>e.CorbadoProvider,useCorbado:()=>e.useCorbado},c={},s.d(c,i),c);var i,c;const d=(e=>{var t={};return s.d(t,e),t})({AssetsList:()=>t.AssetsList,CommonScreens:()=>t.CommonScreens,CorbadoThemes:()=>t.CorbadoThemes,FlowHandler:()=>t.FlowHandler,FlowHandlerEvents:()=>t.FlowHandlerEvents,LoginFlowNames:()=>t.LoginFlowNames,PasskeyLoginWithEmailOtpFallbackScreens:()=>t.PasskeyLoginWithEmailOtpFallbackScreens,PasskeySignupWithEmailOtpFallbackScreens:()=>t.PasskeySignupWithEmailOtpFallbackScreens,SignUpFlowNames:()=>t.SignUpFlowNames,aaguidMappings:()=>t.aaguidMappings,getParsedUA:()=>t.getParsedUA,handleTheming:()=>t.handleTheming,hasDarkMode:()=>t.hasDarkMode,i18n:()=>t.i18n,notANumberRegex:()=>t.notANumberRegex,numberRegex:()=>t.numberRegex}),m=(e=>{var t={};return s.d(t,e),t})({default:()=>a.default}),f=(e=>{var t={};return s.d(t,e),t})({default:()=>n.default}),b=(e=>{var t={};return s.d(t,e),t})({Trans:()=>r.Trans,initReactI18next:()=>r.initReactI18next,useTranslation:()=>r.useTranslation}),E="en";m.default.use(b.initReactI18next).use(f.default).init({resources:{en:{translation:d.i18n.en},de:{translation:d.i18n.de}},keySeparator:".",fallbackLng:E});const y=e=>{var t;null===(t=null===document||void 0===document?void 0:document.querySelector("html"))||void 0===t||t.setAttribute("lang",e)},p=(e=!0,t=E,a=null)=>{const n=window.navigator.language;if(e&&t===E&&n===E&&!a)return;for(const[e,t]of Object.entries(null!=a?a:{}))m.default.addResourceBundle(e,"translation",t,!0,!0);const r=e?(e=>e.split("-")[0])(n):t;try{m.default.changeLanguage(r),y(r)}catch{m.default.changeLanguage(t),y(t)}},g=(e=>{var t={};return s.d(t,e),t})({createContext:()=>l.createContext,default:()=>l.default,forwardRef:()=>l.forwardRef,memo:()=>l.memo,useCallback:()=>l.useCallback,useContext:()=>l.useContext,useEffect:()=>l.useEffect,useMemo:()=>l.useMemo,useRef:()=>l.useRef,useState:()=>l.useState}),k=({children:e,...t})=>{const{defaultLanguage:a,autoDetectLanguage:n,customTranslations:r,darkMode:l,theme:s,...o}=t;return(0,g.useEffect)((()=>(p(n,a,r),(0,d.handleTheming)(null!=l?l:"auto",s))),[]),g.default.createElement(u.CorbadoProvider,{...o},e)},v=(0,g.memo)((({variant:e="primary",className:t=""})=>{const a=`${"primary"===e?"cb-spinner-primary":"cb-spinner-secondary"} ${t}`;return g.default.createElement("div",{className:a})}),((e,t)=>e.variant===t.variant&&e.className===t.className)),h={primary:"cb-button-primary",secondary:"cb-button-secondary",tertiary:"cb-button-tertiary",close:"cb-button-primary cb-button-close"},w=(0,g.forwardRef)((({variant:e="tertiary",isLoading:t=!1,className:a="",disabled:n,children:r,...l},s)=>{const o=`${h[e]} ${a}`;return g.default.createElement("button",{className:o,disabled:n,ref:s,...l},t?g.default.createElement(v,null):r)})),S=({children:e,className:t=""})=>g.default.createElement("div",{className:`cb-horizontal-divider ${t}`},e),C=({url:e,name:t="",className:a=""})=>g.default.createElement("img",{src:e,alt:t,className:a}),N=g.default.forwardRef((({id:e,className:t="",error:a,...n},r)=>{const l=`cb-input ${t} ${a?"cb-error":""}`;return g.default.createElement("input",{id:e,...n,className:l,autoComplete:n.autoComplete?n.autoComplete:"off",ref:r})})),F=({label:e,type:t,id:a,name:n,value:r,onChange:l,onFocus:s,onBlur:o,error:u,...i})=>{const[c,d]=g.default.useState(!1),m=`cb-form-input ${c?"cb-has-focus":""} ${r?"cb-has-content":""} ${u?"cb-has-error":""}`;return g.default.createElement(g.default.Fragment,null,g.default.createElement("div",{className:m},g.default.createElement(N,{type:t,id:a||n,name:n,value:r,placeholder:e,onChange:l,onFocus:e=>{d(!0),s&&s(e)},onBlur:e=>{d(!1),o&&o(e)},error:u,...i}),g.default.createElement("label",{htmlFor:a||n},e),u?g.default.createElement("div",{className:"cb-form-input-error"},g.default.createElement("p",{className:"cb-error"},u)):null))},P=({target:e="_blank",className:t,icon:a,label:n,...r})=>g.default.createElement("a",{target:e,className:`cb-link-icon ${t||""}`,...r},g.default.createElement(C,{className:"cb-icon",...a})," ",g.default.createElement("p",null,n)),B=({emittedOTP:e,numberOfDigits:t=6,loading:a=!1,error:n})=>{const[r,l]=(0,g.useState)(new Array(t).fill("")),s=(0,g.useRef)([]);(0,g.useEffect)((()=>{s.current[0]&&s.current[0].focus()}),[]),(0,g.useEffect)((()=>{e(r)}),[r]);const o=e=>{e.preventDefault();const t=e.clipboardData.getData("text").slice(0,6).split("");t.every((e=>d.numberRegex.test(e)))&&(l(t.concat(new Array(6-t.length).fill(""))),s.current[t.length-1].focus())};return g.default.createElement("div",{className:"cb-email-otp-input-container"},r.map(((e,t)=>g.default.createElement(N,{key:t,ref:e=>e&&(s.current[t]=e),id:`otp-${t}`,value:e,type:"tel",inputMode:"numeric",pattern:"[0-9]*",maxLength:1,onChange:e=>((e,t)=>{const a=e.value;if(d.notANumberRegex.test(a))return;const n=t+1;if(r[t]){if(n>=r.length)return;l(r.map(((e,t)=>t===n?a:e))),n+1<r.length&&s.current[n+1].focus()}else l(r.map(((e,n)=>n===t?a:e))),n<r.length&&a&&s.current[n].focus()})(e.target,t),onKeyDown:e=>((e,t)=>{switch(e.key){case"ArrowLeft":t>0&&s.current[t-1].focus();break;case"ArrowRight":t<r.length-1&&s.current[t+1].focus();break;case"Backspace":r[t]?l(r.map(((e,a)=>a===t?"":e))):t>0&&(s.current[t-1].focus(),l(r.map(((e,a)=>a===t-1?"":e))))}})(e,t),onPaste:o,disabled:a,className:"cb-email-otp-input",autoFocus:0===t,error:n}))))},x=({children:e,className:t=""})=>g.default.createElement("h1",{className:`cb-header ${t}`},e),M=({children:e,className:t=""})=>g.default.createElement("h2",{className:`cb-subheader ${t}`},e),_=({children:e,className:t=""})=>g.default.createElement("p",{className:`cb-body text-center ${t}`},e),T=({isOpen:e,header:t,body:a,confirmText:n="Yes",cancelText:r,inverseButtonVariants:l=!1,onClose:s,onConfirm:o})=>{const[u,i]=g.default.useState(!1),[c,d]=g.default.useState(!1);if(!e)return null;const m=async()=>{s&&(i(!0),await s(),i(!1))};return g.default.createElement("div",{className:"cb-dialog",onClick:()=>{m()}},g.default.createElement("div",{className:"cb-dialog-content",onClick:e=>e.stopPropagation()},g.default.createElement("div",{className:"cb-dialog-header"},t,g.default.createElement("div",{className:"cb-dialog-x-button",onClick:()=>{m()}},"X")),a?g.default.createElement("div",{className:"cb-dialog-body"},a):null,g.default.createElement("div",{className:"cb-dialog-footer"},g.default.createElement(w,{variant:l?"close":"primary",className:"cb-dialog-button",isLoading:c,disabled:c||u,onClick:()=>{(async()=>{o&&(d(!0),await o(),d(!1))})()}},n),r?g.default.createElement(w,{variant:l?"primary":"close",className:"cb-dialog-button",isLoading:u,disabled:c||u,onClick:()=>{m()}},r):null)))},L=({header:e,subHeader:t,secondaryHeader:a,body:n,primaryButton:r,secondaryButton:l,tertiaryButton:s,showHorizontalRule:o=!1,onClick:u,primaryLoading:i=!1,secondaryLoading:c=!1,hideFingerPrintIcon:d=!1})=>g.default.createElement("div",{className:"cb-layout-passkey"},g.default.createElement(x,null,e),t&&g.default.createElement(M,{className:"cb-subheader-spacing"},t),!d&&g.default.createElement("div",{className:"cb-finger-print-icon"}),a&&g.default.createElement(x,{className:"cb-secondary-header-spacing"},a),n&&g.default.createElement(_,{className:"cb-body-spacing"},n),r&&g.default.createElement(w,{variant:"primary",onClick:()=>u("primary"),isLoading:i,disabled:i||c},r),o&&g.default.createElement(S,null,"or"),l&&g.default.createElement(w,{variant:"secondary",onClick:()=>u("secondary"),isLoading:c,disabled:i||c},l),s&&g.default.createElement(w,{variant:"tertiary",onClick:()=>u("tertiary"),disabled:i||c},s)),O=({children:e,onSubmit:t,submitButtonText:a,disableSubmitButton:n,loading:r=!1})=>g.default.createElement("form",{className:"cb-form",onSubmit:e=>{e.preventDefault(),t()}},g.default.createElement("div",{className:"cb-form-body"},e),g.default.createElement(w,{variant:"primary",className:"cb-form-button",disabled:n,isLoading:r},a)),H={currentFlow:d.LoginFlowNames.PasskeyLoginWithEmailOTPFallback,currentScreen:d.CommonScreens.Start,currentUserState:{},initialized:!1,navigateBack:()=>d.CommonScreens.Start,emitEvent:()=>Promise.reject()},A=(0,g.createContext)(H),R=(e=A)=>{const t=(0,g.useContext)(e);if(!t)throw new Error("Please make sure that your components are wrapped inside <FlowHandlerProvider />");return t},U=({header:e,body:t,verificationButtonText:a,backButtonText:n,onVerificationButtonClick:r,onBackButtonClick:l})=>{var s;const[o,u]=(0,g.useState)(""),{currentUserState:i}=R(),[c,m]=(0,g.useState)(!1),f=(0,g.useRef)(null);(0,g.useEffect)((()=>{m(!1)}),[i]);const b=(0,g.useCallback)((e=>{const t=e.join("");u(t),6===t.length&&r(t,m)}),[u]);return g.default.createElement("form",{className:"cb-email-otp",onSubmit:e=>{e.preventDefault(),r(o,m)}},g.default.createElement(x,null,e),g.default.createElement(_,null,t),g.default.createElement("div",{className:"cb-email-links"},g.default.createElement(P,{icon:d.AssetsList.GmailSVG,label:"Google",href:"https://mail.google.com/mail/u/0/#search/from%3A%40corbado+in%3Aanywhere"}),g.default.createElement(P,{icon:d.AssetsList.YahooSVG,label:"Yahoo",href:"https://mail.yahoo.com/d/search/keyword=corbado.com"}),g.default.createElement(P,{icon:d.AssetsList.OutlookSVG,label:"Outlook",href:"https://outlook.office.com/mail/0/inbox"})),g.default.createElement(B,{emittedOTP:b,error:null===(s=i.emailOTPError)||void 0===s?void 0:s.translatedMessage}),i.emailOTPError&&g.default.createElement("p",{className:"cb-error"},i.emailOTPError.translatedMessage),g.default.createElement(w,{type:"submit",ref:f,variant:"primary",isLoading:c,disabled:c},a),g.default.createElement(w,{type:"button",onClick:l,variant:"tertiary",disabled:c},n))},D={[d.PasskeyLoginWithEmailOtpFallbackScreens.Start]:()=>{var e;const{t}=(0,b.useTranslation)("translation",{keyPrefix:"authenticationFlows.login.start"}),{emitEvent:a,currentUserState:n}=R(),[r,l]=(0,g.useState)(""),[s,o]=(0,g.useState)(!1),u=(0,g.useRef)(!1);(0,g.useEffect)((()=>{u.current||(u.current=!0,a(d.FlowHandlerEvents.InitConditionalUI))}),[]),(0,g.useEffect)((()=>{o(!1)}),[n]);const i=(0,g.useCallback)((e=>{l(e.target.value)}),[]),c=(0,g.useCallback)((()=>{o(!0),a(d.FlowHandlerEvents.PrimaryButton,{userStateUpdate:{email:r}})}),[r,a]);return g.default.createElement(g.default.Fragment,null,g.default.createElement(x,null,t("header")),g.default.createElement(M,null,t("subheader"),g.default.createElement("span",{className:"cb-link-secondary",onClick:()=>{a(d.FlowHandlerEvents.ChangeFlow)}},t("button_signup"))),g.default.createElement(O,{onSubmit:c,submitButtonText:t("button_submit"),loading:s},g.default.createElement(F,{name:"username",type:"email",autoComplete:"email webauthn",label:t("textField_email"),onChange:i,value:r,error:null===(e=n.emailError)||void 0===e?void 0:e.translatedMessage})))},[d.PasskeyLoginWithEmailOtpFallbackScreens.EnterOtp]:()=>{const{t:e}=(0,b.useTranslation)("translation",{keyPrefix:"authenticationFlows.login.emailOtp"}),{emitEvent:t,currentUserState:a}=R(),n=e("header"),r=g.default.createElement(g.default.Fragment,null,e("body_text1"),g.default.createElement("span",{className:"cb-text-secondary"},a.email),e("body_text2")),l=e("button_verify"),s=e("button_back"),o=(0,g.useCallback)((()=>t(d.FlowHandlerEvents.CancelOtp)),[]),u=(0,g.useCallback)((async(e,a)=>{a(!0),await t(d.FlowHandlerEvents.PrimaryButton,{emailOTPCode:e})}),[]),i=(0,g.useMemo)((()=>({header:n,body:r,verificationButtonText:l,backButtonText:s,onVerificationButtonClick:u,onBackButtonClick:o})),[e,a.email,u,o,n,r,l,s]);return g.default.createElement(U,{...i})},[d.PasskeyLoginWithEmailOtpFallbackScreens.PasskeyAppend]:()=>{const{t:e}=(0,b.useTranslation)("translation",{keyPrefix:"authenticationFlows.login.passkeyPrompt"}),{emitEvent:t}=R(),[a,n]=(0,g.useState)(!1),r=(0,g.useMemo)((()=>g.default.createElement("span",null,e("header"),g.default.createElement("span",{className:"cb-link-primary",onClick:()=>{t(d.FlowHandlerEvents.ShowBenefits)}},e("button_showPasskeyBenefits")))),[e]),l=(0,g.useMemo)((()=>e("button_start")),[e]),s=(0,g.useMemo)((()=>e("button_skip")),[e]),o=(0,g.useCallback)((e=>"primary"===e?(n(!0),t(d.FlowHandlerEvents.PrimaryButton)):t(d.FlowHandlerEvents.SecondaryButton)),[t]),u=(0,g.useMemo)((()=>({header:r,primaryButton:l,secondaryButton:s,primaryLoading:a,onClick:o})),[r,l,s,a,o]);return g.default.createElement(g.default.Fragment,null,g.default.createElement(L,{...u}))},[d.PasskeyLoginWithEmailOtpFallbackScreens.PasskeyError]:()=>{const{t:e}=(0,b.useTranslation)("translation",{keyPrefix:"authenticationFlows.login.passkeyError"}),{shortSession:t}=(0,u.useCorbado)(),{navigateBack:a,emitEvent:n}=R(),[r,l]=(0,g.useState)(!1),s=(0,g.useMemo)((()=>e("header")),[e]),o=(0,g.useMemo)((()=>e("body")),[e]),i=(0,g.useMemo)((()=>e("button_retry")),[e]),c=(0,g.useMemo)((()=>t?"":e("button_emailOtp")),[e]),m=(0,g.useMemo)((()=>e(t?"button_cancel":"button_back")),[e,t]),f=(0,g.useCallback)((e=>{switch(e){case"primary":return l(!0),n(d.FlowHandlerEvents.PrimaryButton);case"secondary":return n(d.FlowHandlerEvents.SecondaryButton);case"tertiary":return a()}}),[a,n]),E=(0,g.useMemo)((()=>({header:s,body:o,primaryButton:i,secondaryButton:c,tertiaryButton:m,primaryLoading:r,onClick:f})),[o,f,s,i,c,r,m]);return g.default.createElement(g.default.Fragment,null,g.default.createElement(L,{...E}))},[d.PasskeyLoginWithEmailOtpFallbackScreens.PasskeyBenefits]:()=>{const{t:e}=(0,b.useTranslation)("translation",{keyPrefix:"authenticationFlows.login.passkeyBenefits"}),{emitEvent:t}=R(),[a,n]=(0,g.useState)(!1),r=(0,g.useMemo)((()=>e("header")),[e]),l=(0,g.useMemo)((()=>g.default.createElement(g.default.Fragment,null,e("body_introduction")," ",g.default.createElement("strong",null,e("body_loginMethods")))),[e]),s=(0,g.useMemo)((()=>e("button_start")),[e]),o=(0,g.useMemo)((()=>e("button_skip")),[e]),u=(0,g.useCallback)((async e=>"primary"===e?(n(!0),t(d.FlowHandlerEvents.PrimaryButton)):t(d.FlowHandlerEvents.SecondaryButton)),[t,n]),i=(0,g.useMemo)((()=>({header:r,body:l,primaryButton:s,secondaryButton:o,primaryLoading:a,onClick:u})),[l,r,s,o,a,u]);return g.default.createElement(g.default.Fragment,null,g.default.createElement(L,{...i}))}},W={name:"",fullName:""},q={[d.PasskeySignupWithEmailOtpFallbackScreens.Start]:()=>{const{t:e}=(0,b.useTranslation)("translation",{keyPrefix:"authenticationFlows.signup.start"}),{currentUserState:t,emitEvent:a}=R(),[n,r]=(0,g.useState)({...W}),[l,s]=(0,g.useState)(null),[o,u]=(0,g.useState)(null),[i,c]=(0,g.useState)(!1);(0,g.useEffect)((()=>{c(!1),r({name:t.email||"",fullName:t.fullName||""}),s(null),u(null),t.emailError&&s(t.emailError),t.userNameError&&u(t.userNameError)}),[t]);const m=e=>{const{value:t,name:a}=e.target;r((e=>({...e,[a]:t})))};return g.default.createElement(g.default.Fragment,null,g.default.createElement(x,null,e("header")),g.default.createElement(M,null,e("subheader"),g.default.createElement("span",{className:"cb-link-secondary",onClick:()=>{a(d.FlowHandlerEvents.ChangeFlow)}},e("button_login"))),g.default.createElement(O,{onSubmit:()=>{c(!0),a(d.FlowHandlerEvents.PrimaryButton,{userStateUpdate:{email:n.name,fullName:n.fullName}})},submitButtonText:e("button_submit"),disableSubmitButton:i,loading:i},g.default.createElement(F,{name:"fullName",label:e("textField_name"),onChange:m,value:n.fullName,error:null==o?void 0:o.translatedMessage}),g.default.createElement(F,{name:"name",type:"email",autoComplete:"email",label:e("textField_email"),onChange:m,value:n.name,error:null==l?void 0:l.translatedMessage})))},[d.PasskeySignupWithEmailOtpFallbackScreens.CreatePasskey]:()=>{const{t:e}=(0,b.useTranslation)("translation",{keyPrefix:"authenticationFlows.signup.passkey"}),{navigateBack:t,currentUserState:a,emitEvent:n}=R(),[r,l]=(0,g.useState)(!1),[s,o]=(0,g.useState)(!1);(0,g.useEffect)((()=>{l(!1),o(!1)}),[a]);const u=(0,g.useMemo)((()=>g.default.createElement("span",null,e("header"),g.default.createElement("span",{className:"cb-link-primary",onClick:()=>{n(d.FlowHandlerEvents.ShowBenefits)}},e("button_showPasskeyBenefits")))),[e]),i=(0,g.useMemo)((()=>g.default.createElement("span",null,e("body")," ",g.default.createElement("span",{className:"cb-text-secondary"},a.email),".")),[e]),c=(0,g.useMemo)((()=>e("button_start")),[e]),m=(0,g.useMemo)((()=>e("button_emailOtp")),[e]),f=(0,g.useMemo)((()=>e("button_back")),[e]),E=(0,g.useCallback)((()=>t()),[t]),y=(0,g.useCallback)((e=>{switch(e){case"primary":return l(!0),n(d.FlowHandlerEvents.PrimaryButton);case"secondary":return o(!0),n(d.FlowHandlerEvents.SecondaryButton);case"tertiary":return t()}}),[E]),p=(0,g.useMemo)((()=>({header:u,subHeader:i,primaryButton:c,showHorizontalRule:!0,secondaryButton:m,tertiaryButton:f,primaryLoading:r,secondaryLoading:s,onClick:y})),[u,i,c,m,f,r,s,y]);return g.default.createElement(g.default.Fragment,null,g.default.createElement(L,{...p}))},[d.PasskeySignupWithEmailOtpFallbackScreens.EnterOtp]:()=>{const{t:e}=(0,b.useTranslation)("translation",{keyPrefix:"authenticationFlows.signup.emailOtp"}),{emitEvent:t,currentUserState:a}=R(),n=e("header"),r=g.default.createElement(g.default.Fragment,null,e("body_text1"),g.default.createElement("span",{className:"cb-text-secondary"},a.email),e("body_text2")),l=e("button_verify"),s=e("button_back"),o=(0,g.useCallback)((()=>t(d.FlowHandlerEvents.SecondaryButton)),[]),u=(0,g.useCallback)((async(e,a)=>{a(!0),await t(d.FlowHandlerEvents.PrimaryButton,{emailOTPCode:e})}),[]),i=(0,g.useMemo)((()=>({header:n,body:r,verificationButtonText:l,backButtonText:s,onVerificationButtonClick:u,onBackButtonClick:o})),[e,a,u,o,n,r,l,s]);return g.default.createElement(U,{...i})},[d.PasskeySignupWithEmailOtpFallbackScreens.PasskeyAppend]:()=>{const{t:e}=(0,b.useTranslation)("translation",{keyPrefix:"authenticationFlows.signup.passkeyPrompt"}),{emitEvent:t}=R(),[a,n]=(0,g.useState)(!1),r=(0,g.useMemo)((()=>g.default.createElement("span",null,e("header"),g.default.createElement("span",{className:"cb-link-primary",onClick:()=>{t(d.FlowHandlerEvents.ShowBenefits)}},e("button_showPasskeyBenefits")))),[e]),l=(0,g.useMemo)((()=>e("button_start")),[e]),s=(0,g.useMemo)((()=>e("button_skip")),[e]),o=(0,g.useCallback)((e=>"primary"===e?(n(!0),t(d.FlowHandlerEvents.PrimaryButton)):t(d.FlowHandlerEvents.SecondaryButton)),[t]),u=(0,g.useMemo)((()=>({header:r,primaryButton:l,secondaryButton:s,onClick:o,loading:a})),[r,l,s,a,o]);return g.default.createElement(g.default.Fragment,null,g.default.createElement(L,{...u}))},[d.PasskeySignupWithEmailOtpFallbackScreens.PasskeyBenefits]:()=>{const{t:e}=(0,b.useTranslation)("translation",{keyPrefix:"authenticationFlows.signup.passkeyBenefits"}),{navigateBack:t,emitEvent:a}=R(),[n,r]=(0,g.useState)(!1),[l,s]=(0,g.useState)(!1),o=(0,g.useMemo)((()=>e("header")),[e]),u=(0,g.useMemo)((()=>g.default.createElement(g.default.Fragment,null,e("body_introduction")," ",g.default.createElement("strong",null,e("body_loginMethods")))),[e]),i=(0,g.useMemo)((()=>e("button_start")),[e]),c=(0,g.useMemo)((()=>e("button_skip")),[e]),m=(0,g.useCallback)((e=>{switch(e){case"primary":return r(!0),a(d.FlowHandlerEvents.PrimaryButton);case"secondary":return s(!0),a(d.FlowHandlerEvents.SecondaryButton);case"tertiary":return t()}}),[t,a]),f=(0,g.useMemo)((()=>({header:o,body:u,primaryButton:i,secondaryButton:c,primaryLoading:n,secondaryLoading:l,onClick:m})),[u,o,i,c,n,l,m]);return g.default.createElement(g.default.Fragment,null,g.default.createElement(L,{...f}))},[d.PasskeySignupWithEmailOtpFallbackScreens.PasskeyWelcome]:()=>{const{t:e}=(0,b.useTranslation)("translation",{keyPrefix:"authenticationFlows.signup.passkeySuccess"}),{emitEvent:t}=R(),a=(0,g.useMemo)((()=>e("header")),[e]),n=(0,g.useMemo)((()=>e("subheader")),[e]),r=(0,g.useMemo)((()=>g.default.createElement("span",null,e("body_text1")," ",g.default.createElement("strong",null,e("body_text2"))," ",e("body_text3"))),[e]),l=(0,g.useMemo)((()=>e("button")),[e]),s=(0,g.useCallback)((()=>{t(d.FlowHandlerEvents.PrimaryButton)}),[t]),o=(0,g.useMemo)((()=>({header:a,secondaryHeader:n,body:r,primaryButton:l,onClick:s})),[a,n,r,l,s]);return g.default.createElement(g.default.Fragment,null,g.default.createElement(L,{...o}))},[d.PasskeySignupWithEmailOtpFallbackScreens.PasskeyError]:()=>{const{t:e}=(0,b.useTranslation)("translation",{keyPrefix:"authenticationFlows.signup.passkeyError"}),{shortSession:t}=(0,u.useCorbado)(),{navigateBack:a,emitEvent:n}=R(),[r,l]=(0,g.useState)(!1),[s,o]=(0,g.useState)(!1),i=(0,g.useMemo)((()=>e("header")),[e]),c=(0,g.useMemo)((()=>g.default.createElement("span",null,e("body_errorMessage1"),g.default.createElement("span",{className:"cb-link-primary",onClick:()=>{n(d.FlowHandlerEvents.ShowBenefits)}},e("button_showPasskeyBenefits")),e("body_errorMessage2"))),[e]),m=(0,g.useMemo)((()=>e("button_retry")),[e]),f=(0,g.useMemo)((()=>t?"":e("button_emailOtp")),[e]),E=(0,g.useMemo)((()=>e(t?"button_cancel":"button_back")),[e,t]),y=(0,g.useCallback)((e=>{switch(e){case"primary":return l(!0),n(d.FlowHandlerEvents.PrimaryButton);case"secondary":return o(!0),n(d.FlowHandlerEvents.SecondaryButton);case"tertiary":return a()}}),[a,n]),p=(0,g.useMemo)((()=>({header:i,body:c,primaryButton:m,secondaryButton:f,tertiaryButton:E,primaryLoading:r,secondaryLoading:s,onClick:y})),[c,y,i,m,f,r,f,E]);return g.default.createElement(g.default.Fragment,null,g.default.createElement(L,{...p}))}},I={[d.SignUpFlowNames.PasskeySignupWithEmailOTPFallback]:q,[d.LoginFlowNames.PasskeyLoginWithEmailOTPFallback]:D},$=()=>g.default.createElement("div",{className:"cb-loading"},g.default.createElement(v,null)),V=({error:e})=>g.default.createElement("div",{className:"container"},g.default.createElement("div",{className:"title"},e.name," ",g.default.createElement("br",null),"(","client"===e.type?"client side":"server side",")"),g.default.createElement("div",{className:"error-details"},g.default.createElement("div",{className:"error-detail-row"},g.default.createElement("div",{className:"error-detail-title"},":Message"),g.default.createElement("div",{className:"error-detail-value"},e.message)),g.default.createElement("div",{className:"error-detail-row"},g.default.createElement("div",{className:"error-detail-title"},":Type"),g.default.createElement("div",{className:"error-detail-value"},e.detailedType)),g.default.createElement("div",{className:"error-detail-row"},g.default.createElement("div",{className:"error-detail-title"},":Link"),g.default.createElement("a",{className:"error-detail-value",href:e.link},e.link))),g.default.createElement("div",{className:"error-detail-row"},g.default.createElement("div",{className:"error-detail-title"},":RequestID"),g.default.createElement("div",{className:"error-detail-value"},e.requestId)),e.details&&g.default.createElement("button",{className:"error-button",onClick:()=>{window.open(e.details,"_blank")}},"See browser console for more details")),z=e=>{const{t}=(0,b.useTranslation)("translation",{keyPrefix:"authenticationFlows.unexpectedError"});return g.default.createElement("div",{className:"error-page"},g.default.createElement("div",{className:"prod-error-container"},g.default.createElement("div",{className:"prod-error-title"},t("header")),g.default.createElement("div",{className:"prod-error-details"},g.default.createElement("div",{className:"prod-error-apology"},t("subheader")),g.default.createElement("div",null,e?t("body_withCustomerSupport",e):t("body_noCustomerSupport"))),g.default.createElement("button",{className:"prod-error-button",onClick:()=>window.location.reload()},t("button"))))};class j extends g.default.Component{constructor(e){super(e),this.state={error:void 0}}static getDerivedStateFromError(e){return console.error(e),{hasError:!0}}componentDidCatch(e,t){console.error(e,t)}render(){return!this.props.globalError&&!this.state.error||this.props.isDevMode?this.props.globalError?g.default.createElement("div",{className:"error-page"},g.default.createElement(V,{error:this.props.globalError})):this.props.children:g.default.createElement(z,{customerSupportEmail:this.props.customerSupportEmail})}}const Z=({isDevMode:e,customerSupportEmail:t})=>{const{currentFlow:a,currentScreen:n,initialized:r}=R(),{globalError:l}=(0,u.useCorbado)(),[s,o]=(0,g.useState)({});(0,g.useEffect)((()=>{const e=I[a];o(null!=e?e:{})}),[a]);const i=(0,g.useMemo)((()=>s[n]),[s,n]),c=(0,g.useCallback)((()=>{const e=s[d.CommonScreens.End];return e?g.default.createElement(e,null):null}),[s]);return g.default.createElement(j,{globalError:l,isDevMode:e,customerSupportEmail:t},r?i?g.default.createElement(i,null):g.default.createElement(c,null):g.default.createElement($,null))},G=({children:e,...t})=>{const{corbadoApp:a,getProjectConfig:n,user:r}=(0,u.useCorbado)(),[l,s]=(0,g.useState)(),[o,i]=(0,g.useState)(d.CommonScreens.Start),[c,f]=(0,g.useState)({}),[b,E]=(0,g.useState)(d.SignUpFlowNames.PasskeySignupWithEmailOTPFallback),[y,p]=(0,g.useState)(!1),k=(0,g.useRef)(0),v=(0,g.useRef)(0),h=(0,g.useRef)(0);(0,g.useEffect)((()=>{if(!y)return(async()=>{const e=await n();if(e.err)return;const r=new d.FlowHandler(e.val,t.onLoggedIn);k.current=r.onScreenChange((e=>i(e))),v.current=r.onFlowChange((e=>E(e))),h.current=r.onUserStateChange((e=>{f(e)})),await r.init(a,m.default),s(r),p(!0)})(),()=>{null==l||l.removeOnFlowChangeCallback(v.current),null==l||l.removeOnScreenChangeCallback(k.current),null==l||l.removeOnUserStateChange(h.current)}}),[]),(0,g.useEffect)((()=>{y&&r&&(null==l||l.update(r))}),[y,r]);const w=(0,g.useCallback)((()=>{var e;return null!==(e=null==l?void 0:l.navigateBack())&&void 0!==e?e:d.CommonScreens.Start}),[l]),S=(0,g.useCallback)(((e,t)=>null==l?void 0:l.handleStateUpdate(e,t)),[l]),C=(0,g.useMemo)((()=>({currentFlow:b,currentScreen:o,currentUserState:c,initialized:y,navigateBack:w,emitEvent:S})),[b,o,c,y,w]);return g.default.createElement(A.Provider,{value:C},e)},X=({onLoggedIn:e,isDevMode:t=!1,customerSupportEmail:a=""})=>g.default.createElement("div",{className:"cb-container"},g.default.createElement(G,{onLoggedIn:e},g.default.createElement(Z,{isDevMode:t,customerSupportEmail:a}))),Y=g.default.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 -960 960 960"},g.default.createElement("path",{d:"M120-160v-112q0-34 17.5-62.5T184-378q62-31 126-46.5T440-440q20 0 40 1.5t40 4.5q-4 58 21 109.5t73 84.5v80H120ZM760-40l-60-60v-186q-44-13-72-49.5T600-420q0-58 41-99t99-41q58 0 99 41t41 99q0 45-25.5 80T790-290l50 50-60 60 60 60-80 80ZM440-480q-66 0-113-47t-47-113q0-66 47-113t113-47q66 0 113 47t47 113q0 66-47 113t-113 47Zm300 80q17 0 28.5-11.5T780-440q0-17-11.5-28.5T740-480q-17 0-28.5 11.5T700-440q0 17 11.5 28.5T740-400Z"})),K=({aaguid:e})=>{var t,a;const n=d.aaguidMappings[e],r=(0,d.hasDarkMode)()&&null!==(t=null==n?void 0:n.iconDark)&&void 0!==t?t:null==n?void 0:n.icon;return g.default.createElement("div",{className:"cb-passkey-list-icon"},r?g.default.createElement("img",{src:r,alt:null!==(a=null==n?void 0:n.name)&&void 0!==a?a:"Passkey"}):g.default.createElement(g.default.Fragment,null,Y))},J=({handlerPasskeyCreate:e})=>{const{t}=(0,b.useTranslation)("translation",{keyPrefix:"passkeysList"}),[a,n]=(0,g.useState)(!1),[r,l]=(0,g.useState)(!1),s=()=>{n(!1)};return g.default.createElement("div",null,g.default.createElement(w,{variant:"primary",className:"cb-passkey-list-primary-button",isLoading:r,disabled:r,onClick:()=>{(async()=>{var t;l(!0);const a=await e();l(!1),a.err&&"errors.passkeyAlreadyExists"===(null===(t=a.val)||void 0===t?void 0:t.name)&&n(!0)})()}},t("button_createPasskey")),g.default.createElement(T,{isOpen:a,header:t("dialog_passkeyAlreadyExists.header"),body:t("dialog_passkeyAlreadyExists.body"),confirmText:t("dialog_passkeyAlreadyExists.button_confirm"),onClose:s,onConfirm:s}))},Q=({passkeyId:e,onPasskeyDelete:t})=>{const{t:a}=(0,b.useTranslation)("translation",{keyPrefix:"passkeysList.dialog_delete"}),[n,r]=(0,g.useState)(!1),l=()=>{r(!1)};return g.default.createElement("div",{className:"cb-passkey-list-icon"},g.default.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",className:"cb-passkey-list-delete",onClick:()=>{r(!0)}},g.default.createElement("path",{d:"M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"})),g.default.createElement(T,{inverseButtonVariants:!0,isOpen:n,header:a("header"),body:a("body"),confirmText:a("button_confirm"),cancelText:a("button_cancel"),onClose:l,onConfirm:async()=>{await t(e),l()}}))},ee=({passkey:e})=>{var t,a;const{t:n}=(0,b.useTranslation)("translation",{keyPrefix:"passkeysList"}),r=(0,d.getParsedUA)(e.userAgent),l=null!==(a=null===(t=d.aaguidMappings[e.aaguid])||void 0===t?void 0:t.name)&&void 0!==a?a:"Passkey";return g.default.createElement("div",{className:"cb-passkey-list-details"},g.default.createElement("div",{className:"cb-passkey-list-header"},g.default.createElement("div",{className:"cb-passkey-list-header-title"},l),e.backupState?g.default.createElement("div",{className:"cb-passkey-list-header-badge"},n("badge_synced")):null),g.default.createElement("div",null,n("field_credentialId"),e.id),g.default.createElement("div",null,g.default.createElement(b.Trans,{i18nKey:"field_created",t:n,values:{date:e.created,browser:r.browser.name,os:r.os.name}})),g.default.createElement("div",null,n("field_lastUsed"),e.lastUsed),g.default.createElement("div",null,n("field_status"),e.status))},te=()=>{const{getPasskeys:e,appendPasskey:t,deletePasskey:a,shortSession:n}=(0,u.useCorbado)(),{t:r}=(0,b.useTranslation)("translation",{keyPrefix:"passkeysList"}),[l,s]=(0,g.useState)();(0,g.useEffect)((()=>{n&&o()}),[n]);const o=async()=>{const t=await e();if(t.err)throw new Error(t.val.name);s(t.val)},i=async e=>{await a(e),await o()};return n?g.default.createElement("div",null,l?l.passkeys.map((e=>g.default.createElement("div",{key:e.id,className:"cb-passkey-list-card"},g.default.createElement(K,{aaguid:e.aaguid}),g.default.createElement(ee,{passkey:e}),g.default.createElement(Q,{passkeyId:e.id,onPasskeyDelete:i})))):g.default.createElement(v,null),l&&0===l.passkeys.length?g.default.createElement("div",null,r("message_noPasskeys")):null,g.default.createElement(J,{handlerPasskeyCreate:async()=>{const e=await t();return e.ok&&await o(),e}})):g.default.createElement("div",null,r("warning_notLoggedIn"))};var ae=o.rX,ne=o.Hg,re=o.BN,le=o.XZ,se=o.km;export{ae as CorbadoAuth,ne as CorbadoProvider,re as CorbadoThemes,le as PasskeyList,se as useCorbado}; | ||
//# sourceMappingURL=index.js.map |
{ | ||
"name": "@corbado/react", | ||
"version": "0.1.1-alpha.1", | ||
"version": "0.1.1-alpha.2", | ||
"description": "This package provides all the functionalities and UI components needed by developers when integration Corbado's Authentication management system in their react application", | ||
@@ -34,4 +34,4 @@ "author": "Abdullah Shahbaz <abdullah_ghani@live.com>", | ||
"dependencies": { | ||
"@corbado/react-sdk": "^0.1.7-alpha.1", | ||
"@corbado/shared-ui": "^0.1.1-alpha.1", | ||
"@corbado/react-sdk": "^0.1.7-alpha.2", | ||
"@corbado/shared-ui": "^0.1.1-alpha.2", | ||
"i18next": "23.5.1", | ||
@@ -42,12 +42,14 @@ "i18next-browser-languagedetector": "7.1.0", | ||
"devDependencies": { | ||
"@corbado/types": "^0.1.1-alpha.1", | ||
"@corbado/web-core": "^0.1.7-alpha.1", | ||
"@corbado/types": "^0.1.1-alpha.2", | ||
"@corbado/web-core": "^0.1.7-alpha.2", | ||
"@svgr/webpack": "^8.1.0", | ||
"@types/react": "^18.2.0", | ||
"ts-results": "^3.3.0", | ||
"typescript": "^5.2.2" | ||
}, | ||
"peerDependencies": { | ||
"react": ">=18.0.0" | ||
"react": ">=18.0.0", | ||
"react-dom": ">=18.0.0" | ||
}, | ||
"gitHead": "b03d031d5a3cafdf798d2170d9c0c0803b3c9b4f" | ||
"gitHead": "170d17f6c315a8e0ee26e8726ff547e3cc7f06d5" | ||
} |
@@ -0,0 +0,0 @@ # @corbado/react |
Sorry, the diff of this file is not supported yet
New author
Supply chain riskA new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.
Found 1 instance in 1 package
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
0
0
147267
7
6
56
430
+ Addedreact-dom@19.0.0(transitive)
+ Addedscheduler@0.25.0(transitive)