@getpara/react-sdk 1.12.0 → 2.0.0-alpha.5

package/dist/cli/cli.mjs

@@ -0,0 +1,35 @@
+#!/usr/bin/env node
+import * as fs from 'node:fs/promises';
+import * as path from 'node:path';
+import { createRequire } from 'module';
+const require = createRequire(import.meta.url);
+
+const PACKAGES_TO_STUB = [
+  '@getpara/evm-wallet-connectors',
+  '@getpara/cosmos-wallet-connectors',
+  '@getpara/solana-wallet-connectors',
+];
+
+const checkForPackages = async () => {
+  const pathToParaPackages = require.resolve('@getpara/react-sdk');
+
+  const pathToNodeModules = path.resolve(pathToParaPackages, '../../node_modules');
+
+  for (let i = 0; i < PACKAGES_TO_STUB.length; i++) {
+    const packageName = PACKAGES_TO_STUB[i];
+    try {
+      await import(packageName);
+    } catch (err) {
+      if (err.code === 'ERR_MODULE_NOT_FOUND') {
+        const packageJsonContent = { name: packageName, main: './index.js' };
+        await fs.mkdir(path.join(pathToNodeModules, packageName), { recursive: true });
+        await fs.writeFile(path.join(pathToNodeModules, packageName, 'index.js'), '//STUB');
+        await fs.writeFile(path.join(pathToNodeModules, packageName, 'package.json'), JSON.stringify(packageJsonContent), {
+          encoding: 'utf-8',
+        });
+      }
+    }
+  }
+};
+
+await checkForPackages();

package/dist/index.d.ts

@@ -1,6 +1,7 @@
 export * from './modal/index.js';
 export * from './provider/index.js';
 export * from '@getpara/web-sdk';
+export { ExternalWallet, EvmWallet, SolanaWallet, CosmosWallet } from '@getpara/react-common';
 export type { Theme } from '@getpara/react-components';
 import ParaWeb from '@getpara/web-sdk';
 export default ParaWeb;

package/dist/index.js

@@ -3,8 +3,13 @@ import "./chunk-MMUBH76A.js";
 export * from "./modal/index.js";
 export * from "./provider/index.js";
 export * from "@getpara/web-sdk";
+import { ExternalWallet, EvmWallet, SolanaWallet, CosmosWallet } from "@getpara/react-common";
 import ParaWeb from "@getpara/web-sdk";
 var src_default = ParaWeb;
 export {
+  CosmosWallet,
+  EvmWallet,
+  ExternalWallet,
+  SolanaWallet,
   src_default as default
 };

package/dist/modal/ParaModal.js

@@ -8,345 +8,243 @@ import { jsx } from "react/jsx-runtime";
 import { CpslAuthModal, defineCustomElements, generateTheme } from "@getpara/react-components";
 import { ModalContent } from "./components/index.js";
 import { forwardRef, useEffect, useImperativeHandle, useRef, useState } from "react";
-import { useModalStore, useUserInfoStore, useThemeStore } from "./stores/index.js";
+import { useModalStore } from "./stores/index.js";
 import { ModalStep, RESET_TO_ACCOUNT_STEPS, RESET_TO_AUTH_STEPS } from "./utils/steps.js";
 import { AuthLayout } from "./types/modalProps.js";
 import { DEFAULTS } from "./constants/defaults.js";
 import { useGoBack } from "./hooks/useGoBack.js";
-import { isPasskeySupported, ParaEvent } from "@getpara/web-sdk";
-import { ExternalWalletsWrapper } from "./components/ExternalWalletsWrapper/ExternalWalletsWrapper.js";
 import styled from "styled-components";
 import { hasEmbeddedAuth, hasExternalWallet } from "./utils/authLayoutHelpers.js";
 import { useModal, useWalletState } from "../provider/index.js";
