@turnkey/sdk-react 3.0.0 → 3.0.1

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 (72) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/dist/_virtual/_rollupPluginBabelHelpers.mjs +470 -0
  3. package/dist/_virtual/_rollupPluginBabelHelpers.mjs.map +1 -0
  4. package/dist/components/auth/Apple.js +78 -64
  5. package/dist/components/auth/Apple.js.map +1 -1
  6. package/dist/components/auth/Apple.mjs +85 -64
  7. package/dist/components/auth/Apple.mjs.map +1 -1
  8. package/dist/components/auth/Auth.d.ts +3 -0
  9. package/dist/components/auth/Auth.d.ts.map +1 -1
  10. package/dist/components/auth/Auth.js +507 -259
  11. package/dist/components/auth/Auth.js.map +1 -1
  12. package/dist/components/auth/Auth.mjs +725 -229
  13. package/dist/components/auth/Auth.mjs.map +1 -1
  14. package/dist/components/auth/Facebook.js +78 -63
  15. package/dist/components/auth/Facebook.js.map +1 -1
  16. package/dist/components/auth/Facebook.mjs +121 -54
  17. package/dist/components/auth/Facebook.mjs.map +1 -1
  18. package/dist/components/auth/Google.js +63 -47
  19. package/dist/components/auth/Google.js.map +1 -1
  20. package/dist/components/auth/Google.mjs +70 -39
  21. package/dist/components/auth/Google.mjs.map +1 -1
  22. package/dist/components/auth/OtpVerification.js +106 -51
  23. package/dist/components/auth/OtpVerification.js.map +1 -1
  24. package/dist/components/auth/OtpVerification.mjs +151 -41
  25. package/dist/components/auth/OtpVerification.mjs.map +1 -1
  26. package/dist/components/auth/PhoneInput.d.ts.map +1 -1
  27. package/dist/components/auth/PhoneInput.js +138 -69
  28. package/dist/components/auth/PhoneInput.js.map +1 -1
  29. package/dist/components/auth/PhoneInput.mjs +141 -70
  30. package/dist/components/auth/PhoneInput.mjs.map +1 -1
  31. package/dist/components/auth/TurnkeyThemeProvider.js +26 -17
  32. package/dist/components/auth/TurnkeyThemeProvider.js.map +1 -1
  33. package/dist/components/auth/TurnkeyThemeProvider.mjs +33 -18
  34. package/dist/components/auth/TurnkeyThemeProvider.mjs.map +1 -1
  35. package/dist/components/auth/constants.js +26 -26
  36. package/dist/components/auth/constants.js.map +1 -1
  37. package/dist/components/auth/constants.mjs +34 -34
  38. package/dist/components/auth/constants.mjs.map +1 -1
  39. package/dist/components/auth/facebookUtils.js +23 -21
  40. package/dist/components/auth/facebookUtils.js.map +1 -1
  41. package/dist/components/auth/facebookUtils.mjs +65 -23
  42. package/dist/components/auth/facebookUtils.mjs.map +1 -1
  43. package/dist/components/auth/otp.js +84 -71
  44. package/dist/components/auth/otp.js.map +1 -1
  45. package/dist/components/auth/otp.mjs +96 -70
  46. package/dist/components/auth/otp.mjs.map +1 -1
  47. package/dist/components/auth/utils.js +3 -3
  48. package/dist/components/auth/utils.js.map +1 -1
  49. package/dist/components/auth/utils.mjs +3 -3
  50. package/dist/components/auth/utils.mjs.map +1 -1
  51. package/dist/components/export/Export.js +181 -99
  52. package/dist/components/export/Export.js.map +1 -1
  53. package/dist/components/export/Export.mjs +257 -89
  54. package/dist/components/export/Export.mjs.map +1 -1
  55. package/dist/components/import/Import.js +185 -132
  56. package/dist/components/import/Import.js.map +1 -1
  57. package/dist/components/import/Import.mjs +264 -120
  58. package/dist/components/import/Import.mjs.map +1 -1
  59. package/dist/contexts/TurnkeyContext.d.ts.map +1 -1
  60. package/dist/contexts/TurnkeyContext.js +113 -93
  61. package/dist/contexts/TurnkeyContext.js.map +1 -1
  62. package/dist/contexts/TurnkeyContext.mjs +191 -92
  63. package/dist/contexts/TurnkeyContext.mjs.map +1 -1
  64. package/dist/hooks/use-session.js +16 -13
  65. package/dist/hooks/use-session.js.map +1 -1
  66. package/dist/hooks/use-session.mjs +18 -13
  67. package/dist/hooks/use-session.mjs.map +1 -1
  68. package/dist/hooks/use-turnkey.js +5 -5
  69. package/dist/hooks/use-turnkey.js.map +1 -1
  70. package/dist/hooks/use-turnkey.mjs +6 -6
  71. package/dist/hooks/use-turnkey.mjs.map +1 -1
  72. 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,764 @@ 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 = 9;
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
+ onError(authErrors.suborg.fetchFailed);
64
188
  }
