@turnkey/sdk-react 3.0.0 → 3.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (77) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/README.md +1 -0
  3. package/dist/_virtual/_rollupPluginBabelHelpers.mjs +470 -0
  4. package/dist/_virtual/_rollupPluginBabelHelpers.mjs.map +1 -0
  5. package/dist/components/auth/Apple.js +78 -64
  6. package/dist/components/auth/Apple.js.map +1 -1
  7. package/dist/components/auth/Apple.mjs +85 -64
  8. package/dist/components/auth/Apple.mjs.map +1 -1
  9. package/dist/components/auth/Auth.d.ts +3 -0
  10. package/dist/components/auth/Auth.d.ts.map +1 -1
  11. package/dist/components/auth/Auth.js +515 -259
  12. package/dist/components/auth/Auth.js.map +1 -1
  13. package/dist/components/auth/Auth.mjs +741 -231
  14. package/dist/components/auth/Auth.mjs.map +1 -1
  15. package/dist/components/auth/Facebook.js +78 -63
  16. package/dist/components/auth/Facebook.js.map +1 -1
  17. package/dist/components/auth/Facebook.mjs +121 -54
  18. package/dist/components/auth/Facebook.mjs.map +1 -1
  19. package/dist/components/auth/Google.js +63 -47
  20. package/dist/components/auth/Google.js.map +1 -1
  21. package/dist/components/auth/Google.mjs +70 -39
  22. package/dist/components/auth/Google.mjs.map +1 -1
  23. package/dist/components/auth/OtpVerification.d.ts +1 -1
  24. package/dist/components/auth/OtpVerification.d.ts.map +1 -1
  25. package/dist/components/auth/OtpVerification.js +106 -51
  26. package/dist/components/auth/OtpVerification.js.map +1 -1
  27. package/dist/components/auth/OtpVerification.mjs +151 -41
  28. package/dist/components/auth/OtpVerification.mjs.map +1 -1
  29. package/dist/components/auth/PhoneInput.d.ts.map +1 -1
  30. package/dist/components/auth/PhoneInput.js +138 -69
  31. package/dist/components/auth/PhoneInput.js.map +1 -1
  32. package/dist/components/auth/PhoneInput.mjs +141 -70
  33. package/dist/components/auth/PhoneInput.mjs.map +1 -1
  34. package/dist/components/auth/TurnkeyThemeProvider.js +26 -17
  35. package/dist/components/auth/TurnkeyThemeProvider.js.map +1 -1
  36. package/dist/components/auth/TurnkeyThemeProvider.mjs +33 -18
  37. package/dist/components/auth/TurnkeyThemeProvider.mjs.map +1 -1
  38. package/dist/components/auth/constants.js +26 -26
  39. package/dist/components/auth/constants.js.map +1 -1
  40. package/dist/components/auth/constants.mjs +34 -34
  41. package/dist/components/auth/constants.mjs.map +1 -1
  42. package/dist/components/auth/facebookUtils.js +23 -21
  43. package/dist/components/auth/facebookUtils.js.map +1 -1
  44. package/dist/components/auth/facebookUtils.mjs +65 -23
  45. package/dist/components/auth/facebookUtils.mjs.map +1 -1
  46. package/dist/components/auth/otp.js +84 -71
  47. package/dist/components/auth/otp.js.map +1 -1
  48. package/dist/components/auth/otp.mjs +96 -70
  49. package/dist/components/auth/otp.mjs.map +1 -1
  50. package/dist/components/auth/utils.js +3 -3
  51. package/dist/components/auth/utils.js.map +1 -1
  52. package/dist/components/auth/utils.mjs +3 -3
  53. package/dist/components/auth/utils.mjs.map +1 -1
  54. package/dist/components/export/Export.js +181 -99
  55. package/dist/components/export/Export.js.map +1 -1
  56. package/dist/components/export/Export.mjs +257 -89
  57. package/dist/components/export/Export.mjs.map +1 -1
  58. package/dist/components/import/Import.js +185 -132
  59. package/dist/components/import/Import.js.map +1 -1
  60. package/dist/components/import/Import.mjs +264 -120
  61. package/dist/components/import/Import.mjs.map +1 -1
  62. package/dist/contexts/TurnkeyContext.d.ts.map +1 -1
  63. package/dist/contexts/TurnkeyContext.js +113 -93
  64. package/dist/contexts/TurnkeyContext.js.map +1 -1
  65. package/dist/contexts/TurnkeyContext.mjs +191 -92
  66. package/dist/contexts/TurnkeyContext.mjs.map +1 -1
  67. package/dist/hooks/use-session.d.ts.map +1 -1
  68. package/dist/hooks/use-session.js +16 -12
  69. package/dist/hooks/use-session.js.map +1 -1
  70. package/dist/hooks/use-session.mjs +18 -12
  71. package/dist/hooks/use-session.mjs.map +1 -1
  72. package/dist/hooks/use-turnkey.d.ts.map +1 -1
  73. package/dist/hooks/use-turnkey.js +6 -5
  74. package/dist/hooks/use-turnkey.js.map +1 -1
  75. package/dist/hooks/use-turnkey.mjs +7 -6
  76. package/dist/hooks/use-turnkey.mjs.map +1 -1
  77. package/package.json +8 -8
@@ -1,4 +1,5 @@
1
1
  'use client';
2
+ import { slicedToArray as _slicedToArray, asyncToGenerator as _asyncToGenerator, regeneratorRuntime as _regeneratorRuntime, objectSpread2 as _objectSpread2 } from '../../_virtual/_rollupPluginBabelHelpers.mjs';
2
3
  import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
3
4
  import styles from './Auth.module.css.mjs';
4
5
  import React, { useState, useEffect } from 'react';
@@ -17,269 +18,778 @@ import { useTurnkey } from '../../hooks/use-turnkey.mjs';
17
18
  import { OtpType, FilterType, authErrors } from './constants.mjs';
18
19
  import { server } from '@turnkey/sdk-server';
19
20
 