-import { useStore } from "../provider/stores/useStore.js";
-import { getExternalWalletDisplayName } from "@getpara/react-common";
 import { useInternalClient } from "../provider/hooks/utils/useInternalClient.js";
-import { useExternalWalletProviderStore } from "./stores/externalWalletProvider/useExternalWalletProviderStore.js";
+import { useExternalWallets } from "../provider/providers/ExternalWalletProvider.js";
+import { useStore } from "../provider/stores/useStore.js";
+import parsePhoneNumberFromString from "libphonenumber-js";
+import { useAuthActions } from "../provider/providers/AuthProvider.js";
+import { validateAuth } from "./utils/authInputHelpers.js";
 defineCustomElements();
-const ParaModal = forwardRef(
-  (_a, ref) => {
-    var _b = _a, { para, isOpen, externalWalletsWithParaAuth, rpcUrl: rpcUrlFromProps } = _b, rest = __objRest(_b, ["para", "isOpen", "externalWalletsWithParaAuth", "rpcUrl"]);
-    const [isInitialized, setIsInitialized] = useState(false);
-    const setClient = useStore((state) => state.setClient);
-    const client = useStore((state) => state.client);
-    const rpcUrl = useStore((state) => state.rpcUrl);
-    const setRpcUrl = useStore((state) => state.setRpcUrl);
-    const { closeModal, openModal } = useModal();
-    const updateExternalWalletProviderState = useExternalWalletProviderStore((state) => state.updateState);
-    useEffect(() => {
-      updateExternalWalletProviderState({ fullAuthWallets: externalWalletsWithParaAuth });
-    }, [externalWalletsWithParaAuth]);
-    useEffect(() => {
-      if (!client) {
-        setClient(para);
-      }
-      setIsInitialized(true);
-    }, []);
-    useEffect(() => {
-      if (rpcUrl !== rpcUrlFromProps) {
-        setRpcUrl(rpcUrlFromProps);
+const ParaModal = forwardRef((props, ref) => {
+  const storedModalConfig = useStore((state) => state.modalConfig);
+  const modalContentRef = useRef(null);
+  const currentStep = useModalStore((state) => state.step);
+  const setAuthState = useModalStore((state) => state.setAuthState);
+  const setOnModalStepChange = useModalStore((state) => state.setOnModalStepChange);
+  const setStep = useModalStore((state) => state.setStep);
+  const hasPreviousStep = useModalStore((state) => state.hasPreviousStep());
+  const setFlow = useModalStore((state) => state.setFlow);
+  const setIsFullyLoggedIn = useModalStore((state) => state.setIsFullyLoggedIn);
+  const goBack = useGoBack();
+  const setAuthLayout = useModalStore((state) => state.setAuthLayout);
+  const storedAuthLayout = useModalStore((state) => state.authLayout);
+  const resetModalState = useModalStore((state) => state.resetState);
+  const setRecoveryShare = useModalStore((state) => state.setRecoveryShare);
+  const { disconnectExternalWallet } = useExternalWallets();
+  const { isOpen: storedIsOpen, closeModal } = useModal();
+  const para = useInternalClient();
+  const { setSelectedWallet, updateSelectedWallet } = useWalletState();
+  const setAuthStepRoute = useModalStore((state) => state.setAuthStepRoute);
+  const { signUpOrLogIn, isCreateGuestWalletsPending } = useAuthActions();
+  const [isModalMounted, setIsModalMounted] = useState(false);
+  const [isInit, setIsInit] = useState(false);
+  const externalWallets = useStore((state) => state.externalWallets);
+  const _a = __spreadValues(__spreadValues({}, storedModalConfig), props), {
+    isOpen: configIsOpen,
+    theme,
+    disableEmailLogin = false,
+    disablePhoneLogin = false,
+    isGuestModeEnabled = false,
+    oAuthMethods = ["GOOGLE", "TWITTER"],
+    bareModal = false,
+    className,
+    currentStepOverride,
+    authLayout = [AuthLayout.AUTH_FULL, AuthLayout.EXTERNAL_FULL],
+    embeddedModal,
+    onModalStepChange,
+    onClose,
+    defaultAuthIdentifier
+  } = _a, rest = __objRest(_a, [
+    "isOpen",
+    "theme",
+    "disableEmailLogin",
+    "disablePhoneLogin",
+    "isGuestModeEnabled",
+    "oAuthMethods",
+    "bareModal",
+    "className",
+    "currentStepOverride",
+    "authLayout",
+    "embeddedModal",
+    "onModalStepChange",
+    "onClose",
+    "defaultAuthIdentifier"
+  ]);
+  const isOpen = configIsOpen != null ? configIsOpen : storedIsOpen;
+  useImperativeHandle(ref, () => {
+    return {
+      goBack() {
+        goBack();
+      },
+      canGoBack() {
+        return hasPreviousStep;
+      },
+      currentStep() {
+        return currentStep;
+      },
+      handleModalClose() {
+        var _a2;
+        (_a2 = modalContentRef == null ? void 0 : modalContentRef.current) == null ? void 0 : _a2.handleModalClose();
       }
-    }, [rpcUrlFromProps]);
-    useEffect(() => {
-      if (!isOpen) {
-        closeModal();
-      }
-      if (isOpen) {
-        openModal();
-      }
-    }, [isOpen]);
-    if (!isInitialized) {
-      return null;
-    }
-    return /* @__PURE__ */ jsx(ParaModalInner, __spreadValues({ ref, para, externalWalletsWithParaAuth }, rest));
-  }
-);
-const ParaModalInner = forwardRef(
-  (_c, ref) => {
-    var _d = _c, {
-      theme,
-      appName,
-      logo,
-      disableEmailLogin = false,
-      disablePhoneLogin = false,
-      oAuthMethods,
-      bareModal = false,
-      className,
-      currentStepOverride,
-      externalWallets,
-      authLayout = [AuthLayout.AUTH_FULL, AuthLayout.EXTERNAL_FULL],
-      embeddedModal,
-      onModalStepChange,
-      hideWallets = false,
-      onClose,
-      externalWalletsWithParaAuth
-    } = _d, rest = __objRest(_d, [
-      "theme",
-      "appName",
-      "logo",
-      "disableEmailLogin",
-      "disablePhoneLogin",
-      "oAuthMethods",
-      "bareModal",
-      "className",
-      "currentStepOverride",
-      "externalWallets",
-      "authLayout",
-      "embeddedModal",
-      "onModalStepChange",
-      "hideWallets",
-      "onClose",
-      "externalWalletsWithParaAuth"
-    ]);
-    const modalContentRef = useRef(null);
-    const updateThemeState = useThemeStore((state) => state.updateState);
-    const refs = useModalStore((state) => state.refs);
-    const setWebAuthURLForLogin = useModalStore((state) => state.setWebAuthURLForLogin);
-    const setWebAuthURLForCreate = useModalStore((state) => state.setWebAuthURLForCreate);
-    const setBiometricLocationHints = useModalStore((state) => state.setBiometricLocationHints);
-    const currentStep = useModalStore((state) => state.step);
-    const setOnModalStepChange = useModalStore((state) => state.setOnModalStepChange);
-    const setStep = useModalStore((state) => state.setStep);
-    const setAuthInfo = useUserInfoStore((state) => state.setAuthInfo);
-    const hasPreviousStep = useModalStore((state) => state.hasPreviousStep());
-    const setFlow = useModalStore((state) => state.setFlow);
-    const setIsFullyLoggedIn = useModalStore((state) => state.setIsFullyLoggedIn);
-    const goBack = useGoBack();
-    const setAuthLayout = useThemeStore((state) => state.setAuthLayout);
-    const storedAuthLayout = useThemeStore((state) => state.authLayout);
-    const resetModalState = useModalStore((state) => state.resetState);
-    const resetUserInfoState = useUserInfoStore((state) => state.resetState);
-    const setRecoveryShare = useUserInfoStore((state) => state.setRecoveryShare);
-    const { isOpen, closeModal } = useModal();
-    const para = useInternalClient();
-    const { selectedWallet, setSelectedWallet } = useWalletState();
-    const setIsPasskeySupported = useModalStore((state) => state.setIsPasskeySupported);
-    const setAuthStepRoute = useModalStore((state) => state.setAuthStepRoute);
-    const [isModalMounted, setIsModalMounted] = useState(false);
-    const [isInit, setIsInit] = useState(false);
-    const [ready, setIsReady] = useState(false);
-    useImperativeHandle(ref, () => {
-      return {
-        goBack() {
-          goBack();
-        },
-        canGoBack() {
-          return hasPreviousStep;
-        },
-        currentStep() {
-          return currentStep;
-        },
-        handleModalClose() {
-          var _a;
-          (_a = modalContentRef == null ? void 0 : modalContentRef.current) == null ? void 0 : _a.handleModalClose();
-        }
-      };
-    }, [hasPreviousStep, currentStep]);
-    const initModal = () => __async(void 0, null, function* () {
-      const isAccount = yield para.isFullyLoggedIn();
-      setIsPasskeySupported(yield isPasskeySupported());
-      if (currentStepOverride) {
+    };
+  }, [hasPreviousStep, currentStep]);
+  const initModal = (shouldAutoLogin) => __async(void 0, null, function* () {
+    var _a2;
+    const isAccount = yield para.isFullyLoggedIn(), isGuest = isAccount && para.isGuestMode || isCreateGuestWalletsPending;
+    switch (true) {
+      case !!currentStepOverride:
         setStep(ModalStep[currentStepOverride.toUpperCase()]);
-      } else if (isAccount) {
+        break;
+      case isGuest:
+        setFlow("guest");
+        setStep(isCreateGuestWalletsPending ? ModalStep.AWAITING_GUEST_WALLET_CREATION : ModalStep.ACCOUNT_MAIN);
+        setIsFullyLoggedIn(true);
+        break;
+      case isAccount:
         setFlow("account");
         setStep(ModalStep.ACCOUNT_MAIN);
         setIsFullyLoggedIn(true);
-      } else {
+        break;
+      default:
         if (currentStep !== ModalStep.AUTH_MAIN && currentStep !== ModalStep.SECRET) {
-          setStep(ModalStep.AUTH_MAIN);
-          setFlow();
-          setWebAuthURLForLogin();
-          setWebAuthURLForCreate();
-          setBiometricLocationHints();
+          setFlow(void 0);
+          setStep(para.isTelegram ? ModalStep.TELEGRAM_OAUTH : ModalStep.AUTH_MAIN);
+          setAuthState();
           setAuthStepRoute();
         }
+        yield disconnectExternalWallet();
         setSelectedWallet({ id: void 0, type: void 0 });
         setIsFullyLoggedIn(false);
-      }
-      switch (true) {
-        case para.isEmail:
-          setAuthInfo({ email: para.getEmail() });
-          break;
-        case para.isPhone:
-          {
-            const { phone, countryCode } = para.getPhone();
-            setAuthInfo({ phone, countryCode });
+        if (shouldAutoLogin) {
+          if (defaultAuthIdentifier && ((_a2 = para.authInfo) == null ? void 0 : _a2.identifier) !== defaultAuthIdentifier) {
+            const number = parsePhoneNumberFromString(defaultAuthIdentifier);
+            try {
+              const auth = validateAuth(
+                number ? number.nationalNumber : defaultAuthIdentifier,
+                (number == null ? void 0 : number.countryCallingCode) ? `+${number == null ? void 0 : number.countryCallingCode}` : void 0,
+                number ? "phone" : "email"
+              );
+              para.setAuth(number ? { phone: defaultAuthIdentifier } : { email: defaultAuthIdentifier });
+              signUpOrLogIn(auth);
+            } catch (err) {
+              console.error("invalid user identifier:", err.message);
+            }
           }
-          break;
-        case para.isFarcaster:
-          setAuthInfo({ farcasterUsername: para.getFarcasterUsername() });
-          break;
-        case para.isTelegram:
-          setAuthInfo({ telegramUserId: para.telegramUserId });
-          if (!isAccount) {
-            setStep(ModalStep.TELEGRAM_OAUTH);
-          }
-          break;
-        case para.isExternalWalletAuth:
-          const externalWallets2 = Object.values(para.externalWallets);
-          const externalWalletWithFullAuth = externalWallets2.find((w) => w.isExternalWithParaAuth);
-          setAuthInfo({
-            displayName: getExternalWalletDisplayName({
-              address: externalWalletWithFullAuth.address,
-              type: externalWalletWithFullAuth.type
-            }),
-            externalWalletAddress: externalWalletWithFullAuth.address
-          });
-          break;
-      }
-      setIsInit(true);
-    });
-    useEffect(() => {
-      let _authLayout = authLayout;
-      if (!(externalWallets == null ? void 0 : externalWallets.length) && hasExternalWallet(authLayout)) {
-        _authLayout = _authLayout.filter((l) => !l.includes("EXTERNAL"));
-      }
-      if (disableEmailLogin && disablePhoneLogin && !(oAuthMethods == null ? void 0 : oAuthMethods.length) && hasEmbeddedAuth(authLayout)) {
-        _authLayout = _authLayout.filter((l) => !l.includes("AUTH"));
-      }
-      if (JSON.stringify(storedAuthLayout) !== JSON.stringify(_authLayout)) {
-        setAuthLayout(_authLayout);
-      }
-    }, [disableEmailLogin, disablePhoneLogin, oAuthMethods, externalWallets, authLayout]);
-    useEffect(() => {
-      setOnModalStepChange(onModalStepChange);
-    }, [onModalStepChange]);
-    useEffect(() => {
-      var _a;
-      updateThemeState({
-        logo,
-        appName,
-        oAuthLogoVariant: (_a = theme == null ? void 0 : theme.oAuthLogoVariant) != null ? _a : "default",
-        bareModal,
-        embeddedModal,
-        hideWallets
-      });
-    }, [logo, appName, theme == null ? void 0 : theme.oAuthLogoVariant, bareModal, embeddedModal, hideWallets]);
-    useEffect(() => {
-      if (theme) {
-        generateTheme(theme);
-        updateThemeState({ isDark: theme.mode === "dark", theme });
-      }
-    }, [theme]);
-    useEffect(() => {
-      if (para) {
-        initModal();
-        if (bareModal) {
-          setIsModalMounted(true);
-        }
-      } else {
-        console.error("A Para instance must be provided.");
-      }
-    }, []);
-    useEffect(() => {
-      if (isOpen && para) {
-        initModal();
-      }
-    }, [isOpen]);
-    const updateActiveWallet = () => {
-      if (!(selectedWallet == null ? void 0 : selectedWallet.id) || !para.findWallet(selectedWallet == null ? void 0 : selectedWallet.id)) {
-        const defaultWallet = para.findWallet(void 0, void 0, { forbidPregen: true });
-        setSelectedWallet({ id: defaultWallet == null ? void 0 : defaultWallet.id, type: defaultWallet == null ? void 0 : defaultWallet.type });
-      }
-    };
-    useEffect(() => {
-      updateActiveWallet();
-    }, [para]);
-    useEffect(() => {
-      const closePopupWindow = () => {
-        var _a;
-        (_a = refs.popupWindow.current) == null ? void 0 : _a.close();
-      };
-      if (typeof window !== "undefined") {
-        window.addEventListener(ParaEvent.WALLETS_CHANGE_EVENT, updateActiveWallet);
-        window.addEventListener(ParaEvent.EXTERNAL_WALLET_CHANGE_EVENT, updateActiveWallet);
-        window.addEventListener("beforeunload", closePopupWindow);
-      }
-      setIsReady(true);
-      return () => {
-        if (typeof window !== "undefined") {
-          window.removeEventListener(ParaEvent.WALLETS_CHANGE_EVENT, updateActiveWallet);
-          window.removeEventListener(ParaEvent.EXTERNAL_WALLET_CHANGE_EVENT, updateActiveWallet);
-          window.removeEventListener("beforeunload", closePopupWindow);
         }
-      };
-    }, []);
-    const handleClose = () => {
-      closeModal();
-      onClose == null ? void 0 : onClose();
-    };
-    const handleModalEntering = () => {
-      setIsModalMounted(true);
-    };
-    const handleModalExited = () => __async(void 0, null, function* () {
-      if (!bareModal) {
-        setIsModalMounted(false);
-      }
-      if (RESET_TO_AUTH_STEPS.includes(currentStep)) {
-        resetModalState();
-        resetUserInfoState();
-        setRecoveryShare(null);
-      } else if (RESET_TO_ACCOUNT_STEPS.includes(currentStep)) {
-        setStep(ModalStep.LOGIN_DONE);
-      }
-      if (para) {
-        yield initModal();
-        para.exitLoops();
-      }
-      if (!bareModal) {
-        setIsInit(false);
-      }
-    });
-    if (!ready) {
-      return null;
+        break;
     }
-    if (!para) {
-      console.error("A Para instance is required.");
-      return null;
+    setIsInit(true);
+  });
+  useEffect(() => {
+    let _authLayout = authLayout;
+    if (!(externalWallets == null ? void 0 : externalWallets.length) && hasExternalWallet(authLayout)) {
+      _authLayout = _authLayout.filter((l) => !l.includes("EXTERNAL"));
     }
-    if (!(storedAuthLayout == null ? void 0 : storedAuthLayout.length)) {
-      const hasExternalWalletError = !(externalWallets == null ? void 0 : externalWallets.length) && hasExternalWallet(authLayout);
-      const hasEmbeddedWalletError = disableEmailLogin && disablePhoneLogin && !(oAuthMethods == null ? void 0 : oAuthMethods.length) && hasEmbeddedAuth(authLayout);
-      if (hasExternalWalletError || hasEmbeddedWalletError) {
-        if (hasExternalWalletError) {
-          console.error("At least one external wallet must be provided if external wallet auth is enabled.");
-        }
-        if (hasEmbeddedWalletError) {
-          console.error(
-            "At least one login method (email, phone or OAuth) must be provided if embedded wallet auth is enabled."
-          );
-        }
-      } else {
-        console.error("At least one auth layout selection is required.");
-      }
-      return null;
+    if (disableEmailLogin && disablePhoneLogin && !(oAuthMethods == null ? void 0 : oAuthMethods.length) && hasEmbeddedAuth(authLayout)) {
+      _authLayout = _authLayout.filter((l) => !l.includes("AUTH"));
+    }
+    if (JSON.stringify(storedAuthLayout) !== JSON.stringify(_authLayout)) {
+      setAuthLayout(_authLayout);
+    }
+  }, [disableEmailLogin, disablePhoneLogin, oAuthMethods, externalWallets, authLayout, storedAuthLayout]);
+  useEffect(() => {
+    if (theme) {
+      generateTheme(theme);
     }
-    return /* @__PURE__ */ jsx(ExternalWalletsWrapper, { wallets: externalWallets, externalWalletsWithFullAuth: externalWalletsWithParaAuth, children: /* @__PURE__ */ jsx(
-      StyledAuthModal,
-      {
-        enterTransitionDuration: DEFAULTS.ANIMATION_DURATION,
-        exitTransitionDuration: DEFAULTS.ANIMATION_DURATION,
-        open: isOpen,
-        onCpslModalExited: handleModalExited,
-        onCpslModalEntering: handleModalEntering,
-        onCpslModalRequestClose: handleClose,
-        noOverlay: bareModal,
-        className,
-        "data-testid": "modal",
-        $embeddedModal: embeddedModal,
-        children: isModalMounted && (isInit && embeddedModal || !embeddedModal) && /* @__PURE__ */ jsx(
-          ModalContent,
-          __spreadValues({
-            oAuthMethods,
-            disableEmailLogin,
-            disablePhoneLogin,
-            onClose: handleClose
-          }, rest)
-        )
+  }, [theme]);
+  useEffect(() => {
+    setOnModalStepChange(onModalStepChange);
+  }, [onModalStepChange]);
+  useEffect(() => {
+    if (para) {
+      initModal();
+    } else {
+      console.error("A Para instance must be provided.");
+    }
+  }, []);
+  useEffect(() => {
+    if (isOpen && para) {
+      initModal(true);
+    }
+  }, [isOpen]);
+  useEffect(() => {
+    updateSelectedWallet();
+  }, [para]);
+  const handleClose = () => {
+    closeModal();
+    onClose == null ? void 0 : onClose();
+  };
+  const handleModalEntering = () => {
+    setIsModalMounted(true);
+  };
+  const handleModalExited = () => __async(void 0, null, function* () {
+    setIsModalMounted(false);
+    if (RESET_TO_AUTH_STEPS.includes(currentStep)) {
+      resetModalState();
+      setRecoveryShare(null);
+    } else if (RESET_TO_ACCOUNT_STEPS.includes(currentStep)) {
+      setStep(ModalStep.LOGIN_DONE);
+    }
+    if (para) {
+      yield initModal();
+    }
+    setIsInit(false);
+  });
+  if (!para) {
+    console.error("A Para instance is required.");
+    return null;
+  }
+  if (!(storedAuthLayout == null ? void 0 : storedAuthLayout.length)) {
+    const hasExternalWalletError = !(externalWallets == null ? void 0 : externalWallets.length) && hasExternalWallet(authLayout);
+    const hasEmbeddedWalletError = disableEmailLogin && disablePhoneLogin && !(oAuthMethods == null ? void 0 : oAuthMethods.length) && hasEmbeddedAuth(authLayout);
+    if (hasExternalWalletError || hasEmbeddedWalletError) {
+      if (hasExternalWalletError) {
+        console.error("At least one external wallet must be provided if external wallet auth is enabled.");
+      }
+      if (hasEmbeddedWalletError) {
+        console.error(
+          "At least one login method (email, phone or OAuth) must be provided if embedded wallet auth is enabled."
+        );
       }
-    ) });
+    } else {
+      console.error("At least one auth layout selection is required.");
+    }
+    return null;
   }
-);
+  return /* @__PURE__ */ jsx(
+    StyledAuthModal,
+    {
+      enterTransitionDuration: DEFAULTS.ANIMATION_DURATION,
+      exitTransitionDuration: DEFAULTS.ANIMATION_DURATION,
+      open: isOpen,
+      onCpslModalExited: handleModalExited,
+      onCpslModalEntering: handleModalEntering,
+      onCpslModalRequestClose: handleClose,
+      noOverlay: bareModal,
+      className,
+      "data-testid": "modal",
+      $embeddedModal: !!embeddedModal,
+      children: isModalMounted && ((embeddedModal || bareModal) && isInit || !embeddedModal && !bareModal) && /* @__PURE__ */ jsx(
+        ModalContent,
+        __spreadValues({
+          oAuthMethods,
+          disableEmailLogin,
+          disablePhoneLogin,
+          isGuestModeEnabled,
+          onClose: handleClose
+        }, rest)
+      )
+    }
+  );
+});
 const StyledAuthModal = styled(CpslAuthModal)`
   ${({ $embeddedModal }) => $embeddedModal && `
     &::part(modal-body-card) {