65
- suborgId = getVerifiedSuborgsResponse?.organizationIds[0];
66
- }
67
- else {
68
- const getSuborgsResponse = await server.getSuborgs({
69
- filterType,
70
- filterValue,
189
+ suborgId = getVerifiedSuborgsResponse === null || getVerifiedSuborgsResponse === void 0 ? void 0 : getVerifiedSuborgsResponse.organizationIds[0];
190
+ _context2.next = 14;
191
+ break;
192
+ case 9:
193
+ _context2.next = 11;
194
+ return server.getSuborgs({
195
+ filterType: filterType,
196
+ filterValue: filterValue
71
197
  });
198
+ case 11:
199
+ getSuborgsResponse = _context2.sent;
72
200
  if (!getSuborgsResponse || !getSuborgsResponse.organizationIds) {
73
- onError(authErrors.suborg.fetchFailed);
201
+ onError(authErrors.suborg.fetchFailed);
74
202
  }
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;
203
+ suborgId = getSuborgsResponse === null || getSuborgsResponse === void 0 ? void 0 : getSuborgsResponse.organizationIds[0];
204
+ case 14:
205
+ if (suborgId) {
206
+ _context2.next = 23;
207
+ break;
208
+ }
209
+ createSuborgData = _objectSpread2({}, additionalData);
210
+ if (filterType === FilterType.Email) createSuborgData.email = filterValue;else if (filterType === FilterType.PhoneNumber) createSuborgData.phoneNumber = filterValue;
83
211
  if (customAccounts) {
84
- createSuborgData.customAccounts = customAccounts;
212
+ createSuborgData.customAccounts = customAccounts;
85
213
  }
86
- const createSuborgResponse = await server.createSuborg(createSuborgData);
214
+ _context2.next = 20;
215
+ return server.createSuborg(createSuborgData);
216
+ case 20:
217
+ createSuborgResponse = _context2.sent;
87
218
  if (!createSuborgResponse || !createSuborgResponse.subOrganizationId) {
88
- onError(authErrors.suborg.createFailed);
219
+ onError(authErrors.suborg.createFailed);
89
220
  }
90
- suborgId = createSuborgResponse?.subOrganizationId;
221
+ suborgId = createSuborgResponse === null || createSuborgResponse === void 0 ? void 0 : createSuborgResponse.subOrganizationId;
222
+ case 23:
223
+ return _context2.abrupt("return", suborgId);
224
+ case 24:
225
+ case "end":
226
+ return _context2.stop();
91
227
  }
92
- return suborgId;
228
+ }, _callee2);
229
+ }));
230
+ return function handleGetOrCreateSuborg(_x, _x2) {
231
+ return _ref3.apply(this, arguments);
93
232
  };
