@getpara/react-sdk-lite 2.12.0 → 2.13.0

package/dist/modal/{hooks/useTelegramLogin.js → components/flows/account/Profile/useTelegramLink.js}

@@ -1,37 +1,33 @@
 "use client";
 import {
   __async
-} from "../../chunk-MMUBH76A.js";
+} from "../../../../../chunk-MMUBH76A.js";
 import { useEffect, useState } from "react";
-import { useInternalClient } from "../../provider/hooks/utils/useInternalClient.js";
-import { useModalStore } from "../stores/index.js";
-import { validatePortalOrigin } from "../utils/validatePortalOrigin.js";
-const useTelegramLogin = ({
+import { useInternalClient } from "../../../../../provider/hooks/utils/useInternalClient.js";
+import { validatePortalOrigin } from "../../../../utils/validatePortalOrigin.js";
+import { useStore } from "../../../../../provider/stores/useStore.js";
+const useTelegramLink = ({
   isActive = false,
   onSubmit,
-  status: propsStatus,
-  isLinking
+  status: propsStatus
 } = {}) => {
   const para = useInternalClient();
-  const refs = useModalStore((state) => state.refs);
-  const [url, setUrl] = useState();
-  const [isLoaded, setIsLoaded] = useState(false);
+  const refs = useStore((state) => state.refs);
+  const iFrameUrl = useStore((state) => state.iFrameUrl);
+  const setIFrameUrl = useStore((state) => state.setIFrameUrl);
   const [msgStatus, setMsgStatus] = useState("idle");
   const status = msgStatus === "success" ? propsStatus : msgStatus;
   useEffect(() => {
     const setup = () => __async(void 0, null, function* () {
-      if (!url) {
-        if (!isLinking) {
-          yield para.logout();
-          yield para.touchSession(true);
-        }
-        para.constructPortalUrl(!isLinking ? "telegramLoginVerify" : "telegramLogin").then(setUrl);
+      if (!iFrameUrl) {
+        const url = yield para.constructPortalUrl("telegramLogin");
+        setIFrameUrl(url);
       }
     });
     if (isActive) {
       setup();
     }
-  }, [isActive, url]);
+  }, [isActive, iFrameUrl]);
   useEffect(() => {
     const updateState = (event) => __async(void 0, null, function* () {
       var _a, _b;
@@ -52,7 +48,7 @@ const useTelegramLogin = ({
             try {
               onSubmit == null ? void 0 : onSubmit(authObject);
             } catch (e) {
-              (_b = (_a = refs.telegramIFrame.current) == null ? void 0 : _a.contentWindow) == null ? void 0 : _b.postMessage({ type: "TELEGRAM_RETRY" }, "*");
+              (_b = (_a = refs.iFrame.current) == null ? void 0 : _a.contentWindow) == null ? void 0 : _b.postMessage({ type: "TELEGRAM_RETRY" }, "*");
             }
           }
           break;
@@ -66,12 +62,9 @@ const useTelegramLogin = ({
     };
   }, [isActive, onSubmit]);
   return {
-    url,
-    isLoaded,
-    setIsLoaded,
     status
   };
 };
 export {
-  useTelegramLogin
+  useTelegramLink
 };

package/dist/modal/components/{Account/AccountSend → flows/account/Send}/AssetNetwork.js

@@ -1,5 +1,5 @@
 "use client";
-import "../../../../chunk-MMUBH76A.js";
+import "../../../../../chunk-MMUBH76A.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { CpslIcon } from "@getpara/react-components";
 function AssetNetwork({

package/dist/modal/components/flows/account/Send/SendAsset.d.ts

@@ -0,0 +1 @@
+export declare const SendAsset: () => import("react/jsx-runtime").JSX.Element;

package/dist/modal/components/{Account/AccountSend/AccountSendAsset.js → flows/account/Send/SendAsset.js}

@@ -1,16 +1,15 @@
 "use client";
-import "../../../../chunk-MMUBH76A.js";
+import "../../../../../chunk-MMUBH76A.js";
 import { jsx } from "react/jsx-runtime";
 import { useMemo, useCallback, memo } from "react";
-import { useWalletState } from "../../../../provider/index.js";
-import { useAssets } from "../../../../provider/providers/AssetsProvider.js";
-import { SearchableButtonList } from "../../SearchableButtonList.js";
+import { useWalletState } from "../../../../../provider/index.js";
+import { useAssets } from "../../../../../provider/providers/AssetsProvider.js";
+import { SearchableButtonList } from "../../../SearchableButtonList.js";
 import { useSend } from "./context.js";
 import { CpslIcon } from "@getpara/react-components";
 import { formatAssetQuantity, formatCurrency } from "@getpara/web-sdk";
-import { ModalStep } from "../../../utils/steps.js";
-import { useModalStore } from "../../../stores/index.js";
 import { AssetNetwork } from "./AssetNetwork.js";
+import { useStore } from "../../../../../provider/stores/useStore.js";
 const NetworkIcons = memo(({ networks }) => {
   return /* @__PURE__ */ jsx("div", { style: { position: "relative", height: "12px" }, children: networks.slice(0, 3).map((network, index) => {
     var _a;
@@ -34,8 +33,8 @@ const NetworkIcons = memo(({ networks }) => {
   }) });
 });
 NetworkIcons.displayName = "NetworkIcons";
-function AccountSendAsset() {
-  const setStep = useModalStore((state) => state.setStep);
+const SendAsset = () => {
+  const setAccountView = useStore((state) => state.setAccountView);
   const { profileBalance } = useAssets();
   const { selectedWallet } = useWalletState();
   const { setSendMetadata, setTransferAmount } = useSend();
@@ -75,9 +74,9 @@ function AccountSendAsset() {
         asset: item,
         network: item.networks[0]
       });
-      setStep(item.networks.length > 1 ? ModalStep.ACCOUNT_SEND_NETWORK : ModalStep.ACCOUNT_SEND);
+      setAccountView(item.networks.length > 1 ? "ACCOUNT_SEND_NETWORK" : "ACCOUNT_SEND");
     },
-    [setTransferAmount, setSendMetadata, setStep]
+    [setTransferAmount, setSendMetadata, setAccountView]
   );
   return /* @__PURE__ */ jsx("div", { style: { width: "100%" }, children: /* @__PURE__ */ jsx(
     SearchableButtonList,
@@ -88,7 +87,7 @@ function AccountSendAsset() {
       onSelect
     }
   ) });
-}
+};
 export {
-  AccountSendAsset
+  SendAsset
 };

package/dist/modal/components/flows/account/Send/SendForm.d.ts

@@ -0,0 +1 @@
+export declare const SendForm: () => import("react/jsx-runtime").JSX.Element;

package/dist/modal/components/{Account/AccountSend/AccountSendForm.js → flows/account/Send/SendForm.js}

@@ -1,27 +1,26 @@
 "use client";
-import "../../../../chunk-MMUBH76A.js";
+import "../../../../../chunk-MMUBH76A.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { CpslButton, CpslIcon, CpslInput, CpslText } from "@getpara/react-components";
-import { QuantityInput } from "../../QuantityInput.js";
+import { QuantityInput } from "../../../QuantityInput.js";
 import { formatAssetQuantity, formatCurrency } from "@getpara/shared";
 import { WalletTypeIcon } from "@getpara/react-common";
 import { useSend } from "./context.js";
-import { useModalStore } from "../../../stores/index.js";
-import { ModalStep } from "../../../utils/steps.js";
+import { useStore } from "../../../../../provider/stores/useStore.js";
 import { useEffect, useMemo, useRef, useState } from "react";
 import { createPortal } from "react-dom";
-import { useDebounce } from "../../../hooks/useDebounce.js";
+import { useDebounce } from "../../../../hooks/useDebounce.js";
 import { AssetNetwork } from "./AssetNetwork.js";
-import { useWalletState } from "../../../../provider/index.js";
-import { useInternalClient } from "../../../../provider/hooks/utils/useInternalClient.js";
+import { useWalletState } from "../../../../../provider/index.js";
+import { useInternalClient } from "../../../../../provider/hooks/utils/useInternalClient.js";
 import { Environment } from "@getpara/web-sdk";
 import { safeStyled } from "@getpara/react-common";
-function AccountSendForm() {
+const SendForm = () => {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p;
   const { selectedWallet } = useWalletState();
-  const setStep = useModalStore((state) => state.setStep);
-  const onRampConfig = useModalStore((state) => state.onRampConfig);
-  const currentStep = useModalStore((state) => state.step);
+  const setAccountView = useStore((state) => state.setAccountView);
+  const accountView = useStore((state) => state.accountView);
+  const onRampConfig = useStore((state) => state.onRampConfig);
   const {
     estimate,
     broadcast,
@@ -46,7 +45,7 @@ function AccountSendForm() {
   } = useSend();
   const para = useInternalClient();
   const isDevOrSandbox = ((_a = para.ctx) == null ? void 0 : _a.env) === Environment.DEV || ((_b = para.ctx) == null ? void 0 : _b.env) === Environment.SANDBOX;
-  const isSendFormStep = currentStep === ModalStep.ACCOUNT_SEND;
+  const isSendFormStep = accountView === "ACCOUNT_SEND";
   const [inputDestinationAddress, setInputDestinationAddress] = useState(destinationAddress);
   const dbInputDestinationAddress = useDebounce(inputDestinationAddress, 500);
   const isTestnet = (_d = (_c = sendMetadata == null ? void 0 : sendMetadata.network) == null ? void 0 : _c.metadata) == null ? void 0 : _d.isTestnet;
@@ -88,7 +87,7 @@ function AccountSendForm() {
                 gap: "4px",
                 paddingRight: 0
               },
-              onClick: () => setStep(ModalStep.ADD_FUNDS_BUY),
+              onClick: () => setAccountView("ACCOUNT_ADD_FUNDS_BUY"),
               children: [
                 /* @__PURE__ */ jsxs("span", { children: [
                   "Buy ",
@@ -218,7 +217,7 @@ function AccountSendForm() {
           (sendMetadata == null ? void 0 : sendMetadata.asset) && (sendMetadata == null ? void 0 : sendMetadata.network) && /* @__PURE__ */ jsxs(
             "button",
             {
-              onClick: () => !["SINGLE_NETWORK", "NONE"].includes(optionsType) ? setStep(optionsType === "SINGLE_ASSET" ? ModalStep.ACCOUNT_SEND_NETWORK : ModalStep.ACCOUNT_SEND_ASSET) : void 0,
+              onClick: () => !["SINGLE_NETWORK", "NONE"].includes(optionsType) ? setAccountView(optionsType === "SINGLE_ASSET" ? "ACCOUNT_SEND_NETWORK" : "ACCOUNT_SEND_ASSET") : void 0,
               style: {
                 cursor: "pointer",
                 background: "transparent",
@@ -384,7 +383,7 @@ function AccountSendForm() {
       document.body
     )
   ] });
-}
+};
 const RecipientInput = safeStyled(CpslInput)`
   --cpsl-color-input-surface-hover: var(--cpsl-color-input-surface-default);
 `;
@@ -406,5 +405,5 @@ const SimulateFailureContainer = safeStyled.div`
   isolation: isolate;
 `;
 export {
-  AccountSendForm
+  SendForm
 };

package/dist/modal/components/flows/account/Send/SendNetwork.d.ts

@@ -0,0 +1 @@
+export declare const SendNetwork: () => import("react/jsx-runtime").JSX.Element;

package/dist/modal/components/{Account/AccountSend/AccountSendNetwork.js → flows/account/Send/SendNetwork.js}

@@ -2,18 +2,17 @@
 import {
   __spreadProps,
   __spreadValues
-} from "../../../../chunk-MMUBH76A.js";
+} from "../../../../../chunk-MMUBH76A.js";
 import { jsx } from "react/jsx-runtime";
 import { useMemo } from "react";
-import { useAssets } from "../../../../provider/providers/AssetsProvider.js";
-import { SearchableButtonList } from "../../SearchableButtonList.js";
+import { useAssets } from "../../../../../provider/providers/AssetsProvider.js";
+import { SearchableButtonList } from "../../../SearchableButtonList.js";
 import { useSend } from "./context.js";
 import { formatAssetQuantity, formatCurrency } from "@getpara/web-sdk";
-import { ModalStep } from "../../../utils/steps.js";
-import { useModalStore } from "../../../stores/index.js";
+import { useStore } from "../../../../../provider/stores/useStore.js";
 import { AssetNetwork } from "./AssetNetwork.js";
-function AccountSendNetwork() {
-  const setStep = useModalStore((state) => state.setStep);
+const SendNetwork = () => {
+  const setAccountView = useStore((state) => state.setAccountView);
   const { profileBalance } = useAssets();
   const { sendMetadata, setSendMetadata } = useSend();
   const assetNetworks = useMemo(() => {
@@ -43,11 +42,11 @@ function AccountSendNetwork() {
         setSendMetadata((prev) => __spreadProps(__spreadValues({}, prev), {
           network: item
         }));
-        setStep(ModalStep.ACCOUNT_SEND);
+        setAccountView("ACCOUNT_SEND");
       }
     }
   ) });
-}
+};
 export {
-  AccountSendNetwork
+  SendNetwork
 };

package/dist/modal/components/flows/account/Send/SendNoAssets.d.ts

@@ -0,0 +1 @@
+export declare const SendNoAssets: () => import("react/jsx-runtime").JSX.Element;

package/dist/modal/components/{Account/AccountSend/AccountSendNoAssets.js → flows/account/Send/SendNoAssets.js}

@@ -1,12 +1,11 @@
 "use client";
-import "../../../../chunk-MMUBH76A.js";
+import "../../../../../chunk-MMUBH76A.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { CpslButton, CpslText } from "@getpara/react-components";
-import { useModalStore } from "../../../stores/index.js";
-import { ModalStep } from "../../../utils/steps.js";
-function AccountSendNoAssets() {
-  const onRampConfig = useModalStore((state) => state.onRampConfig);
-  const setStep = useModalStore((state) => state.setStep);
+import { useStore } from "../../../../../provider/stores/useStore.js";
+const SendNoAssets = () => {
+  const onRampConfig = useStore((state) => state.onRampConfig);
+  const setAccountView = useStore((state) => state.setAccountView);
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -42,7 +41,7 @@ function AccountSendNoAssets() {
             fullWidth: true,
             variant: "primary",
             onClick: () => {
-              setStep(ModalStep.ADD_FUNDS_BUY);
+              setAccountView("ACCOUNT_ADD_FUNDS_BUY");
             },
             children: "Buy"
           }
@@ -50,7 +49,7 @@ function AccountSendNoAssets() {
       ]
     }
   );
-}
+};
 export {
-  AccountSendNoAssets
+  SendNoAssets
 };

package/dist/modal/components/{Account/AccountSend → flows/account/Send}/context.js

@@ -2,7 +2,7 @@
 import {
   __spreadProps,
   __spreadValues
-} from "../../../../chunk-MMUBH76A.js";
+} from "../../../../../chunk-MMUBH76A.js";
 import { jsx } from "react/jsx-runtime";
 import {
   createContext,
@@ -13,10 +13,10 @@ import {
   useRef,
   useState
 } from "react";
-import { useInternalClient } from "../../../../provider/hooks/utils/useInternalClient.js";
-import { useProfileBalance, useWalletState } from "../../../../provider/index.js";
-import { useSendMutations } from "../../../hooks/index.js";
-import { useStore } from "../../../../provider/stores/useStore.js";
+import { useInternalClient } from "../../../../../provider/hooks/utils/useInternalClient.js";
+import { useProfileBalance, useWalletState } from "../../../../../provider/index.js";
+import { useSendMutations } from "../../../../hooks/index.js";
+import { useStore } from "../../../../../provider/stores/useStore.js";
 const getDefaultSendMetadata = (balances, wallet) => {
   if (!balances || !(wallet == null ? void 0 : wallet.type) || !(wallet == null ? void 0 : wallet.address) || (wallet == null ? void 0 : wallet.type) === "COSMOS") {
     return { asset: null, network: null };

package/dist/modal/components/{Account/AccountSend → flows/account/Send}/index.js

@@ -1,16 +1,16 @@
 "use client";
-import "../../../../chunk-MMUBH76A.js";
+import "../../../../../chunk-MMUBH76A.js";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { StepContainer } from "../../common.js";
+import { StepContainer } from "../../../common.js";
 import { useMemo, useRef, useEffect, useState } from "react";
-import { AccountSendForm } from "./AccountSendForm.js";
+import { SendForm } from "./SendForm.js";
 import { AccountSendProvider, useSend } from "./context.js";
-import { AccountSendAsset } from "./AccountSendAsset.js";
-import { AccountSendNetwork } from "./AccountSendNetwork.js";
+import { SendAsset } from "./SendAsset.js";
+import { SendNetwork } from "./SendNetwork.js";
 import { AnimatePresence, motion } from "framer-motion";
 import { BODY_MOTION_VARIANTS, BODY_TRANSITION, safeStyled } from "@getpara/react-common";
-import { WalletSelectOld } from "../../WalletSelectOld/WalletSelectOld.js";
-import { AccountSendNoAssets } from "./AccountSendNoAssets.js";
+import { WalletSelectOld } from "../../../WalletSelectOld/WalletSelectOld.js";
+import { SendNoAssets } from "./SendNoAssets.js";
 const STEP_ORDER = ["SEND_FORM", "SEND_ASSET", "SEND_NETWORK"];
 function AccountSendIndex() {
   const { step, optionsType } = useSend();
@@ -24,15 +24,15 @@ function AccountSendIndex() {
   }, [step]);
   const Content = useMemo(() => {
     if (optionsType === "NONE") {
-      return /* @__PURE__ */ jsx(AccountSendNoAssets, {});
+      return /* @__PURE__ */ jsx(SendNoAssets, {});
     }
     switch (step) {
       case "SEND_FORM":
-        return /* @__PURE__ */ jsx(AccountSendForm, {});
+        return /* @__PURE__ */ jsx(SendForm, {});
       case "SEND_ASSET":
-        return /* @__PURE__ */ jsx(AccountSendAsset, {});
+        return /* @__PURE__ */ jsx(SendAsset, {});
       case "SEND_NETWORK":
-        return /* @__PURE__ */ jsx(AccountSendNetwork, {});
+        return /* @__PURE__ */ jsx(SendNetwork, {});
     }
   }, [step, optionsType]);
   return /* @__PURE__ */ jsxs(StepContainer, { style: { gap: "16px" }, children: [

package/dist/modal/components/flows/account/SwitchWallets/SwitchWallets.d.ts

@@ -0,0 +1 @@
+export declare const SwitchWallet: () => import("react/jsx-runtime").JSX.Element;

package/dist/modal/components/{SwitchWalletsStep/SwitchWalletsStep.js → flows/account/SwitchWallets/SwitchWallets.js}

@@ -1,10 +1,10 @@
 "use client";
-import "../../../chunk-MMUBH76A.js";
+import "../../../../../chunk-MMUBH76A.js";
 import { jsx } from "react/jsx-runtime";
-import { Waiting } from "../Waiting/Waiting.js";
-const SwitchWalletsStep = () => {
+import { Waiting } from "../../../Waiting/Waiting.js";
+const SwitchWallet = () => {
   return /* @__PURE__ */ jsx(Waiting, { heading: "Switching Wallets", subheading: "Please complete the wallet selection in the popup window." });
 };
 export {
-  SwitchWalletsStep
+  SwitchWallet
 };

package/dist/modal/components/flows/account/Wallet/Wallet.d.ts

@@ -0,0 +1 @@
+export declare const Wallet: () => import("react/jsx-runtime").JSX.Element;

package/dist/modal/components/{Account/AccountWallet.js → flows/account/Wallet/Wallet.js}

@@ -1,16 +1,15 @@
 "use client";
 import {
   __async
-} from "../../../chunk-MMUBH76A.js";
+} from "../../../../../chunk-MMUBH76A.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { safeStyled, SpinnerContainer } from "@getpara/react-common";
 import { CpslButton, CpslIcon, CpslSpinner } from "@getpara/react-components";
-import { useModalStore } from "../../stores/modal/useModalStore.js";
-import { WalletEntry } from "./AccountProfileEntry.js";
 import { useMemo } from "react";
-import { useAccount, useExportPrivateKey } from "../../../provider/index.js";
-import { useExternalWallets } from "../../../provider/providers/ExternalWalletProvider.js";
-import { ModalStep } from "../../utils/steps.js";
+import { useAccount, useExportPrivateKey } from "../../../../../provider/index.js";
+import { useExternalWallets } from "../../../../../provider/providers/ExternalWalletProvider.js";
+import { WalletEntry } from "../Profile/ProfileEntry.js";
+import { useStore } from "../../../../../provider/stores/useStore.js";
 const EXPLORERS = {
   EVM: {
     name: "Etherscan",
@@ -25,10 +24,10 @@ const EXPLORERS = {
     url: (address) => `https://atomscan.com/accounts/${address}`
   }
 };
-const AccountWallet = () => {
-  const profileWallet = useModalStore((state) => state.profileWallet);
-  const setProfileWallet = useModalStore((state) => state.setProfileWallet);
-  const setStep = useModalStore((state) => state.setStep);
+const Wallet = () => {
+  const profileWallet = useStore((state) => state.profileWallet);
+  const setProfileWallet = useStore((state) => state.setProfileWallet);
+  const setAccountView = useStore((state) => state.setAccountView);
   const { connectionType } = useAccount();
   const { mutate: exportPrivateKey } = useExportPrivateKey();
   const { disconnectBase, evmDisconnectStatus, solanaDisconnectStatus, cosmosDisconnectStatus } = useExternalWallets();
@@ -102,7 +101,7 @@ const AccountWallet = () => {
               disconnectType: "ACCOUNT_WIDGET"
             });
             setProfileWallet(void 0);
-            setStep(ModalStep.ACCOUNT_PROFILE);
+            setAccountView("ACCOUNT_PROFILE");
           }),
           "data-testid": "para-disconnect-wallet",
           children: [
@@ -127,5 +126,5 @@ const DestructiveButton = safeStyled(CpslButton)`
   --button-destructive-active-background-color: rgba(255, 0, 0, 0.1);
 `;
 export {
-  AccountWallet
+  Wallet
 };

package/dist/modal/components/flows/auth/AuthFlow/AuthFlow.d.ts

@@ -0,0 +1,10 @@
+import { TOAuthMethod } from '@getpara/web-sdk';
+interface AuthFlowProps {
+    oAuthMethods?: TOAuthMethod[];
+    disableEmailLogin: boolean;
+    disablePhoneLogin: boolean;
+    isGuestModeEnabled?: boolean;
+    onClose: () => void;
+}
+export declare const AuthFlow: import("react").MemoExoticComponent<({ onClose, ...rest }: AuthFlowProps) => string | number | boolean | Iterable<import("react").ReactNode> | import("react/jsx-runtime").JSX.Element | null | undefined>;
+export {};

package/dist/modal/components/flows/auth/AuthFlow/AuthFlow.js

@@ -0,0 +1,94 @@
+"use client";
+import {
+  __objRest,
+  __spreadValues
+} from "../../../../../chunk-MMUBH76A.js";
+import { jsx } from "react/jsx-runtime";
+import { useStore } from "../../../../../provider/stores/useStore.js";
+import { memo, useMemo } from "react";
+import { useAuthView } from "../../../../hooks/useAuthView.js";
+import { AuthMain } from "../AuthMain/AuthMain.js";
+import { AwaitingPassword } from "../AwaitingPassword/AwaitingPassword.js";
+import { Verification } from "../Verification/Verification.js";
+import { AwaitingOAuth } from "../AwaitingOAuth/AwaitingOAuth.js";
+import { WalletCreationDone } from "../WalletCreationDone/WalletCreationDone.js";
+import { RecoverySecretStep } from "../RecoverySecretStep/RecoverySecretStep.js";
+import { AwaitingAccountSetup } from "../AwaitingAccountSetup/AwaitingAccountSetup.js";
+import { BiometricCreation } from "../BiometricCreation/BiometricCreation.js";
+import { BiometricLogin } from "../BiometricLogin/BiometricLogin.js";
+import { AwaitingBiometrics } from "../AwaitingBiometrics/AwaitingBiometrics.js";
+import { Setup2FA } from "../Setup2FA/Setup2FA.js";
+import { LoginDone } from "../LoginDone/LoginDone.js";
+import { VerifyExternalWallet } from "../../../shared/VerifyExternalWallet.js";
+import { ExternalWalletNetworkSelect } from "../../../shared/ExternalWalletNetworkSelect.js";
+import { ConnectExternalWallet } from "../../../shared/ConnectExternalWallet/ConnectExternalWallet.js";
+const MemoizedAuthMain = memo(AuthMain);
+const MemoizedVerification = memo(Verification);
+const MemoizedAwaitingOAuth = memo(AwaitingOAuth);
+const MemoizedAwaitingPassword = memo(AwaitingPassword);
+const MemoizedAwaitingBiometrics = memo(AwaitingBiometrics);
+const MemoizedBiometricLogin = memo(BiometricLogin);
+const MemoizedBiometricCreation = memo(BiometricCreation);
+const MemoizedAwaitingAccountSetup = memo(AwaitingAccountSetup);
+const MemoizedRecoverySecretStep = memo(RecoverySecretStep);
+const MemoizedWalletCreationDone = memo(WalletCreationDone);
+const MemoizedSetup2FA = memo(Setup2FA);
+const MemoizedConnectExternalWallet = memo(ConnectExternalWallet);
+const MemoizedVerifyExternalWallet = memo(VerifyExternalWallet);
+const MemoizedExternalWalletNetworkSelect = memo(ExternalWalletNetworkSelect);
+const MemoizedLoginDone = memo(LoginDone);
+const AuthFlow = memo((_a) => {
+  var _b = _a, { onClose } = _b, rest = __objRest(_b, ["onClose"]);
+  const { authView } = useAuthView();
+  const isLogin = useStore((state) => {
+    var _a2, _b2;
+    return ((_b2 = (_a2 = state.paraState) == null ? void 0 : _a2.authStateInfo) == null ? void 0 : _b2.isNewUser) === false;
+  });
+  const lastValidComponentRef = useStore((state) => state.lastValidComponentRef);
+  const selectedComponent = useMemo(() => {
+    switch (authView) {
+      case "AUTH_MAIN":
+      case "AUTH_ALL_EXTERNAL_WALLETS":
+      case "AUTH_ALL_OPTIONS":
+        return /* @__PURE__ */ jsx(MemoizedAuthMain, __spreadValues({}, rest));
+      case "AUTH_VERIFY_ACCOUNT":
+        return /* @__PURE__ */ jsx(MemoizedVerification, {});
+      case "AUTH_OAUTH_CONNECT":
+        return /* @__PURE__ */ jsx(MemoizedAwaitingOAuth, {});
+      case "AUTH_EXTERNAL_WALLET_CONNECT":
+        return /* @__PURE__ */ jsx(MemoizedConnectExternalWallet, {});
+      case "AUTH_EXTERNAL_WALLET_NETWORK_SELECT":
+        return /* @__PURE__ */ jsx(MemoizedExternalWalletNetworkSelect, { type: "CONNECT" });
+      case "AUTH_EXTERNAL_WALLET_VERIFY":
+        return /* @__PURE__ */ jsx(MemoizedVerifyExternalWallet, {});
+      case "AUTH_GUEST_MODE_CONNECTING":
+      case "AUTH_CONNECTING":
+      case "AUTH_BASIC_LOGIN":
+        return /* @__PURE__ */ jsx(MemoizedAwaitingAccountSetup, {});
+      case "AUTH_BIOMETRIC_PASSWORD":
+      case "AUTH_BIOMETRIC_PIN":
+        return /* @__PURE__ */ jsx(MemoizedAwaitingPassword, {});
+      case "AUTH_BIOMETRIC_PASSKEY":
+        return /* @__PURE__ */ jsx(MemoizedAwaitingBiometrics, {});
+      case "AUTH_BIOMETRIC_SELECT":
+        return isLogin ? /* @__PURE__ */ jsx(MemoizedBiometricLogin, {}) : /* @__PURE__ */ jsx(MemoizedBiometricCreation, {});
+      case "AUTH_2FA_SETUP":
+        return /* @__PURE__ */ jsx(MemoizedSetup2FA, { onClose });
+      case "AUTH_RECOVERY_SECRET":
+        return /* @__PURE__ */ jsx(MemoizedRecoverySecretStep, {});
+      case "AUTH_WALLETS_CREATED":
+        return /* @__PURE__ */ jsx(MemoizedWalletCreationDone, { onClose });
+      case "AUTH_CONNECTED":
+        return /* @__PURE__ */ jsx(MemoizedLoginDone, { onClose });
+      case "AUTH_ERROR":
+        return null;
+    }
+  }, [authView, isLogin, rest]);
+  if (selectedComponent !== null) {
+    lastValidComponentRef.current = selectedComponent;
+  }
+  return selectedComponent || lastValidComponentRef.current;
+});
+export {
+  AuthFlow
+};

package/dist/modal/components/flows/auth/AuthMain/AuthMain.d.ts

@@ -0,0 +1,9 @@
+import { TOAuthMethod } from '@getpara/web-sdk';
+interface AuthMainProps {
+    oAuthMethods?: TOAuthMethod[];
+    disableEmailLogin: boolean;
+    disablePhoneLogin: boolean;
+    isGuestModeEnabled?: boolean;
+}
+export declare const AuthMain: (props: AuthMainProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/modal/components/{AuthMainStep/AuthMainStep.js → flows/auth/AuthMain/AuthMain.js}

@@ -1,17 +1,14 @@
 "use client";
-import "../../../chunk-MMUBH76A.js";
+import {
+  __spreadValues
+} from "../../../../../chunk-MMUBH76A.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { safeStyled } from "@getpara/react-common";
-import { AuthMainStepContent } from "./AuthMainStepContent.js";
-import { CenteredText } from "../common.js";
-import { useStore } from "../../../provider/stores/useStore.js";
-import { useStepTitle } from "../Header/hooks/useStepTitle.js";
-const AuthMainStep = ({
-  oAuthMethods,
-  disableEmailLogin,
-  disablePhoneLogin,
-  isGuestModeEnabled = false
-}) => {
+import { AuthMainContent } from "./AuthMainContent.js";
+import { CenteredText } from "../../../common.js";
+import { useStore } from "../../../../../provider/stores/useStore.js";
+import { useStepTitle } from "../../../Header/hooks/useStepTitle.js";
+const AuthMain = (props) => {
   const embeddedModal = useStore((state) => {
     var _a;
     return (_a = state.modalConfig) == null ? void 0 : _a.embeddedModal;
@@ -25,15 +22,7 @@ const AuthMainStep = ({
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     logo && /* @__PURE__ */ jsx(Logo, { src: logo, alt: `${appName ? `${appName} -` : ""}logo` }),
     !embeddedModal && !isTitleDisplayed && /* @__PURE__ */ jsx(CenteredText, { variant: logo ? "bodyM" : "headingS", weight: "semiBold", children: title }),
-    /* @__PURE__ */ jsx(
-      AuthMainStepContent,
-      {
-        disableEmailLogin,
-        disablePhoneLogin,
-        isGuestModeEnabled,
-        oAuthMethods
-      }
-    )
+    /* @__PURE__ */ jsx(AuthMainContent, __spreadValues({}, props))
   ] });
 };
 const Logo = safeStyled.img`
@@ -44,5 +33,5 @@ const Logo = safeStyled.img`
   align-self: center;
 `;
 export {
-  AuthMainStep
+  AuthMain
 };

package/dist/modal/components/flows/auth/AuthMain/AuthMainContent.d.ts

@@ -0,0 +1,9 @@
+import { TOAuthMethod } from '@getpara/web-sdk';
+interface AuthMainContentProps {
+    oAuthMethods?: TOAuthMethod[];
+    disableEmailLogin: boolean;
+    disablePhoneLogin: boolean;
+    isGuestModeEnabled?: boolean;
+}
+export declare const AuthMainContent: ({ oAuthMethods, disableEmailLogin, disablePhoneLogin, isGuestModeEnabled, }: AuthMainContentProps) => import("react/jsx-runtime").JSX.Element;
+export {};