20
- const passkeyIcon = (jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "43", height: "48", fill: "none", children: [jsx("path", { fill: "var(--icon-color)", "fill-rule": "evenodd", d: "M27.52 37.06a6.8 6.8 0 0 0-2.02-.31H12a6.75 6.75 0 0 0-6.75 6.75V48H.75v-4.5A11.25 11.25 0 0 1 12 32.25h13.5c.68 0 1.355.062 2.016.182zm4.698-23.74a13.5 13.5 0 1 0-8.503 13.484c-.057-.178-.131-.425-.167-.566a13 13 0 0 1-.229-1.134 12 12 0 0 1-.054-.448q-.02-.202-.013-1.064c.007-.82.01-.877.055-1.186.018-.121.046-.29.072-.438a9 9 0 1 1 4.315-6.714 13.83 13.83 0 0 1 .87-.564 14 14 0 0 1 1.08-.556c.102-.045.299-.128.44-.184.14-.056.384-.146.544-.202.16-.055.436-.141.615-.194.18-.05.467-.125.641-.165.092-.02.214-.046.334-.07", "clip-rule": "evenodd" }), jsx("path", { fill: "var(--icon-color)", "fill-rule": "evenodd", d: "M33.844 16.554a9.563 9.563 0 0 0-.975.134c-.125.022-.355.075-.51.114s-.418.12-.589.177a11 11 0 0 0-.553.21 12 12 0 0 0-.519.244 8.29 8.29 0 0 0-.961.573c-.114.08-.313.23-.445.334-.13.104-.358.31-.507.454a10 10 0 0 0-.466.495c-.107.127-.269.334-.362.46-.091.128-.232.34-.313.474-.079.133-.195.34-.256.46-.062.122-.15.308-.196.413a10 10 0 0 0-.152.387c-.04.107-.1.304-.14.44a9 9 0 0 0-.119.51c-.028.145-.065.374-.082.51a6 6 0 0 0-.032.773c-.002.327.007.598.021.712a8.924 8.924 0 0 0 .163.905c.03.116.09.322.134.457.046.136.125.35.178.475a8 8 0 0 0 .725 1.329 9.15 9.15 0 0 0 .622.772c.111.121.294.306.408.41.114.101.295.256.4.342.108.085.273.211.37.28.097.068.244.165.325.218l.299.179c.082.047.251.137.374.2.125.062.232.127.24.146.013.025.018 2.403.018 7.032 0 5.905.004 7.018.025 7.125.014.07.047.18.075.24.029.064.08.156.113.203.032.05.522.654 1.086 1.345.564.693 1.07 1.31 1.123 1.371.054.063.14.151.195.195.054.042.162.111.239.151s.204.092.281.115c.121.035.181.04.413.04.206 0 .3-.007.387-.03a2 2 0 0 0 .237-.09 1.8 1.8 0 0 0 .388-.25c.029-.029.547-.657 1.153-1.397a97 97 0 0 0 1.12-1.383.4.4 0 0 0 .019-.137c0-.053-.016-.178-.035-.276a5 5 0 0 0-.273-.876 24 24 0 0 0-.298-.73 32 32 0 0 0-.626-1.365.8.8 0 0 1-.069-.172q.001-.033.041-.043c.021-.003.134-.016.25-.026s.295-.032.395-.046c.102-.016.248-.044.325-.065a.9.9 0 0 0 .237-.102.8.8 0 0 0 .15-.133c.028-.037.073-.116.1-.174.026-.058.054-.16.065-.229a1.895 1.895 0 0 0-.042-.589 2 2 0 0 0-.074-.193c-.023-.053-.355-.542-.736-1.085-.38-.543-.693-1.005-.693-1.025 0-.028.037-.046.234-.105.128-.04.339-.113.469-.162.132-.047.293-.116.36-.15a1 1 0 0 0 .204-.144.8.8 0 0 0 .144-.212c.034-.072.072-.18.085-.238s.024-.2.024-.316c0-.123-.009-.25-.024-.308a1.4 1.4 0 0 0-.072-.202c-.032-.07-.275-.39-.737-.975-.378-.479-.687-.883-.687-.9s.018-.043.04-.055.197-.11.39-.215c.194-.103.431-.237.528-.295.096-.058.22-.15.274-.204a1.1 1.1 0 0 0 .257-.459c.026-.1.031-.247.04-1.283.005-.642.016-1.178.023-1.19s.105-.069.22-.125c.112-.058.284-.15.38-.204a10 10 0 0 0 .985-.668 6.762 6.762 0 0 0 .826-.767c.107-.117.267-.305.358-.418a8 8 0 0 0 .605-.891 8.9 8.9 0 0 0 .373-.756c.045-.105.12-.308.17-.448a8 8 0 0 0 .156-.536c.037-.155.088-.408.113-.563.023-.155.05-.381.061-.505a8 8 0 0 0-.007-1.139 8 8 0 0 0-.07-.527 8 8 0 0 0-.097-.466c-.028-.116-.08-.3-.116-.413a7 7 0 0 0-.83-1.714 10 10 0 0 0-.256-.37 9 9 0 0 0-.23-.29 9 9 0 0 0-.81-.82 9 9 0 0 0-.395-.32 9 9 0 0 0-.835-.556 13 13 0 0 0-.417-.221 11 11 0 0 0-.483-.223 8 8 0 0 0-.98-.343 11 11 0 0 0-.422-.108c-.106-.022-.288-.06-.404-.079a10 10 0 0 0-.51-.073 8 8 0 0 0-.852-.043c-.304-.001-.644.002-.756.011m.207 3.334-.058.006a4.6 4.6 0 0 0-1.283.341 4 4 0 0 0-.334.159 4.354 4.354 0 0 0-.668.452 5.5 5.5 0 0 0-.669.69 5 5 0 0 0-.207.308 4 4 0 0 0-.18.325c-.04.088-.101.234-.135.325a3.856 3.856 0 0 0-.177.66c-.016.087-.034.24-.04.342-.01.159-.008.19.017.215.028.03.25.031 4.175.031 3.663 0 4.15-.003 4.174-.026q.029-.027.028-.12a3 3 0 0 0-.072-.574 3.9 3.9 0 0 0-.297-.87 4 4 0 0 0-.21-.379 6 6 0 0 0-.23-.316 6 6 0 0 0-.346-.37 5 5 0 0 0-.365-.326 7 7 0 0 0-.246-.178 5 5 0 0 0-.264-.16 4.6 4.6 0 0 0-1.585-.52 5.681 5.681 0 0 0-.84-.035z", "clip-rule": "evenodd" })] }));
21
- const passkeyIconError = (jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "43", height: "48", fill: "none", children: [jsx("path", { fill: "var(--error-color)", "fill-rule": "evenodd", d: "M27.52 37.06a6.8 6.8 0 0 0-2.02-.31H12a6.75 6.75 0 0 0-6.75 6.75V48H.75v-4.5A11.25 11.25 0 0 1 12 32.25h13.5c.68 0 1.355.062 2.016.182zm4.698-23.74a13.5 13.5 0 1 0-8.503 13.484c-.057-.178-.131-.425-.167-.566a13 13 0 0 1-.229-1.134 12 12 0 0 1-.054-.448q-.02-.202-.013-1.064c.007-.82.01-.877.055-1.186.018-.121.046-.29.072-.438a9 9 0 1 1 4.315-6.714 13.83 13.83 0 0 1 .87-.564 14 14 0 0 1 1.08-.556c.102-.045.299-.128.44-.184.14-.056.384-.146.544-.202.16-.055.436-.141.615-.194.18-.05.467-.125.641-.165.092-.02.214-.046.334-.07", "clip-rule": "evenodd" }), jsx("path", { fill: "var(--error-color)", "fill-rule": "evenodd", d: "M33.844 16.554a9.563 9.563 0 0 0-.975.134c-.125.022-.355.075-.51.114s-.418.12-.589.177a11 11 0 0 0-.553.21 12 12 0 0 0-.519.244 8.29 8.29 0 0 0-.961.573c-.114.08-.313.23-.445.334-.13.104-.358.31-.507.454a10 10 0 0 0-.466.495c-.107.127-.269.334-.362.46-.091.128-.232.34-.313.474-.079.133-.195.34-.256.46-.062.122-.15.308-.196.413a10 10 0 0 0-.152.387c-.04.107-.1.304-.14.44a9 9 0 0 0-.119.51c-.028.145-.065.374-.082.51a6 6 0 0 0-.032.773c-.002.327.007.598.021.712a8.924 8.924 0 0 0 .163.905c.03.116.09.322.134.457.046.136.125.35.178.475a8 8 0 0 0 .725 1.329 9.15 9.15 0 0 0 .622.772c.111.121.294.306.408.41.114.101.295.256.4.342.108.085.273.211.37.28.097.068.244.165.325.218l.299.179c.082.047.251.137.374.2.125.062.232.127.24.146.013.025.018 2.403.018 7.032 0 5.905.004 7.018.025 7.125.014.07.047.18.075.24.029.064.08.156.113.203.032.05.522.654 1.086 1.345.564.693 1.07 1.31 1.123 1.371.054.063.14.151.195.195.054.042.162.111.239.151s.204.092.281.115c.121.035.181.04.413.04.206 0 .3-.007.387-.03a2 2 0 0 0 .237-.09 1.8 1.8 0 0 0 .388-.25c.029-.029.547-.657 1.153-1.397a97 97 0 0 0 1.12-1.383.4.4 0 0 0 .019-.137c0-.053-.016-.178-.035-.276a5 5 0 0 0-.273-.876 24 24 0 0 0-.298-.73 32 32 0 0 0-.626-1.365.8.8 0 0 1-.069-.172q.001-.033.041-.043c.021-.003.134-.016.25-.026s.295-.032.395-.046c.102-.016.248-.044.325-.065a.9.9 0 0 0 .237-.102.8.8 0 0 0 .15-.133c.028-.037.073-.116.1-.174.026-.058.054-.16.065-.229a1.895 1.895 0 0 0-.042-.589 2 2 0 0 0-.074-.193c-.023-.053-.355-.542-.736-1.085-.38-.543-.693-1.005-.693-1.025 0-.028.037-.046.234-.105.128-.04.339-.113.469-.162.132-.047.293-.116.36-.15a1 1 0 0 0 .204-.144.8.8 0 0 0 .144-.212c.034-.072.072-.18.085-.238s.024-.2.024-.316c0-.123-.009-.25-.024-.308a1.4 1.4 0 0 0-.072-.202c-.032-.07-.275-.39-.737-.975-.378-.479-.687-.883-.687-.9s.018-.043.04-.055.197-.11.39-.215c.194-.103.431-.237.528-.295.096-.058.22-.15.274-.204a1.1 1.1 0 0 0 .257-.459c.026-.1.031-.247.04-1.283.005-.642.016-1.178.023-1.19s.105-.069.22-.125c.112-.058.284-.15.38-.204a10 10 0 0 0 .985-.668 6.762 6.762 0 0 0 .826-.767c.107-.117.267-.305.358-.418a8 8 0 0 0 .605-.891 8.9 8.9 0 0 0 .373-.756c.045-.105.12-.308.17-.448a8 8 0 0 0 .156-.536c.037-.155.088-.408.113-.563.023-.155.05-.381.061-.505a8 8 0 0 0-.007-1.139 8 8 0 0 0-.07-.527 8 8 0 0 0-.097-.466c-.028-.116-.08-.3-.116-.413a7 7 0 0 0-.83-1.714 10 10 0 0 0-.256-.37 9 9 0 0 0-.23-.29 9 9 0 0 0-.81-.82 9 9 0 0 0-.395-.32 9 9 0 0 0-.835-.556 13 13 0 0 0-.417-.221 11 11 0 0 0-.483-.223 8 8 0 0 0-.98-.343 11 11 0 0 0-.422-.108c-.106-.022-.288-.06-.404-.079a10 10 0 0 0-.51-.073 8 8 0 0 0-.852-.043c-.304-.001-.644.002-.756.011m.207 3.334-.058.006a4.6 4.6 0 0 0-1.283.341 4 4 0 0 0-.334.159 4.354 4.354 0 0 0-.668.452 5.5 5.5 0 0 0-.669.69 5 5 0 0 0-.207.308 4 4 0 0 0-.18.325c-.04.088-.101.234-.135.325a3.856 3.856 0 0 0-.177.66c-.016.087-.034.24-.04.342-.01.159-.008.19.017.215.028.03.25.031 4.175.031 3.663 0 4.15-.003 4.174-.026q.029-.027.028-.12a3 3 0 0 0-.072-.574 3.9 3.9 0 0 0-.297-.87 4 4 0 0 0-.21-.379 6 6 0 0 0-.23-.316 6 6 0 0 0-.346-.37 5 5 0 0 0-.365-.326 7 7 0 0 0-.246-.178 5 5 0 0 0-.264-.16 4.6 4.6 0 0 0-1.585-.52 5.681 5.681 0 0 0-.84-.035z", "clip-rule": "evenodd" })] }));
22
- const Auth = ({ onAuthSuccess, onError, authConfig, configOrder, customSmsMessage, customAccounts, }) => {
23
- const { passkeyClient, authIframeClient } = useTurnkey();
24
- const [email, setEmail] = useState("");
25
- const [phone, setPhone] = useState("");
26
- const [otpId, setOtpId] = useState(null);
27
- const [step, setStep] = useState("auth");
28
- const [oauthLoading, setOauthLoading] = useState("");
29
- const [suborgId, setSuborgId] = useState("");
30
- const [passkeySignupScreen, setPasskeySignupScreen] = useState(false);
31
- const [passkeyCreationScreen, setPasskeyCreationScreen] = useState(false);
32
- const [passkeySignupError, setPasskeySignupError] = useState("");
33
- const [loading, setLoading] = useState(true);
34
- const [passkeyCreated, setPasskeyCreated] = useState(false);
35
- const handleResendCode = async () => {
36
- if (step === OtpType.Email) {
37
- await handleOtpLogin(FilterType.Email, email, OtpType.Email);
38
- }
39
- else if (step === OtpType.Sms) {
40
- await handleOtpLogin(FilterType.PhoneNumber, phone, OtpType.Sms);
21
+ var passkeyIcon = jsxs("svg", {
22
+ xmlns: "http://www.w3.org/2000/svg",
23
+ width: "43",
24
+ height: "48",
25
+ fill: "none",
26
+ children: [jsx("path", {
27
+ fill: "var(--icon-color)",
28
+ "fill-rule": "evenodd",
29
+ d: "M27.52 37.06a6.8 6.8 0 0 0-2.02-.31H12a6.75 6.75 0 0 0-6.75 6.75V48H.75v-4.5A11.25 11.25 0 0 1 12 32.25h13.5c.68 0 1.355.062 2.016.182zm4.698-23.74a13.5 13.5 0 1 0-8.503 13.484c-.057-.178-.131-.425-.167-.566a13 13 0 0 1-.229-1.134 12 12 0 0 1-.054-.448q-.02-.202-.013-1.064c.007-.82.01-.877.055-1.186.018-.121.046-.29.072-.438a9 9 0 1 1 4.315-6.714 13.83 13.83 0 0 1 .87-.564 14 14 0 0 1 1.08-.556c.102-.045.299-.128.44-.184.14-.056.384-.146.544-.202.16-.055.436-.141.615-.194.18-.05.467-.125.641-.165.092-.02.214-.046.334-.07",
30
+ "clip-rule": "evenodd"
31
+ }), jsx("path", {
32
+ fill: "var(--icon-color)",
33
+ "fill-rule": "evenodd",
34
+ d: "M33.844 16.554a9.563 9.563 0 0 0-.975.134c-.125.022-.355.075-.51.114s-.418.12-.589.177a11 11 0 0 0-.553.21 12 12 0 0 0-.519.244 8.29 8.29 0 0 0-.961.573c-.114.08-.313.23-.445.334-.13.104-.358.31-.507.454a10 10 0 0 0-.466.495c-.107.127-.269.334-.362.46-.091.128-.232.34-.313.474-.079.133-.195.34-.256.46-.062.122-.15.308-.196.413a10 10 0 0 0-.152.387c-.04.107-.1.304-.14.44a9 9 0 0 0-.119.51c-.028.145-.065.374-.082.51a6 6 0 0 0-.032.773c-.002.327.007.598.021.712a8.924 8.924 0 0 0 .163.905c.03.116.09.322.134.457.046.136.125.35.178.475a8 8 0 0 0 .725 1.329 9.15 9.15 0 0 0 .622.772c.111.121.294.306.408.41.114.101.295.256.4.342.108.085.273.211.37.28.097.068.244.165.325.218l.299.179c.082.047.251.137.374.2.125.062.232.127.24.146.013.025.018 2.403.018 7.032 0 5.905.004 7.018.025 7.125.014.07.047.18.075.24.029.064.08.156.113.203.032.05.522.654 1.086 1.345.564.693 1.07 1.31 1.123 1.371.054.063.14.151.195.195.054.042.162.111.239.151s.204.092.281.115c.121.035.181.04.413.04.206 0 .3-.007.387-.03a2 2 0 0 0 .237-.09 1.8 1.8 0 0 0 .388-.25c.029-.029.547-.657 1.153-1.397a97 97 0 0 0 1.12-1.383.4.4 0 0 0 .019-.137c0-.053-.016-.178-.035-.276a5 5 0 0 0-.273-.876 24 24 0 0 0-.298-.73 32 32 0 0 0-.626-1.365.8.8 0 0 1-.069-.172q.001-.033.041-.043c.021-.003.134-.016.25-.026s.295-.032.395-.046c.102-.016.248-.044.325-.065a.9.9 0 0 0 .237-.102.8.8 0 0 0 .15-.133c.028-.037.073-.116.1-.174.026-.058.054-.16.065-.229a1.895 1.895 0 0 0-.042-.589 2 2 0 0 0-.074-.193c-.023-.053-.355-.542-.736-1.085-.38-.543-.693-1.005-.693-1.025 0-.028.037-.046.234-.105.128-.04.339-.113.469-.162.132-.047.293-.116.36-.15a1 1 0 0 0 .204-.144.8.8 0 0 0 .144-.212c.034-.072.072-.18.085-.238s.024-.2.024-.316c0-.123-.009-.25-.024-.308a1.4 1.4 0 0 0-.072-.202c-.032-.07-.275-.39-.737-.975-.378-.479-.687-.883-.687-.9s.018-.043.04-.055.197-.11.39-.215c.194-.103.431-.237.528-.295.096-.058.22-.15.274-.204a1.1 1.1 0 0 0 .257-.459c.026-.1.031-.247.04-1.283.005-.642.016-1.178.023-1.19s.105-.069.22-.125c.112-.058.284-.15.38-.204a10 10 0 0 0 .985-.668 6.762 6.762 0 0 0 .826-.767c.107-.117.267-.305.358-.418a8 8 0 0 0 .605-.891 8.9 8.9 0 0 0 .373-.756c.045-.105.12-.308.17-.448a8 8 0 0 0 .156-.536c.037-.155.088-.408.113-.563.023-.155.05-.381.061-.505a8 8 0 0 0-.007-1.139 8 8 0 0 0-.07-.527 8 8 0 0 0-.097-.466c-.028-.116-.08-.3-.116-.413a7 7 0 0 0-.83-1.714 10 10 0 0 0-.256-.37 9 9 0 0 0-.23-.29 9 9 0 0 0-.81-.82 9 9 0 0 0-.395-.32 9 9 0 0 0-.835-.556 13 13 0 0 0-.417-.221 11 11 0 0 0-.483-.223 8 8 0 0 0-.98-.343 11 11 0 0 0-.422-.108c-.106-.022-.288-.06-.404-.079a10 10 0 0 0-.51-.073 8 8 0 0 0-.852-.043c-.304-.001-.644.002-.756.011m.207 3.334-.058.006a4.6 4.6 0 0 0-1.283.341 4 4 0 0 0-.334.159 4.354 4.354 0 0 0-.668.452 5.5 5.5 0 0 0-.669.69 5 5 0 0 0-.207.308 4 4 0 0 0-.18.325c-.04.088-.101.234-.135.325a3.856 3.856 0 0 0-.177.66c-.016.087-.034.24-.04.342-.01.159-.008.19.017.215.028.03.25.031 4.175.031 3.663 0 4.15-.003 4.174-.026q.029-.027.028-.12a3 3 0 0 0-.072-.574 3.9 3.9 0 0 0-.297-.87 4 4 0 0 0-.21-.379 6 6 0 0 0-.23-.316 6 6 0 0 0-.346-.37 5 5 0 0 0-.365-.326 7 7 0 0 0-.246-.178 5 5 0 0 0-.264-.16 4.6 4.6 0 0 0-1.585-.52 5.681 5.681 0 0 0-.84-.035z",
35
+ "clip-rule": "evenodd"
36
+ })]
37
+ });
38
+ var passkeyIconError = jsxs("svg", {
39
+ xmlns: "http://www.w3.org/2000/svg",
40
+ width: "43",
41
+ height: "48",
42
+ fill: "none",
43
+ children: [jsx("path", {
44
+ fill: "var(--error-color)",
45
+ "fill-rule": "evenodd",
46
+ d: "M27.52 37.06a6.8 6.8 0 0 0-2.02-.31H12a6.75 6.75 0 0 0-6.75 6.75V48H.75v-4.5A11.25 11.25 0 0 1 12 32.25h13.5c.68 0 1.355.062 2.016.182zm4.698-23.74a13.5 13.5 0 1 0-8.503 13.484c-.057-.178-.131-.425-.167-.566a13 13 0 0 1-.229-1.134 12 12 0 0 1-.054-.448q-.02-.202-.013-1.064c.007-.82.01-.877.055-1.186.018-.121.046-.29.072-.438a9 9 0 1 1 4.315-6.714 13.83 13.83 0 0 1 .87-.564 14 14 0 0 1 1.08-.556c.102-.045.299-.128.44-.184.14-.056.384-.146.544-.202.16-.055.436-.141.615-.194.18-.05.467-.125.641-.165.092-.02.214-.046.334-.07",
47
+ "clip-rule": "evenodd"
48
+ }), jsx("path", {
49
+ fill: "var(--error-color)",
50
+ "fill-rule": "evenodd",
51
+ d: "M33.844 16.554a9.563 9.563 0 0 0-.975.134c-.125.022-.355.075-.51.114s-.418.12-.589.177a11 11 0 0 0-.553.21 12 12 0 0 0-.519.244 8.29 8.29 0 0 0-.961.573c-.114.08-.313.23-.445.334-.13.104-.358.31-.507.454a10 10 0 0 0-.466.495c-.107.127-.269.334-.362.46-.091.128-.232.34-.313.474-.079.133-.195.34-.256.46-.062.122-.15.308-.196.413a10 10 0 0 0-.152.387c-.04.107-.1.304-.14.44a9 9 0 0 0-.119.51c-.028.145-.065.374-.082.51a6 6 0 0 0-.032.773c-.002.327.007.598.021.712a8.924 8.924 0 0 0 .163.905c.03.116.09.322.134.457.046.136.125.35.178.475a8 8 0 0 0 .725 1.329 9.15 9.15 0 0 0 .622.772c.111.121.294.306.408.41.114.101.295.256.4.342.108.085.273.211.37.28.097.068.244.165.325.218l.299.179c.082.047.251.137.374.2.125.062.232.127.24.146.013.025.018 2.403.018 7.032 0 5.905.004 7.018.025 7.125.014.07.047.18.075.24.029.064.08.156.113.203.032.05.522.654 1.086 1.345.564.693 1.07 1.31 1.123 1.371.054.063.14.151.195.195.054.042.162.111.239.151s.204.092.281.115c.121.035.181.04.413.04.206 0 .3-.007.387-.03a2 2 0 0 0 .237-.09 1.8 1.8 0 0 0 .388-.25c.029-.029.547-.657 1.153-1.397a97 97 0 0 0 1.12-1.383.4.4 0 0 0 .019-.137c0-.053-.016-.178-.035-.276a5 5 0 0 0-.273-.876 24 24 0 0 0-.298-.73 32 32 0 0 0-.626-1.365.8.8 0 0 1-.069-.172q.001-.033.041-.043c.021-.003.134-.016.25-.026s.295-.032.395-.046c.102-.016.248-.044.325-.065a.9.9 0 0 0 .237-.102.8.8 0 0 0 .15-.133c.028-.037.073-.116.1-.174.026-.058.054-.16.065-.229a1.895 1.895 0 0 0-.042-.589 2 2 0 0 0-.074-.193c-.023-.053-.355-.542-.736-1.085-.38-.543-.693-1.005-.693-1.025 0-.028.037-.046.234-.105.128-.04.339-.113.469-.162.132-.047.293-.116.36-.15a1 1 0 0 0 .204-.144.8.8 0 0 0 .144-.212c.034-.072.072-.18.085-.238s.024-.2.024-.316c0-.123-.009-.25-.024-.308a1.4 1.4 0 0 0-.072-.202c-.032-.07-.275-.39-.737-.975-.378-.479-.687-.883-.687-.9s.018-.043.04-.055.197-.11.39-.215c.194-.103.431-.237.528-.295.096-.058.22-.15.274-.204a1.1 1.1 0 0 0 .257-.459c.026-.1.031-.247.04-1.283.005-.642.016-1.178.023-1.19s.105-.069.22-.125c.112-.058.284-.15.38-.204a10 10 0 0 0 .985-.668 6.762 6.762 0 0 0 .826-.767c.107-.117.267-.305.358-.418a8 8 0 0 0 .605-.891 8.9 8.9 0 0 0 .373-.756c.045-.105.12-.308.17-.448a8 8 0 0 0 .156-.536c.037-.155.088-.408.113-.563.023-.155.05-.381.061-.505a8 8 0 0 0-.007-1.139 8 8 0 0 0-.07-.527 8 8 0 0 0-.097-.466c-.028-.116-.08-.3-.116-.413a7 7 0 0 0-.83-1.714 10 10 0 0 0-.256-.37 9 9 0 0 0-.23-.29 9 9 0 0 0-.81-.82 9 9 0 0 0-.395-.32 9 9 0 0 0-.835-.556 13 13 0 0 0-.417-.221 11 11 0 0 0-.483-.223 8 8 0 0 0-.98-.343 11 11 0 0 0-.422-.108c-.106-.022-.288-.06-.404-.079a10 10 0 0 0-.51-.073 8 8 0 0 0-.852-.043c-.304-.001-.644.002-.756.011m.207 3.334-.058.006a4.6 4.6 0 0 0-1.283.341 4 4 0 0 0-.334.159 4.354 4.354 0 0 0-.668.452 5.5 5.5 0 0 0-.669.69 5 5 0 0 0-.207.308 4 4 0 0 0-.18.325c-.04.088-.101.234-.135.325a3.856 3.856 0 0 0-.177.66c-.016.087-.034.24-.04.342-.01.159-.008.19.017.215.028.03.25.031 4.175.031 3.663 0 4.15-.003 4.174-.026q.029-.027.028-.12a3 3 0 0 0-.072-.574 3.9 3.9 0 0 0-.297-.87 4 4 0 0 0-.21-.379 6 6 0 0 0-.23-.316 6 6 0 0 0-.346-.37 5 5 0 0 0-.365-.326 7 7 0 0 0-.246-.178 5 5 0 0 0-.264-.16 4.6 4.6 0 0 0-1.585-.52 5.681 5.681 0 0 0-.84-.035z",
52
+ "clip-rule": "evenodd"
53
+ })]
54
+ });
55
+ var Auth = function Auth(_ref) {
56
+ var onAuthSuccess = _ref.onAuthSuccess,
57
+ onError = _ref.onError,
58
+ authConfig = _ref.authConfig,
59
+ configOrder = _ref.configOrder,
60
+ customSmsMessage = _ref.customSmsMessage,
61
+ customAccounts = _ref.customAccounts;
62
+ var _useTurnkey = useTurnkey(),
63
+ passkeyClient = _useTurnkey.passkeyClient,
64
+ authIframeClient = _useTurnkey.authIframeClient,
65
+ turnkey = _useTurnkey.turnkey;
66
+ var _useState = useState(""),
67
+ _useState2 = _slicedToArray(_useState, 2),
68
+ email = _useState2[0],
69
+ setEmail = _useState2[1];
70
+ var _useState3 = useState(""),
71
+ _useState4 = _slicedToArray(_useState3, 2),
72
+ phone = _useState4[0],
73
+ setPhone = _useState4[1];
74
+ var _useState5 = useState(null),
75
+ _useState6 = _slicedToArray(_useState5, 2),
76
+ otpId = _useState6[0],
77
+ setOtpId = _useState6[1];
78
+ var _useState7 = useState("auth"),
79
+ _useState8 = _slicedToArray(_useState7, 2),
80
+ step = _useState8[0],
81
+ setStep = _useState8[1];
82
+ var _useState9 = useState(""),
83
+ _useState10 = _slicedToArray(_useState9, 2),
84
+ oauthLoading = _useState10[0],
85
+ setOauthLoading = _useState10[1];
86
+ var _useState11 = useState(""),
87
+ _useState12 = _slicedToArray(_useState11, 2),
88
+ suborgId = _useState12[0],
89
+ setSuborgId = _useState12[1];
90
+ var _useState13 = useState(false),
91
+ _useState14 = _slicedToArray(_useState13, 2),
92
+ passkeySignupScreen = _useState14[0],
93
+ setPasskeySignupScreen = _useState14[1];
94
+ var _useState15 = useState(false),
95
+ _useState16 = _slicedToArray(_useState15, 2),
96
+ passkeyCreationScreen = _useState16[0],
97
+ setPasskeyCreationScreen = _useState16[1];
98
+ var _useState17 = useState(""),
99
+ _useState18 = _slicedToArray(_useState17, 2),
100
+ passkeySignupError = _useState18[0],
101
+ setPasskeySignupError = _useState18[1];
102
+ var _useState19 = useState(true),
103
+ _useState20 = _slicedToArray(_useState19, 2),
104
+ loading = _useState20[0],
105
+ setLoading = _useState20[1];
106
+ var _useState21 = useState(false),
107
+ _useState22 = _slicedToArray(_useState21, 2),
108
+ passkeyCreated = _useState22[0],
109
+ setPasskeyCreated = _useState22[1];
110
+ var handleResendCode = /*#__PURE__*/function () {
111
+ var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
112
+ return _regeneratorRuntime().wrap(function _callee$(_context) {
113
+ while (1) switch (_context.prev = _context.next) {
114
+ case 0:
115
+ if (!(step === OtpType.Email)) {
116
+ _context.next = 5;
117
+ break;
118
+ }
119
+ _context.next = 3;
120
+ return handleOtpLogin(FilterType.Email, email, OtpType.Email);
121
+ case 3:
122
+ _context.next = 8;
123
+ break;
124
+ case 5:
125
+ if (!(step === OtpType.Sms)) {
126
+ _context.next = 8;
127
+ break;
128
+ }
129
+ _context.next = 8;
130
+ return handleOtpLogin(FilterType.PhoneNumber, phone, OtpType.Sms);
131
+ case 8:
132
+ case "end":
133
+ return _context.stop();
41
134
  }
135
+ }, _callee);
136
+ }));
137
+ return function handleResendCode() {
138
+ return _ref2.apply(this, arguments);
42
139
  };
43
- useEffect(() => {
44
- if (authIframeClient) {
45
- setLoading(false);
46
- }
47
- }, [authIframeClient]);
48
- if (loading) {
49
- return (jsx("div", { className: styles.defaultLoader, children: jsx(CircularProgress, { size: 80, thickness: 1, className: styles.circularProgress }) }));
140
+ }();
141
+ useEffect(function () {
142
+ if (authIframeClient) {
143
+ setLoading(false);
50
144
  }
51
- const isValidEmail = (email) => /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);
52
- const isValidPhone = (phone) => /^\+1\d{10}$/.test(phone);
53
- const handleGetOrCreateSuborg = async (filterType, filterValue, additionalData = {}) => {
54
- let suborgId;
55
- if (filterType == FilterType.Email ||
56
- filterType == FilterType.PhoneNumber) {
57
- const getVerifiedSuborgsResponse = await server.getVerifiedSuborgs({
58
- filterType,
59
- filterValue,
145
+ }, [authIframeClient]);
146
+ if (loading) {
147
+ return jsx("div", {
148
+ className: styles.defaultLoader,
149
+ children: jsx(CircularProgress, {
150
+ size: 80,
151
+ thickness: 1,
152
+ className: styles.circularProgress
153
+ })
154
+ });
155
+ }
156
+ var isValidEmail = function isValidEmail(email) {
157
+ return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);
158
+ };
159
+ var isValidPhone = function isValidPhone(phone) {
160
+ return /^\+1\d{10}$/.test(phone);
161
+ };
162
+ var handleGetOrCreateSuborg = /*#__PURE__*/function () {
163
+ var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(filterType, filterValue) {
164
+ var additionalData,
165
+ suborgId,
166
+ getVerifiedSuborgsResponse,
167
+ getSuborgsResponse,
168
+ createSuborgData,
169
+ createSuborgResponse,
170
+ _args2 = arguments;
171
+ return _regeneratorRuntime().wrap(function _callee2$(_context2) {
172
+ while (1) switch (_context2.prev = _context2.next) {
173
+ case 0:
174
+ additionalData = _args2.length > 2 && _args2[2] !== undefined ? _args2[2] : {};
175
+ if (!(filterType == FilterType.Email || filterType == FilterType.PhoneNumber)) {
176
+ _context2.next = 11;
177
+ break;
178
+ }
179
+ _context2.next = 4;
180
+ return server.getVerifiedSuborgs({
181
+ filterType: filterType,
182
+ filterValue: filterValue
60
183
  });
61
- if (!getVerifiedSuborgsResponse ||
62
- !getVerifiedSuborgsResponse.organizationIds) {
63
- onError(authErrors.suborg.fetchFailed);
184
+ case 4:
185
+ getVerifiedSuborgsResponse = _context2.sent;
186
+ if (!(!getVerifiedSuborgsResponse || !getVerifiedSuborgsResponse.organizationIds)) {
187
+ _context2.next = 8;
188
+ break;
64
189
  }
65
- suborgId = getVerifiedSuborgsResponse?.organizationIds[0];
66
- }
67
- else {
68
- const getSuborgsResponse = await server.getSuborgs({
69
- filterType,
70
- filterValue,
190
+ onError(authErrors.suborg.fetchFailed);
191
+ return _context2.abrupt("return", null);
192
+ case 8:
193
+ suborgId = getVerifiedSuborgsResponse === null || getVerifiedSuborgsResponse === void 0 ? void 0 : getVerifiedSuborgsResponse.organizationIds[0];
194
+ _context2.next = 18;
195
+ break;
196
+ case 11:
197
+ _context2.next = 13;
198
+ return server.getSuborgs({
199
+ filterType: filterType,
200
+ filterValue: filterValue
71
201
  });
72
- if (!getSuborgsResponse || !getSuborgsResponse.organizationIds) {
73
- onError(authErrors.suborg.fetchFailed);
202
+ case 13:
203
+ getSuborgsResponse = _context2.sent;
204
+ if (!(!getSuborgsResponse || !getSuborgsResponse.organizationIds)) {
205
+ _context2.next = 17;
206
+ break;
74
207
  }
75
- suborgId = getSuborgsResponse?.organizationIds[0];
76
- }
77
- if (!suborgId) {
78
- const createSuborgData = { ...additionalData };
79
- if (filterType === FilterType.Email)
80
- createSuborgData.email = filterValue;
81
- else if (filterType === FilterType.PhoneNumber)
82
- createSuborgData.phoneNumber = filterValue;
208
+ onError(authErrors.suborg.fetchFailed);
209
+ return _context2.abrupt("return", null);
210
+ case 17:
211
+ suborgId = getSuborgsResponse === null || getSuborgsResponse === void 0 ? void 0 : getSuborgsResponse.organizationIds[0];
212
+ case 18:
213
+ if (suborgId) {
214
+ _context2.next = 27;
215
+ break;
216
+ }
217
+ createSuborgData = _objectSpread2({}, additionalData);
218
+ if (filterType === FilterType.Email) createSuborgData.email = filterValue;else if (filterType === FilterType.PhoneNumber) createSuborgData.phoneNumber = filterValue;
83
219
  if (customAccounts) {
84
- createSuborgData.customAccounts = customAccounts;
220
+ createSuborgData.customAccounts = customAccounts;
85
221
  }
86
- const createSuborgResponse = await server.createSuborg(createSuborgData);
222
+ _context2.next = 24;
223
+ return server.createSuborg(createSuborgData);
224
+ case 24:
225
+ createSuborgResponse = _context2.sent;
87
226
  if (!createSuborgResponse || !createSuborgResponse.subOrganizationId) {
88
- onError(authErrors.suborg.createFailed);
227
+ onError(authErrors.suborg.createFailed);
89
228
  }
90
- suborgId = createSuborgResponse?.subOrganizationId;
229
+ suborgId = createSuborgResponse === null || createSuborgResponse === void 0 ? void 0 : createSuborgResponse.subOrganizationId;
230
+ case 27:
231
+ return _context2.abrupt("return", suborgId);
232
+ case 28:
233
+ case "end":
234
+ return _context2.stop();
91
235
  }
92
- return suborgId;
236
+ }, _callee2);
237
+ }));
238
+ return function handleGetOrCreateSuborg(_x, _x2) {
239
+ return _ref3.apply(this, arguments);
93
240
  };
94
- const handleAuthSuccess = async (credentialBundle) => {
95
- if (credentialBundle) {
96
- await authIframeClient.injectCredentialBundle(credentialBundle);
97
- await authIframeClient.loginWithAuthBundle(credentialBundle);
98
- await onAuthSuccess();
241
+ }();
242
+ var handleAuthSuccess = /*#__PURE__*/function () {
243
+ var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(credentialBundle, expirationSeconds) {
244
+ return _regeneratorRuntime().wrap(function _callee3$(_context3) {
245
+ while (1) switch (_context3.prev = _context3.next) {
246
+ case 0:
247
+ if (!credentialBundle) {
248
+ _context3.next = 7;
249
+ break;
250
+ }
251
+ _context3.next = 3;
252
+ return authIframeClient.injectCredentialBundle(credentialBundle);
253
+ case 3:
254
+ _context3.next = 5;
255
+ return authIframeClient.loginWithAuthBundle(credentialBundle, expirationSeconds);
256
+ case 5:
257
+ _context3.next = 7;
258
+ return onAuthSuccess();
259
+ case 7:
260
+ case "end":
261
+ return _context3.stop();
99
262
  }
263
+ }, _callee3);
264
+ }));
265
+ return function handleAuthSuccess(_x3, _x4) {
266
+ return _ref4.apply(this, arguments);
100
267
  };
101
- const handleSignupWithPasskey = async () => {
102
- setPasskeySignupError("");
103
- const siteInfo = `${new URL(window.location.href).hostname} - ${new Date().toLocaleString(undefined, {
104
- year: "numeric",
105
- month: "long",
106
- day: "numeric",
107
- hour: "2-digit",
108
- minute: "2-digit",
109
- second: "2-digit",
110
- })}`;
111
- setPasskeySignupScreen(false);
112
- setPasskeyCreationScreen(true);
113
- try {
114
- if (!passkeyCreated) {
115
- const { encodedChallenge, attestation } = (await passkeyClient?.createUserPasskey({
116
- publicKey: { user: { name: siteInfo, displayName: siteInfo } },
117
- })) || {};
118
- if (encodedChallenge && attestation) {
119
- const response = await server.createSuborg({
120
- email,
121
- passkey: {
122
- authenticatorName: "First Passkey",
123
- challenge: encodedChallenge,
124
- attestation,
125
- },
126
- ...(customAccounts && { customAccounts }),
127
- });
128
- if (response?.subOrganizationId) {
129
- setPasskeyCreated(true);
130
- }
131
- else {
132
- authErrors.passkey.createFailed;
133
- }
134
- }
135
- else {
136
- authErrors.passkey.createFailed;
137
- }
268
+ }();
269
+ var handleSignupWithPasskey = /*#__PURE__*/function () {
270
+ var _ref5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4() {
271
+ var siteInfo, _turnkey$config$defau, _ref6, encodedChallenge, attestation, response, sessionResponse, _authConfig$sessionLe;
272
+ return _regeneratorRuntime().wrap(function _callee4$(_context4) {
273
+ while (1) switch (_context4.prev = _context4.next) {
274
+ case 0:
275
+ setPasskeySignupError("");
276
+ siteInfo = "".concat(new URL(window.location.href).hostname, " - ").concat(new Date().toLocaleString(undefined, {
277
+ year: "numeric",
278
+ month: "long",
279
+ day: "numeric",
280
+ hour: "2-digit",
281
+ minute: "2-digit",
282
+ second: "2-digit"
283
+ }));
284
+ setPasskeySignupScreen(false);
285
+ setPasskeyCreationScreen(true);
286
+ _context4.prev = 4;
287
+ if (passkeyCreated) {
288
+ _context4.next = 22;
289
+ break;
138
290
  }
139
- const sessionResponse = await passkeyClient?.createReadWriteSession({
140
- targetPublicKey: authIframeClient?.iframePublicKey,
141
- organizationId: process.env.NEXT_PUBLIC_ORGANIZATION_ID,
291
+ _context4.next = 8;
292
+ return passkeyClient === null || passkeyClient === void 0 ? void 0 : passkeyClient.createUserPasskey({
293
+ publicKey: {
294
+ user: {
295
+ name: siteInfo,
296
+ displayName: siteInfo
297
+ }
298
+ }
142
299
  });
143
- if (sessionResponse?.credentialBundle) {
144
- await handleAuthSuccess(sessionResponse.credentialBundle);
300
+ case 8:
301
+ _context4.t0 = _context4.sent;
302
+ if (_context4.t0) {
303
+ _context4.next = 11;
304
+ break;
145
305
  }
146
- else {
147
- setPasskeySignupError(authErrors.passkey.loginFailed);
306
+ _context4.t0 = {};
307
+ case 11:
308
+ _ref6 = _context4.t0;
309
+ encodedChallenge = _ref6.encodedChallenge;
310
+ attestation = _ref6.attestation;
311
+ if (!(encodedChallenge && attestation)) {
312
+ _context4.next = 21;
313
+ break;
148
314
  }
149
- }
150
- catch {
315
+ _context4.next = 17;
316
+ return server.createSuborg(_objectSpread2({
317
+ email: email,
318
+ passkey: {
319
+ authenticatorName: "First Passkey",
320
+ challenge: encodedChallenge,
321
+ attestation: attestation
322
+ }
323
+ }, customAccounts && {
324
+ customAccounts: customAccounts
325
+ }));
326
+ case 17:
327
+ response = _context4.sent;
328
+ if (response !== null && response !== void 0 && response.subOrganizationId) {
329
+ setPasskeyCreated(true);
330
+ }
331
+ _context4.next = 22;
332
+ break;
333
+ case 21:
334
+ case 22:
335
+ _context4.next = 24;
336
+ return passkeyClient === null || passkeyClient === void 0 ? void 0 : passkeyClient.createReadWriteSession(_objectSpread2(_objectSpread2({
337
+ targetPublicKey: authIframeClient === null || authIframeClient === void 0 ? void 0 : authIframeClient.iframePublicKey
338
+ }, authConfig.sessionLengthSeconds !== undefined && {
339
+ expirationSeconds: authConfig.sessionLengthSeconds.toString()
340
+ }), {}, {
341
+ organizationId: (_turnkey$config$defau = turnkey === null || turnkey === void 0 ? void 0 : turnkey.config.defaultOrganizationId) !== null && _turnkey$config$defau !== void 0 ? _turnkey$config$defau : process.env.NEXT_PUBLIC_ORGANIZATION_ID
342
+ }));
343
+ case 24:
344
+ sessionResponse = _context4.sent;
345
+ if (!(sessionResponse !== null && sessionResponse !== void 0 && sessionResponse.credentialBundle)) {
346
+ _context4.next = 30;
347
+ break;
348
+ }
349
+ _context4.next = 28;
350
+ return handleAuthSuccess(sessionResponse.credentialBundle, (_authConfig$sessionLe = authConfig.sessionLengthSeconds) === null || _authConfig$sessionLe === void 0 ? void 0 : _authConfig$sessionLe.toString());
351
+ case 28:
352
+ _context4.next = 31;
353
+ break;
354
+ case 30:
355
+ setPasskeySignupError(authErrors.passkey.loginFailed);
356
+ case 31:
357
+ _context4.next = 36;
358
+ break;
359
+ case 33:
360
+ _context4.prev = 33;
361
+ _context4.t1 = _context4["catch"](4);
151
362
  setPasskeySignupError(authErrors.passkey.timeoutOrNotAllowed);
363
+ case 36:
364
+ case "end":
365
+ return _context4.stop();
152
366
  }
367
+ }, _callee4, null, [[4, 33]]);
368
+ }));
369
+ return function handleSignupWithPasskey() {
370
+ return _ref5.apply(this, arguments);
153
371
  };
154
- const handleLoginWithPasskey = async () => {
155
- try {
156
- const sessionResponse = await passkeyClient?.createReadWriteSession({
157
- targetPublicKey: authIframeClient?.iframePublicKey,
158
- organizationId: process.env.NEXT_PUBLIC_ORGANIZATION_ID,
159
- });
160
- if (sessionResponse?.credentialBundle) {
161
- await handleAuthSuccess(sessionResponse.credentialBundle);
372
+ }();
373
+ var handleLoginWithPasskey = /*#__PURE__*/function () {
374
+ var _ref7 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee5() {
375
+ var _turnkey$config$defau2, sessionResponse, _authConfig$sessionLe2;
376
+ return _regeneratorRuntime().wrap(function _callee5$(_context5) {
377
+ while (1) switch (_context5.prev = _context5.next) {
378
+ case 0:
379
+ _context5.prev = 0;
380
+ _context5.next = 3;
381
+ return passkeyClient === null || passkeyClient === void 0 ? void 0 : passkeyClient.createReadWriteSession(_objectSpread2(_objectSpread2({
382
+ targetPublicKey: authIframeClient === null || authIframeClient === void 0 ? void 0 : authIframeClient.iframePublicKey
383
+ }, authConfig.sessionLengthSeconds !== undefined && {
384
+ expirationSeconds: authConfig.sessionLengthSeconds.toString()
385
+ }), {}, {
386
+ organizationId: (_turnkey$config$defau2 = turnkey === null || turnkey === void 0 ? void 0 : turnkey.config.defaultOrganizationId) !== null && _turnkey$config$defau2 !== void 0 ? _turnkey$config$defau2 : process.env.NEXT_PUBLIC_ORGANIZATION_ID
387
+ }));
388
+ case 3:
389
+ sessionResponse = _context5.sent;
390
+ if (!(sessionResponse !== null && sessionResponse !== void 0 && sessionResponse.credentialBundle)) {
391
+ _context5.next = 9;
392
+ break;
162
393
  }
163
- else {
164
- authErrors.passkey.loginFailed;
165
- }
166
- }
167
- catch (error) {
394
+ _context5.next = 7;
395
+ return handleAuthSuccess(sessionResponse.credentialBundle, (_authConfig$sessionLe2 = authConfig.sessionLengthSeconds) === null || _authConfig$sessionLe2 === void 0 ? void 0 : _authConfig$sessionLe2.toString());
396
+ case 7:
397
+ _context5.next = 10;
398
+ break;
399
+ case 9:
400
+ case 10:
401
+ _context5.next = 15;
402
+ break;
403
+ case 12:
404
+ _context5.prev = 12;
405
+ _context5.t0 = _context5["catch"](0);
168
406
  onError(authErrors.passkey.loginFailed);
407
+ case 15:
408
+ case "end":
409
+ return _context5.stop();
169
410
  }
411
+ }, _callee5, null, [[0, 12]]);
412
+ }));
413
+ return function handleLoginWithPasskey() {
414
+ return _ref7.apply(this, arguments);
170
415
  };
171
- const handleOtpLogin = async (type, value, otpType) => {
172
- const suborgId = await handleGetOrCreateSuborg(type, value);
173
- const initAuthResponse = await server.sendOtp({
174
- suborgID: suborgId,
175
- otpType,
176
- contact: value,
177
- ...(customSmsMessage && { customSmsMessage }),
178
- userIdentifier: authIframeClient?.iframePublicKey,
179
- });
180
- if (initAuthResponse && initAuthResponse.otpId) {
181
- setSuborgId(suborgId);
182
- setOtpId(initAuthResponse?.otpId);
183
- setStep(otpType);
184
- }
185
- else {
186
- onError(authErrors.otp.sendFailed);
416
+ }();
417
+ var handleOtpLogin = /*#__PURE__*/function () {
418
+ var _ref8 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee6(type, value, otpType) {
419
+ var suborgId, initAuthResponse;
420
+ return _regeneratorRuntime().wrap(function _callee6$(_context6) {
421
+ while (1) switch (_context6.prev = _context6.next) {
422
+ case 0:
423
+ _context6.next = 2;
424
+ return handleGetOrCreateSuborg(type, value);
425
+ case 2:
426
+ suborgId = _context6.sent;
427
+ _context6.next = 5;
428
+ return server.sendOtp(_objectSpread2(_objectSpread2({
429
+ suborgID: suborgId,
430
+ otpType: otpType,
431
+ contact: value
432
+ }, customSmsMessage && {
433
+ customSmsMessage: customSmsMessage
434
+ }), {}, {
435
+ userIdentifier: authIframeClient === null || authIframeClient === void 0 ? void 0 : authIframeClient.iframePublicKey
436
+ }));
437
+ case 5:
438
+ initAuthResponse = _context6.sent;
439
+ if (initAuthResponse && initAuthResponse.otpId) {
440
+ setSuborgId(suborgId);
441
+ setOtpId(initAuthResponse === null || initAuthResponse === void 0 ? void 0 : initAuthResponse.otpId);
442
+ setStep(otpType);
443
+ } else {
444
+ onError(authErrors.otp.sendFailed);
445
+ }
446
+ case 7:
447
+ case "end":
448
+ return _context6.stop();
187
449
  }
450
+ }, _callee6);
451
+ }));
452
+ return function handleOtpLogin(_x5, _x6, _x7) {
453
+ return _ref8.apply(this, arguments);
188
454
  };
189
- const handleOAuthLogin = async (credential, providerName) => {
190
- setOauthLoading(providerName);
191
- const suborgId = await handleGetOrCreateSuborg(FilterType.OidcToken, credential, {
192
- oauthProviders: [{ providerName, oidcToken: credential }],
193
- });
194
- const oauthResponse = await server.oauth({
195
- suborgID: suborgId,
196
- oidcToken: credential,
197
- targetPublicKey: authIframeClient?.iframePublicKey,
198
- sessionLengthSeconds: authConfig.sessionLengthSeconds,
199
- });
200
- if (oauthResponse && oauthResponse.token) {
201
- await handleAuthSuccess(oauthResponse.token);
202
- }
203
- else {
455
+ }();
456
+ var handleOAuthLogin = /*#__PURE__*/function () {
457
+ var _ref9 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee7(credential, providerName) {
458
+ var suborgId, oauthResponse, _authConfig$sessionLe3;
459
+ return _regeneratorRuntime().wrap(function _callee7$(_context7) {
460
+ while (1) switch (_context7.prev = _context7.next) {
461
+ case 0:
462
+ setOauthLoading(providerName);
463
+ _context7.next = 3;
464
+ return handleGetOrCreateSuborg(FilterType.OidcToken, credential, {
465
+ oauthProviders: [{
466
+ providerName: providerName,
467
+ oidcToken: credential
468
+ }]
469
+ });
470
+ case 3:
471
+ suborgId = _context7.sent;
472
+ _context7.next = 6;
473
+ return server.oauth({
474
+ suborgID: suborgId,
475
+ oidcToken: credential,
476
+ targetPublicKey: authIframeClient === null || authIframeClient === void 0 ? void 0 : authIframeClient.iframePublicKey,
477
+ sessionLengthSeconds: authConfig.sessionLengthSeconds
478
+ });
479
+ case 6:
480
+ oauthResponse = _context7.sent;
481
+ if (!(oauthResponse && oauthResponse.token)) {
482
+ _context7.next = 12;
483
+ break;
484
+ }
485
+ _context7.next = 10;
486
+ return handleAuthSuccess(oauthResponse.token, (_authConfig$sessionLe3 = authConfig.sessionLengthSeconds) === null || _authConfig$sessionLe3 === void 0 ? void 0 : _authConfig$sessionLe3.toString());
487
+ case 10:
488
+ _context7.next = 13;
489
+ break;
490
+ case 12:
204
491
  onError(authErrors.oauth.loginFailed);
492
+ case 13:
493
+ case "end":
494
+ return _context7.stop();
205
495
  }
496
+ }, _callee7);
497
+ }));
498
+ return function handleOAuthLogin(_x8, _x9) {
499
+ return _ref9.apply(this, arguments);
206
500
  };
207
- const renderBackButton = () => (jsx(ChevronLeftIcon, { onClick: () => {
208
- setPasskeyCreationScreen(false);
209
- setPasskeySignupError("");
210
- setPasskeySignupScreen(false);
211
- setOtpId(null);
212
- }, sx: {
213
- color: "var(--text-secondary)",
214
- position: "absolute",
215
- fontSize: "24px",
216
- top: 16,
217
- left: 16,
218
- zIndex: 10,
219
- cursor: "pointer",
220
- borderRadius: "50%",
221
- padding: "6px",
222
- transition: "background-color 0.3s ease",
223
- } }));
224
- const renderSocialButtons = () => {
225
- const { googleEnabled, appleEnabled, facebookEnabled } = authConfig;
226
- const layout = [googleEnabled, appleEnabled, facebookEnabled].filter(Boolean).length >= 2
227
- ? "inline"
228
- : "stacked";
229
- return (jsxs("div", { className: layout === "inline"
230
- ? styles.socialButtonContainerInline
231
- : styles.socialButtonContainerStacked, children: [googleEnabled && (jsx(GoogleAuthButton, { layout: layout, clientId: process.env.NEXT_PUBLIC_GOOGLE_CLIENT_ID, iframePublicKey: authIframeClient.iframePublicKey, onSuccess: (response) => handleOAuthLogin(response.idToken, "Google") })), appleEnabled && (jsx(AppleAuthButton, { layout: layout, clientId: process.env.NEXT_PUBLIC_APPLE_CLIENT_ID, iframePublicKey: authIframeClient.iframePublicKey, onSuccess: (response) => handleOAuthLogin(response.idToken, "Apple") })), facebookEnabled && (jsx(FacebookAuthButton, { layout: layout, clientId: process.env.NEXT_PUBLIC_FACEBOOK_CLIENT_ID, iframePublicKey: authIframeClient.iframePublicKey, onSuccess: (response) => handleOAuthLogin(response.id_token, "Facebook") }))] }));
232
- };
233
- const renderSection = (section) => {
234
- switch (section) {
235
- case "email":
236
- return authConfig.emailEnabled && !otpId ? (jsxs("form", { onSubmit: (e) => {
237
- e.preventDefault();
238
- handleOtpLogin(FilterType.Email, email, OtpType.Email);
239
- }, children: [jsx("div", { className: styles.inputGroup, children: jsx(TextField, { name: "email-input", type: "email", placeholder: "Enter your email", value: email, onChange: (e) => setEmail(e.target.value), fullWidth: true, sx: {
240
- "& .MuiOutlinedInput-root": {
241
- color: "var(--input-text)",
242
- "& fieldset": {
243
- borderColor: "var(--input-border)",
244
- },
245
- "&:hover fieldset": {
246
- borderColor: "var(--input-hover-border)",
247
- },
248
- "&.Mui-focused fieldset": {
249
- borderColor: "var(--input-focus-border)",
250
- border: "1px solid",
251
- },
252
- },
253
- "& .MuiInputBase-input": {
254
- padding: "12px",
255
- },
256
- backgroundColor: "var(--input-bg)",
257
- }, variant: "outlined" }) }), jsx("button", { className: styles.authButton, type: "submit", disabled: !isValidEmail(email), children: "Continue" })] })) : null;
258
- case "phone":
259
- return authConfig.phoneEnabled && !otpId ? (jsxs("form", { onSubmit: (e) => {
260
- e.preventDefault();
261
- handleOtpLogin(FilterType.PhoneNumber, phone, OtpType.Sms);
262
- }, children: [jsx("div", { className: styles.phoneInput, children: jsx(MuiPhone, { onChange: (value) => setPhone(value), value: phone }) }), jsx("button", { className: styles.authButton, type: "submit", disabled: !isValidPhone(phone), children: "Continue" })] })) : null;
263
- case "passkey":
264
- return authConfig.passkeyEnabled && !otpId ? (jsxs("div", { className: styles.passkeyContainer, children: [jsx("button", { className: styles.authButton, type: "button", onClick: handleLoginWithPasskey, children: "Log in with passkey" }), jsx("div", { className: styles.noPasskeyLink, onClick: () => setPasskeySignupScreen(true), children: "Sign up with passkey" })] })) : null;
265
- case "socials":
266
- return authConfig.googleEnabled ||
267
- authConfig.appleEnabled ||
268
- authConfig.facebookEnabled
269
- ? renderSocialButtons()
270
- : null;
271
- default:
272
- return null;
501
+ }();
502
+ var renderBackButton = function renderBackButton() {
503
+ return jsx(ChevronLeftIcon, {
504
+ onClick: function onClick() {
505
+ setPasskeyCreationScreen(false);
506
+ setPasskeySignupError("");
507
+ setPasskeySignupScreen(false);
508
+ setOtpId(null);
509
+ },
510
+ sx: {
511
+ color: "var(--text-secondary)",
512
+ position: "absolute",
513
+ fontSize: "24px",
514
+ top: 16,
515
+ left: 16,
516
+ zIndex: 10,
517
+ cursor: "pointer",
518
+ borderRadius: "50%",
519
+ padding: "6px",
520
+ transition: "background-color 0.3s ease"
521
+ }
522
+ });
523
+ };
524
+ var renderSocialButtons = function renderSocialButtons() {
525
+ var _authConfig$googleCli, _authConfig$appleClie, _authConfig$facebookC;
526
+ var googleEnabled = authConfig.googleEnabled,
527
+ appleEnabled = authConfig.appleEnabled,
528
+ facebookEnabled = authConfig.facebookEnabled;
529
+ var layout = [googleEnabled, appleEnabled, facebookEnabled].filter(Boolean).length >= 2 ? "inline" : "stacked";
530
+ return jsxs("div", {
531
+ className: layout === "inline" ? styles.socialButtonContainerInline : styles.socialButtonContainerStacked,
532
+ children: [googleEnabled && jsx(GoogleAuthButton, {
533
+ layout: layout,
534
+ clientId: (_authConfig$googleCli = authConfig.googleClientId) !== null && _authConfig$googleCli !== void 0 ? _authConfig$googleCli : process.env.NEXT_PUBLIC_GOOGLE_CLIENT_ID,
535
+ iframePublicKey: authIframeClient.iframePublicKey,
536
+ onSuccess: function onSuccess(response) {
537
+ return handleOAuthLogin(response.idToken, "Google");
273
538
  }
274
- };
275
- return (jsx(Fragment, { children: passkeySignupScreen ? (jsxs("div", { className: styles.authCard, children: [renderBackButton(), jsx("div", { className: styles.passkeyIconContainer, children: passkeyIcon }), jsx("center", { children: jsx("h3", { className: styles.primaryText, children: "Create a passkey" }) }), jsx("div", { className: styles.rowsContainer, children: jsx("center", { children: jsx("span", { className: styles.primaryText, children: "Passkeys allow for easy biometric access to your wallet and can be synced across devices." }) }) }), jsx("button", { className: styles.authButton, type: "button", onClick: handleSignupWithPasskey, children: "Continue" })] })) : passkeyCreationScreen ? (jsxs("div", { className: styles.authCard, children: [renderBackButton(), jsx("div", { className: styles.passkeyIconContainer, children: passkeySignupError ? (jsx("div", { children: passkeyIconError })) : (jsxs("div", { className: styles.loadingWrapper, children: [jsx(CircularProgress, { size: 80, thickness: 1, className: styles.circularProgress }), passkeyIcon] })) }), jsx("center", { children: jsx("h3", { className: styles.primaryText, children: passkeySignupError
276
- ? "Authentication error"
277
- : passkeyCreated
278
- ? "Logging in with passkey..."
279
- : "Creating passkey..." }) }), jsx("div", { className: styles.rowsContainer, children: jsx("span", { className: styles.primaryText, children: jsx("center", { children: passkeySignupError ? passkeySignupError : "" }) }) }), passkeySignupError && (jsx("button", { className: styles.authButton, type: "button", onClick: handleSignupWithPasskey, children: "Retry" }))] })) : (jsx("div", { children: oauthLoading !== "" ? (jsxs("div", { className: styles.authCardLoading, children: [jsxs("h3", { className: styles.verifyingText, children: ["Verifying with ", oauthLoading] }), jsxs("div", { className: styles.loadingWrapper, children: [jsx(CircularProgress, { size: 80, thickness: 1, className: styles.circularProgress }), oauthLoading === "Google" && (jsx("img", { src: googleIcon, className: styles.oauthIcon })), oauthLoading === "Facebook" && (jsx("img", { src: facebookIcon, className: styles.oauthIcon })), oauthLoading === "Apple" && (jsx("img", { src: appleIcon, className: styles.oauthIcon }))] }), jsxs("div", { className: styles.poweredBy, children: [jsx("span", { children: "Secured by" }), jsx("img", { src: turnkeyIcon })] })] })) : (jsxs("div", { className: styles.authCard, children: [otpId && renderBackButton(), jsx("h2", { className: styles.primaryText, children: !otpId && "Log in or sign up" }), jsxs("div", { className: styles.authForm, children: [!otpId &&
280
- configOrder
281
- .filter((section) => renderSection(section) !== null)
282
- .map((section, index, visibleSections) => (jsxs(React.Fragment, { children: [renderSection(section), index < visibleSections.length - 1 && (jsx("div", { className: styles.separator, children: jsx("span", { children: "OR" }) }))] }, section))), otpId && (jsx(OtpVerification, { type: step, contact: step === OtpType.Email ? email : phone, suborgId: suborgId, otpId: otpId, sessionLengthSeconds: authConfig.sessionLengthSeconds, authIframeClient: authIframeClient, onValidateSuccess: handleAuthSuccess, onResendCode: handleResendCode })), !otpId && (jsx("div", { className: styles.tos, children: jsxs("span", { children: ["By continuing, you agree to our", " ", jsx("a", { href: "https://www.turnkey.com/legal/terms", target: "_blank", rel: "noopener noreferrer", className: styles.tosBold, children: "Terms of Service" }), " ", "&", " ", jsx("a", { href: "https://www.turnkey.com/legal/privacy", target: "_blank", rel: "noopener noreferrer", className: styles.tosBold, children: "Privacy Policy" }), "."] }) }))] }), jsxs("div", { onClick: () => (window.location.href = "https://www.turnkey.com/"), className: styles.poweredBy, children: [jsx("span", { children: "Secured by" }), jsx("img", { src: turnkeyIcon })] })] })) })) }));
539
+ }), appleEnabled && jsx(AppleAuthButton, {
540
+ layout: layout,
541
+ clientId: (_authConfig$appleClie = authConfig.appleClientId) !== null && _authConfig$appleClie !== void 0 ? _authConfig$appleClie : process.env.NEXT_PUBLIC_APPLE_CLIENT_ID,
542
+ iframePublicKey: authIframeClient.iframePublicKey,
543
+ onSuccess: function onSuccess(response) {
544
+ return handleOAuthLogin(response.idToken, "Apple");
545
+ }
546
+ }), facebookEnabled && jsx(FacebookAuthButton, {
547
+ layout: layout,
548
+ clientId: (_authConfig$facebookC = authConfig.facebookClientId) !== null && _authConfig$facebookC !== void 0 ? _authConfig$facebookC : process.env.NEXT_PUBLIC_FACEBOOK_CLIENT_ID,
549
+ iframePublicKey: authIframeClient.iframePublicKey,
550
+ onSuccess: function onSuccess(response) {
551
+ return handleOAuthLogin(response.id_token, "Facebook");
552
+ }
553
+ })]
554
+ });
555
+ };
556
+ var renderSection = function renderSection(section) {
557
+ switch (section) {
558
+ case "email":
559
+ return authConfig.emailEnabled && !otpId ? jsxs("form", {
560
+ onSubmit: function onSubmit(e) {
561
+ e.preventDefault();
562
+ handleOtpLogin(FilterType.Email, email, OtpType.Email);
563
+ },
564
+ children: [jsx("div", {
565
+ className: styles.inputGroup,
566
+ children: jsx(TextField, {
567
+ name: "email-input",
568
+ type: "email",
569
+ placeholder: "Enter your email",
570
+ value: email,
571
+ onChange: function onChange(e) {
572
+ return setEmail(e.target.value);
573
+ },
574
+ fullWidth: true,
575
+ sx: {
576
+ "& .MuiOutlinedInput-root": {
577
+ color: "var(--input-text)",
578
+ "& fieldset": {
579
+ borderColor: "var(--input-border)"
580
+ },
581
+ "&:hover fieldset": {
582
+ borderColor: "var(--input-hover-border)"
583
+ },
584
+ "&.Mui-focused fieldset": {
585
+ borderColor: "var(--input-focus-border)",
586
+ border: "1px solid"
587
+ }
588
+ },
589
+ "& .MuiInputBase-input": {
590
+ padding: "12px"
591
+ },
592
+ backgroundColor: "var(--input-bg)"
593
+ },
594
+ variant: "outlined"
595
+ })
596
+ }), jsx("button", {
597
+ className: styles.authButton,
598
+ type: "submit",
599
+ disabled: !isValidEmail(email),
600
+ children: "Continue"
601
+ })]
602
+ }) : null;
603
+ case "phone":
604
+ return authConfig.phoneEnabled && !otpId ? jsxs("form", {
605
+ onSubmit: function onSubmit(e) {
606
+ e.preventDefault();
607
+ handleOtpLogin(FilterType.PhoneNumber, phone, OtpType.Sms);
608
+ },
609
+ children: [jsx("div", {
610
+ className: styles.phoneInput,
611
+ children: jsx(MuiPhone, {
612
+ onChange: function onChange(value) {
613
+ return setPhone(value);
614
+ },
615
+ value: phone
616
+ })
617
+ }), jsx("button", {
618
+ className: styles.authButton,
619
+ type: "submit",
620
+ disabled: !isValidPhone(phone),
621
+ children: "Continue"
622
+ })]
623
+ }) : null;
624
+ case "passkey":
625
+ return authConfig.passkeyEnabled && !otpId ? jsxs("div", {
626
+ className: styles.passkeyContainer,
627
+ children: [jsx("button", {
628
+ className: styles.authButton,
629
+ type: "button",
630
+ onClick: handleLoginWithPasskey,
631
+ children: "Log in with passkey"
632
+ }), jsx("div", {
633
+ className: styles.noPasskeyLink,
634
+ onClick: function onClick() {
635
+ return setPasskeySignupScreen(true);
636
+ },
637
+ children: "Sign up with passkey"
638
+ })]
639
+ }) : null;
640
+ case "socials":
641
+ return authConfig.googleEnabled || authConfig.appleEnabled || authConfig.facebookEnabled ? renderSocialButtons() : null;
642
+ default:
643
+ return null;
644
+ }
645
+ };
646
+ return jsx(Fragment, {
647
+ children: passkeySignupScreen ? jsxs("div", {
648
+ className: styles.authCard,
649
+ children: [renderBackButton(), jsx("div", {
650
+ className: styles.passkeyIconContainer,
651
+ children: passkeyIcon
652
+ }), jsx("center", {
653
+ children: jsx("h3", {
654
+ className: styles.primaryText,
655
+ children: "Create a passkey"
656
+ })
657
+ }), jsx("div", {
658
+ className: styles.rowsContainer,
659
+ children: jsx("center", {
660
+ children: jsx("span", {
661
+ className: styles.primaryText,
662
+ children: "Passkeys allow for easy biometric access to your wallet and can be synced across devices."
663
+ })
664
+ })
665
+ }), jsx("button", {
666
+ className: styles.authButton,
667
+ type: "button",
668
+ onClick: handleSignupWithPasskey,
669
+ children: "Continue"
670
+ })]
671
+ }) : passkeyCreationScreen ? jsxs("div", {
672
+ className: styles.authCard,
673
+ children: [renderBackButton(), jsx("div", {
674
+ className: styles.passkeyIconContainer,
675
+ children: passkeySignupError ? jsx("div", {
676
+ children: passkeyIconError
677
+ }) : jsxs("div", {
678
+ className: styles.loadingWrapper,
679
+ children: [jsx(CircularProgress, {
680
+ size: 80,
681
+ thickness: 1,
682
+ className: styles.circularProgress
683
+ }), passkeyIcon]
684
+ })
685
+ }), jsx("center", {
686
+ children: jsx("h3", {
687
+ className: styles.primaryText,
688
+ children: passkeySignupError ? "Authentication error" : passkeyCreated ? "Logging in with passkey..." : "Creating passkey..."
689
+ })
690
+ }), jsx("div", {
691
+ className: styles.rowsContainer,
692
+ children: jsx("span", {
693
+ className: styles.primaryText,
694
+ children: jsx("center", {
695
+ children: passkeySignupError ? passkeySignupError : ""
696
+ })
697
+ })
698
+ }), passkeySignupError && jsx("button", {
699
+ className: styles.authButton,
700
+ type: "button",
701
+ onClick: handleSignupWithPasskey,
702
+ children: "Retry"
703
+ })]
704
+ }) : jsx("div", {
705
+ children: oauthLoading !== "" ? jsxs("div", {
706
+ className: styles.authCardLoading,
707
+ children: [jsxs("h3", {
708
+ className: styles.verifyingText,
709
+ children: ["Verifying with ", oauthLoading]
710
+ }), jsxs("div", {
711
+ className: styles.loadingWrapper,
712
+ children: [jsx(CircularProgress, {
713
+ size: 80,
714
+ thickness: 1,
715
+ className: styles.circularProgress
716
+ }), oauthLoading === "Google" && jsx("img", {
717
+ src: googleIcon,
718
+ className: styles.oauthIcon
719
+ }), oauthLoading === "Facebook" && jsx("img", {
720
+ src: facebookIcon,
721
+ className: styles.oauthIcon
722
+ }), oauthLoading === "Apple" && jsx("img", {
723
+ src: appleIcon,
724
+ className: styles.oauthIcon
725
+ })]
726
+ }), jsxs("div", {
727
+ className: styles.poweredBy,
728
+ children: [jsx("span", {
729
+ children: "Secured by"
730
+ }), jsx("img", {
731
+ src: turnkeyIcon
732
+ })]
733
+ })]
734
+ }) : jsxs("div", {
735
+ className: styles.authCard,
736
+ children: [otpId && renderBackButton(), jsx("h2", {
737
+ className: styles.primaryText,
738
+ children: !otpId && "Log in or sign up"
739
+ }), jsxs("div", {
740
+ className: styles.authForm,
741
+ children: [!otpId && configOrder.filter(function (section) {
742
+ return renderSection(section) !== null;
743
+ }).map(function (section, index, visibleSections) {
744
+ return jsxs(React.Fragment, {
745
+ children: [renderSection(section), index < visibleSections.length - 1 && jsx("div", {
746
+ className: styles.separator,
747
+ children: jsx("span", {
748
+ children: "OR"
749
+ })
750
+ })]
751
+ }, section);
752
+ }), otpId && jsx(OtpVerification, {
753
+ type: step,
754
+ contact: step === OtpType.Email ? email : phone,
755
+ suborgId: suborgId,
756
+ otpId: otpId,
757
+ sessionLengthSeconds: authConfig.sessionLengthSeconds,
758
+ authIframeClient: authIframeClient,
759
+ onValidateSuccess: handleAuthSuccess,
760
+ onResendCode: handleResendCode
761
+ }), !otpId && jsx("div", {
762
+ className: styles.tos,
763
+ children: jsxs("span", {
764
+ children: ["By continuing, you agree to our", " ", jsx("a", {
765
+ href: "https://www.turnkey.com/legal/terms",
766
+ target: "_blank",
767
+ rel: "noopener noreferrer",
768
+ className: styles.tosBold,
769
+ children: "Terms of Service"
770
+ }), " ", "&", " ", jsx("a", {
771
+ href: "https://www.turnkey.com/legal/privacy",
772
+ target: "_blank",
773
+ rel: "noopener noreferrer",
774
+ className: styles.tosBold,
775
+ children: "Privacy Policy"
776
+ }), "."]
777
+ })
778
+ })]
779
+ }), jsxs("div", {
780
+ onClick: function onClick() {
781
+ return window.location.href = "https://www.turnkey.com/";
782
+ },
783
+ className: styles.poweredBy,
784
+ children: [jsx("span", {
785
+ children: "Secured by"
786
+ }), jsx("img", {
787
+ src: turnkeyIcon
788
+ })]
789
+ })]
790
+ })
791
+ })
792
+ });
283
793
  };
284
794
 
285
795
  export { Auth as default };