94
- const handleAuthSuccess = async (credentialBundle) => {
95
- if (credentialBundle) {
96
- await authIframeClient.injectCredentialBundle(credentialBundle);
97
- await authIframeClient.loginWithAuthBundle(credentialBundle);
98
- await onAuthSuccess();
233
+ }();
234
+ var handleAuthSuccess = /*#__PURE__*/function () {
235
+ var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(credentialBundle) {
236
+ return _regeneratorRuntime().wrap(function _callee3$(_context3) {
237
+ while (1) switch (_context3.prev = _context3.next) {
238
+ case 0:
239
+ if (!credentialBundle) {
240
+ _context3.next = 7;
241
+ break;
242
+ }
243
+ _context3.next = 3;
244
+ return authIframeClient.injectCredentialBundle(credentialBundle);
245
+ case 3:
246
+ _context3.next = 5;
247
+ return authIframeClient.loginWithAuthBundle(credentialBundle);
248
+ case 5:
249
+ _context3.next = 7;
250
+ return onAuthSuccess();
251
+ case 7:
252
+ case "end":
253
+ return _context3.stop();
99
254
  }
255
+ }, _callee3);
256
+ }));
257
+ return function handleAuthSuccess(_x3) {
258
+ return _ref4.apply(this, arguments);
100
259
  };
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
- }
260
+ }();
261
+ var handleSignupWithPasskey = /*#__PURE__*/function () {
262
+ var _ref5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4() {
263
+ var siteInfo, _turnkey$config$defau, _ref6, encodedChallenge, attestation, response, sessionResponse;
264
+ return _regeneratorRuntime().wrap(function _callee4$(_context4) {
265
+ while (1) switch (_context4.prev = _context4.next) {
266
+ case 0:
267
+ setPasskeySignupError("");
268
+ siteInfo = "".concat(new URL(window.location.href).hostname, " - ").concat(new Date().toLocaleString(undefined, {
269
+ year: "numeric",
270
+ month: "long",
271
+ day: "numeric",
272
+ hour: "2-digit",
273
+ minute: "2-digit",
274
+ second: "2-digit"
275
+ }));
276
+ setPasskeySignupScreen(false);
277
+ setPasskeyCreationScreen(true);
278
+ _context4.prev = 4;
279
+ if (passkeyCreated) {
280
+ _context4.next = 22;
281
+ break;
138
282
  }
139
- const sessionResponse = await passkeyClient?.createReadWriteSession({
140
- targetPublicKey: authIframeClient?.iframePublicKey,
141
- organizationId: process.env.NEXT_PUBLIC_ORGANIZATION_ID,
283
+ _context4.next = 8;
284
+ return passkeyClient === null || passkeyClient === void 0 ? void 0 : passkeyClient.createUserPasskey({
285
+ publicKey: {
286
+ user: {
287
+ name: siteInfo,
288
+ displayName: siteInfo
289
+ }
290
+ }
142
291
  });
143
- if (sessionResponse?.credentialBundle) {
144
- await handleAuthSuccess(sessionResponse.credentialBundle);
292
+ case 8:
293
+ _context4.t0 = _context4.sent;
294
+ if (_context4.t0) {
295
+ _context4.next = 11;
296
+ break;
145
297
  }
146
- else {
147
- setPasskeySignupError(authErrors.passkey.loginFailed);
298
+ _context4.t0 = {};
299
+ case 11:
300
+ _ref6 = _context4.t0;
301
+ encodedChallenge = _ref6.encodedChallenge;
302
+ attestation = _ref6.attestation;
303
+ if (!(encodedChallenge && attestation)) {
304
+ _context4.next = 21;
305
+ break;
148
306
  }
149
- }
150
- catch {
307
+ _context4.next = 17;
308
+ return server.createSuborg(_objectSpread2({
309
+ email: email,
310
+ passkey: {
311
+ authenticatorName: "First Passkey",
312
+ challenge: encodedChallenge,
313
+ attestation: attestation
314
+ }
315
+ }, customAccounts && {
316
+ customAccounts: customAccounts
317
+ }));
318
+ case 17:
319
+ response = _context4.sent;
320
+ if (response !== null && response !== void 0 && response.subOrganizationId) {
321
+ setPasskeyCreated(true);
322
+ }
323
+ _context4.next = 22;
324
+ break;
325
+ case 21:
326
+ case 22:
327
+ _context4.next = 24;
328
+ return passkeyClient === null || passkeyClient === void 0 ? void 0 : passkeyClient.createReadWriteSession({
329
+ targetPublicKey: authIframeClient === null || authIframeClient === void 0 ? void 0 : authIframeClient.iframePublicKey,
330
+ 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
331
+ });
332
+ case 24:
333
+ sessionResponse = _context4.sent;
334
+ if (!(sessionResponse !== null && sessionResponse !== void 0 && sessionResponse.credentialBundle)) {
335
+ _context4.next = 30;
336
+ break;
337
+ }
338
+ _context4.next = 28;
339
+ return handleAuthSuccess(sessionResponse.credentialBundle);
340
+ case 28:
341
+ _context4.next = 31;
342
+ break;
343
+ case 30:
344
+ setPasskeySignupError(authErrors.passkey.loginFailed);
345
+ case 31:
346
+ _context4.next = 36;
347
+ break;
348
+ case 33:
349
+ _context4.prev = 33;
350
+ _context4.t1 = _context4["catch"](4);
151
351
  setPasskeySignupError(authErrors.passkey.timeoutOrNotAllowed);
352
+ case 36:
353
+ case "end":
354
+ return _context4.stop();
152
355
  }
356
+ }, _callee4, null, [[4, 33]]);
357
+ }));
358
+ return function handleSignupWithPasskey() {
359
+ return _ref5.apply(this, arguments);
153
360
  };
154
- const handleLoginWithPasskey = async () => {
155
- try {
156
- const sessionResponse = await passkeyClient?.createReadWriteSession({
157
- targetPublicKey: authIframeClient?.iframePublicKey,
158
- organizationId: process.env.NEXT_PUBLIC_ORGANIZATION_ID,
361
+ }();
362
+ var handleLoginWithPasskey = /*#__PURE__*/function () {
363
+ var _ref7 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee5() {
364
+ var _turnkey$config$defau2, sessionResponse;
365
+ return _regeneratorRuntime().wrap(function _callee5$(_context5) {
366
+ while (1) switch (_context5.prev = _context5.next) {
367
+ case 0:
368
+ _context5.prev = 0;
369
+ _context5.next = 3;
370
+ return passkeyClient === null || passkeyClient === void 0 ? void 0 : passkeyClient.createReadWriteSession({
371
+ targetPublicKey: authIframeClient === null || authIframeClient === void 0 ? void 0 : authIframeClient.iframePublicKey,
372
+ 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
159
373
  });
160
- if (sessionResponse?.credentialBundle) {
161
- await handleAuthSuccess(sessionResponse.credentialBundle);
374
+ case 3:
375
+ sessionResponse = _context5.sent;
376
+ if (!(sessionResponse !== null && sessionResponse !== void 0 && sessionResponse.credentialBundle)) {
377
+ _context5.next = 9;
378
+ break;
162
379
  }
163
- else {
164
- authErrors.passkey.loginFailed;
165
- }
166
- }
167
- catch (error) {
380
+ _context5.next = 7;
381
+ return handleAuthSuccess(sessionResponse.credentialBundle);
382
+ case 7:
383
+ _context5.next = 10;
384
+ break;
385
+ case 9:
386
+ case 10:
387
+ _context5.next = 15;
388
+ break;
389
+ case 12:
390
+ _context5.prev = 12;
391
+ _context5.t0 = _context5["catch"](0);
168
392
  onError(authErrors.passkey.loginFailed);
393
+ case 15:
394
+ case "end":
395
+ return _context5.stop();
169
396
  }
397
+ }, _callee5, null, [[0, 12]]);
398
+ }));
399
+ return function handleLoginWithPasskey() {
400
+ return _ref7.apply(this, arguments);
170
401
  };
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);
402
+ }();
403
+ var handleOtpLogin = /*#__PURE__*/function () {
404
+ var _ref8 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee6(type, value, otpType) {
405
+ var suborgId, initAuthResponse;
406
+ return _regeneratorRuntime().wrap(function _callee6$(_context6) {
407
+ while (1) switch (_context6.prev = _context6.next) {
408
+ case 0:
409
+ _context6.next = 2;
410
+ return handleGetOrCreateSuborg(type, value);
411
+ case 2:
412
+ suborgId = _context6.sent;
413
+ _context6.next = 5;
414
+ return server.sendOtp(_objectSpread2(_objectSpread2({
415
+ suborgID: suborgId,
416
+ otpType: otpType,
417
+ contact: value
418
+ }, customSmsMessage && {
419
+ customSmsMessage: customSmsMessage
420
+ }), {}, {
421
+ userIdentifier: authIframeClient === null || authIframeClient === void 0 ? void 0 : authIframeClient.iframePublicKey
422
+ }));
423
+ case 5:
424
+ initAuthResponse = _context6.sent;
425
+ if (initAuthResponse && initAuthResponse.otpId) {
426
+ setSuborgId(suborgId);
427
+ setOtpId(initAuthResponse === null || initAuthResponse === void 0 ? void 0 : initAuthResponse.otpId);
428
+ setStep(otpType);
429
+ } else {
430
+ onError(authErrors.otp.sendFailed);
431
+ }
432
+ case 7:
433
+ case "end":
434
+ return _context6.stop();
187
435
  }
436
+ }, _callee6);
437
+ }));
438
+ return function handleOtpLogin(_x4, _x5, _x6) {
439
+ return _ref8.apply(this, arguments);
188
440
  };
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 {
441
+ }();
442
+ var handleOAuthLogin = /*#__PURE__*/function () {
443
+ var _ref9 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee7(credential, providerName) {
444
+ var suborgId, oauthResponse;
445
+ return _regeneratorRuntime().wrap(function _callee7$(_context7) {
446
+ while (1) switch (_context7.prev = _context7.next) {
447
+ case 0:
448
+ setOauthLoading(providerName);
449
+ _context7.next = 3;
450
+ return handleGetOrCreateSuborg(FilterType.OidcToken, credential, {
451
+ oauthProviders: [{
452
+ providerName: providerName,
453
+ oidcToken: credential
454
+ }]
455
+ });
456
+ case 3:
457
+ suborgId = _context7.sent;
458
+ _context7.next = 6;
459
+ return server.oauth({
460
+ suborgID: suborgId,
461
+ oidcToken: credential,
462
+ targetPublicKey: authIframeClient === null || authIframeClient === void 0 ? void 0 : authIframeClient.iframePublicKey,
463
+ sessionLengthSeconds: authConfig.sessionLengthSeconds
464
+ });
465
+ case 6:
466
+ oauthResponse = _context7.sent;
467
+ if (!(oauthResponse && oauthResponse.token)) {
468
+ _context7.next = 12;
469
+ break;
470
+ }
471
+ _context7.next = 10;
472
+ return handleAuthSuccess(oauthResponse.token);
473
+ case 10:
474
+ _context7.next = 13;
475
+ break;
476
+ case 12:
204
477
  onError(authErrors.oauth.loginFailed);
478
+ case 13:
479
+ case "end":
480
+ return _context7.stop();
205
481
  }
482
+ }, _callee7);
483
+ }));
484
+ return function handleOAuthLogin(_x7, _x8) {
485
+ return _ref9.apply(this, arguments);
206
486
  };
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;
487
+ }();
488
+ var renderBackButton = function renderBackButton() {
489
+ return jsx(ChevronLeftIcon, {
490
+ onClick: function onClick() {
491
+ setPasskeyCreationScreen(false);
492
+ setPasskeySignupError("");
493
+ setPasskeySignupScreen(false);
494
+ setOtpId(null);
495
+ },
496
+ sx: {
497
+ color: "var(--text-secondary)",
498
+ position: "absolute",
499
+ fontSize: "24px",
500
+ top: 16,
501
+ left: 16,
502
+ zIndex: 10,
503
+ cursor: "pointer",
504
+ borderRadius: "50%",
505
+ padding: "6px",
506
+ transition: "background-color 0.3s ease"
507
+ }
508
+ });
509
+ };
510
+ var renderSocialButtons = function renderSocialButtons() {
511
+ var _authConfig$googleCli, _authConfig$appleClie, _authConfig$facebookC;
512
+ var googleEnabled = authConfig.googleEnabled,
513
+ appleEnabled = authConfig.appleEnabled,
514
+ facebookEnabled = authConfig.facebookEnabled;
515
+ var layout = [googleEnabled, appleEnabled, facebookEnabled].filter(Boolean).length >= 2 ? "inline" : "stacked";
516
+ return jsxs("div", {
517
+ className: layout === "inline" ? styles.socialButtonContainerInline : styles.socialButtonContainerStacked,
518
+ children: [googleEnabled && jsx(GoogleAuthButton, {
519
+ layout: layout,
520
+ clientId: (_authConfig$googleCli = authConfig.googleClientId) !== null && _authConfig$googleCli !== void 0 ? _authConfig$googleCli : process.env.NEXT_PUBLIC_GOOGLE_CLIENT_ID,
521
+ iframePublicKey: authIframeClient.iframePublicKey,
522
+ onSuccess: function onSuccess(response) {
523
+ return handleOAuthLogin(response.idToken, "Google");
273
524
  }
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 })] })] })) })) }));
525
+ }), appleEnabled && jsx(AppleAuthButton, {
526
+ layout: layout,
527
+ clientId: (_authConfig$appleClie = authConfig.appleClientId) !== null && _authConfig$appleClie !== void 0 ? _authConfig$appleClie : process.env.NEXT_PUBLIC_APPLE_CLIENT_ID,
528
+ iframePublicKey: authIframeClient.iframePublicKey,
529
+ onSuccess: function onSuccess(response) {
530
+ return handleOAuthLogin(response.idToken, "Apple");
531
+ }
532
+ }), facebookEnabled && jsx(FacebookAuthButton, {
533
+ layout: layout,
534
+ clientId: (_authConfig$facebookC = authConfig.facebookClientId) !== null && _authConfig$facebookC !== void 0 ? _authConfig$facebookC : process.env.NEXT_PUBLIC_FACEBOOK_CLIENT_ID,
535
+ iframePublicKey: authIframeClient.iframePublicKey,
536
+ onSuccess: function onSuccess(response) {
537
+ return handleOAuthLogin(response.id_token, "Facebook");
538
+ }
539
+ })]
540
+ });
541
+ };
542
+ var renderSection = function renderSection(section) {
543
+ switch (section) {
544
+ case "email":
545
+ return authConfig.emailEnabled && !otpId ? jsxs("form", {
546
+ onSubmit: function onSubmit(e) {
547
+ e.preventDefault();
548
+ handleOtpLogin(FilterType.Email, email, OtpType.Email);
549
+ },
550
+ children: [jsx("div", {
551
+ className: styles.inputGroup,
552
+ children: jsx(TextField, {
553
+ name: "email-input",
554
+ type: "email",
555
+ placeholder: "Enter your email",
556
+ value: email,
557
+ onChange: function onChange(e) {
558
+ return setEmail(e.target.value);
559
+ },
560
+ fullWidth: true,
561
+ sx: {
562
+ "& .MuiOutlinedInput-root": {
563
+ color: "var(--input-text)",
564
+ "& fieldset": {
565
+ borderColor: "var(--input-border)"
566
+ },
567
+ "&:hover fieldset": {
568
+ borderColor: "var(--input-hover-border)"
569
+ },
570
+ "&.Mui-focused fieldset": {
571
+ borderColor: "var(--input-focus-border)",
572
+ border: "1px solid"
573
+ }
574
+ },
575
+ "& .MuiInputBase-input": {
576
+ padding: "12px"
577
+ },
578
+ backgroundColor: "var(--input-bg)"
579
+ },
580
+ variant: "outlined"
581
+ })
582
+ }), jsx("button", {
583
+ className: styles.authButton,
584
+ type: "submit",
585
+ disabled: !isValidEmail(email),
586
+ children: "Continue"
587
+ })]
588
+ }) : null;
589
+ case "phone":
590
+ return authConfig.phoneEnabled && !otpId ? jsxs("form", {
591
+ onSubmit: function onSubmit(e) {
592
+ e.preventDefault();
593
+ handleOtpLogin(FilterType.PhoneNumber, phone, OtpType.Sms);
594
+ },
595
+ children: [jsx("div", {
596
+ className: styles.phoneInput,
597
+ children: jsx(MuiPhone, {
598
+ onChange: function onChange(value) {
599
+ return setPhone(value);
600
+ },
601
+ value: phone
602
+ })
603
+ }), jsx("button", {
604
+ className: styles.authButton,
605
+ type: "submit",
606
+ disabled: !isValidPhone(phone),
607
+ children: "Continue"
608
+ })]
609
+ }) : null;
610
+ case "passkey":
611
+ return authConfig.passkeyEnabled && !otpId ? jsxs("div", {
612
+ className: styles.passkeyContainer,
613
+ children: [jsx("button", {
614
+ className: styles.authButton,
615
+ type: "button",
616
+ onClick: handleLoginWithPasskey,
617
+ children: "Log in with passkey"
618
+ }), jsx("div", {
619
+ className: styles.noPasskeyLink,
620
+ onClick: function onClick() {
621
+ return setPasskeySignupScreen(true);
622
+ },
623
+ children: "Sign up with passkey"
624
+ })]
625
+ }) : null;
626
+ case "socials":
627
+ return authConfig.googleEnabled || authConfig.appleEnabled || authConfig.facebookEnabled ? renderSocialButtons() : null;
628
+ default:
629
+ return null;
630
+ }
631
+ };
632
+ return jsx(Fragment, {
633
+ children: passkeySignupScreen ? jsxs("div", {
634
+ className: styles.authCard,
635
+ children: [renderBackButton(), jsx("div", {
636
+ className: styles.passkeyIconContainer,
637
+ children: passkeyIcon
638
+ }), jsx("center", {
639
+ children: jsx("h3", {
640
+ className: styles.primaryText,
641
+ children: "Create a passkey"
642
+ })
643
+ }), jsx("div", {
644
+ className: styles.rowsContainer,
645
+ children: jsx("center", {
646
+ children: jsx("span", {
647
+ className: styles.primaryText,
648
+ children: "Passkeys allow for easy biometric access to your wallet and can be synced across devices."
649
+ })
650
+ })
651
+ }), jsx("button", {
652
+ className: styles.authButton,
653
+ type: "button",
654
+ onClick: handleSignupWithPasskey,
655
+ children: "Continue"
656
+ })]
657
+ }) : passkeyCreationScreen ? jsxs("div", {
658
+ className: styles.authCard,
659
+ children: [renderBackButton(), jsx("div", {
660
+ className: styles.passkeyIconContainer,
661
+ children: passkeySignupError ? jsx("div", {
662
+ children: passkeyIconError
663
+ }) : jsxs("div", {
664
+ className: styles.loadingWrapper,
665
+ children: [jsx(CircularProgress, {
666
+ size: 80,
667
+ thickness: 1,
668
+ className: styles.circularProgress
669
+ }), passkeyIcon]
670
+ })
671
+ }), jsx("center", {
672
+ children: jsx("h3", {
673
+ className: styles.primaryText,
674
+ children: passkeySignupError ? "Authentication error" : passkeyCreated ? "Logging in with passkey..." : "Creating passkey..."
675
+ })
676
+ }), jsx("div", {
677
+ className: styles.rowsContainer,
678
+ children: jsx("span", {
679
+ className: styles.primaryText,
680
+ children: jsx("center", {
681
+ children: passkeySignupError ? passkeySignupError : ""
682
+ })
683
+ })
684
+ }), passkeySignupError && jsx("button", {
685
+ className: styles.authButton,
686
+ type: "button",
687
+ onClick: handleSignupWithPasskey,
688
+ children: "Retry"
689
+ })]
690
+ }) : jsx("div", {
691
+ children: oauthLoading !== "" ? jsxs("div", {
692
+ className: styles.authCardLoading,
693
+ children: [jsxs("h3", {
694
+ className: styles.verifyingText,
695
+ children: ["Verifying with ", oauthLoading]
696
+ }), jsxs("div", {
697
+ className: styles.loadingWrapper,
698
+ children: [jsx(CircularProgress, {
699
+ size: 80,
700
+ thickness: 1,
701
+ className: styles.circularProgress
702
+ }), oauthLoading === "Google" && jsx("img", {
703
+ src: googleIcon,
704
+ className: styles.oauthIcon
705
+ }), oauthLoading === "Facebook" && jsx("img", {
706
+ src: facebookIcon,
707
+ className: styles.oauthIcon
708
+ }), oauthLoading === "Apple" && jsx("img", {
709
+ src: appleIcon,
710
+ className: styles.oauthIcon
711
+ })]
712
+ }), jsxs("div", {
713
+ className: styles.poweredBy,
714
+ children: [jsx("span", {
715
+ children: "Secured by"
716
+ }), jsx("img", {
717
+ src: turnkeyIcon
718
+ })]
719
+ })]
720
+ }) : jsxs("div", {
721
+ className: styles.authCard,
722
+ children: [otpId && renderBackButton(), jsx("h2", {
723
+ className: styles.primaryText,
724
+ children: !otpId && "Log in or sign up"
725
+ }), jsxs("div", {
726
+ className: styles.authForm,
727
+ children: [!otpId && configOrder.filter(function (section) {
728
+ return renderSection(section) !== null;
729
+ }).map(function (section, index, visibleSections) {
730
+ return jsxs(React.Fragment, {
731
+ children: [renderSection(section), index < visibleSections.length - 1 && jsx("div", {
732
+ className: styles.separator,
733
+ children: jsx("span", {
734
+ children: "OR"
735
+ })
736
+ })]
737
+ }, section);
738
+ }), otpId && jsx(OtpVerification, {
739
+ type: step,
740
+ contact: step === OtpType.Email ? email : phone,
741
+ suborgId: suborgId,
742
+ otpId: otpId,
743
+ sessionLengthSeconds: authConfig.sessionLengthSeconds,
744
+ authIframeClient: authIframeClient,
745
+ onValidateSuccess: handleAuthSuccess,
746
+ onResendCode: handleResendCode
747
+ }), !otpId && jsx("div", {
748
+ className: styles.tos,
749
+ children: jsxs("span", {
750
+ children: ["By continuing, you agree to our", " ", jsx("a", {
751
+ href: "https://www.turnkey.com/legal/terms",
752
+ target: "_blank",
753
+ rel: "noopener noreferrer",
754
+ className: styles.tosBold,
755
+ children: "Terms of Service"
756
+ }), " ", "&", " ", jsx("a", {
757
+ href: "https://www.turnkey.com/legal/privacy",
758
+ target: "_blank",
759
+ rel: "noopener noreferrer",
760
+ className: styles.tosBold,
761
+ children: "Privacy Policy"
762
+ }), "."]
763
+ })
764
+ })]
765
+ }), jsxs("div", {
766
+ onClick: function onClick() {
767
+ return window.location.href = "https://www.turnkey.com/";
768
+ },
769
+ className: styles.poweredBy,
770
+ children: [jsx("span", {
771
+ children: "Secured by"
772
+ }), jsx("img", {
773
+ src: turnkeyIcon
774
+ })]
775
+ })]
776
+ })
777
+ })
778
+ });
283
779
  };
284
780
 
285
781
  export { Auth as default };