@getpara/react-sdk-lite 2.11.0 → 2.13.0

package/dist/modal/components/{AddFunds → flows/account/AddFunds}/AddFundsProvider.js

@@ -3,23 +3,24 @@ import {
   __async,
   __spreadProps,
   __spreadValues
-} from "../../../chunk-MMUBH76A.js";
+} from "../../../../../chunk-MMUBH76A.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { safeStyled } from "@getpara/react-common";
-import { contentMotionProps, Heading, InnerStepContainer } from "../common.js";
+import { contentMotionProps, Heading, InnerStepContainer } from "../../../common.js";
 import { useAddFunds } from "./AddFundsContext.js";
-import { OnRampStep, useModalStore } from "../../stores/index.js";
 import { motion, AnimatePresence } from "framer-motion";
-import { OnRampProviderButton } from "../OnRampComponents/OnRampProviderButton.js";
-import { useWallet } from "../../../provider/index.js";
+import { OnRampProviderButton } from "../../../OnRampComponents/OnRampProviderButton.js";
+import { useWallet } from "../../../../../provider/index.js";
 import { EnabledFlow, OnRampPurchaseType } from "@getpara/web-sdk";
-import { useInternalClient } from "../../../provider/hooks/utils/useInternalClient.js";
+import { useInternalClient } from "../../../../../provider/hooks/utils/useInternalClient.js";
 import { useEffect } from "react";
-function AddFundsProvider() {
+import { useStore } from "../../../../../provider/stores/useStore.js";
+import { OnRampStep } from "../../../../../provider/stores/types.js";
+const AddFundsProvider = () => {
   const para = useInternalClient();
-  const setOnRampStep = useModalStore((state) => state.setOnRampStep);
-  const onRampConfig = useModalStore((state) => state.onRampConfig);
-  const setOnRampPurchase = useModalStore((state) => state.setOnRampPurchase);
+  const setOnRampStep = useStore((state) => state.setOnRampStep);
+  const onRampConfig = useStore((state) => state.onRampConfig);
+  const setOnRampPurchase = useStore((state) => state.setOnRampPurchase);
   const { asset, network, fiatQuantity, isProviderAllowed, tab, TestModeAlert, isTestMode } = useAddFunds();
   const { data: activeWallet } = useWallet();
   useEffect(() => {
@@ -44,7 +45,7 @@ function AddFundsProvider() {
             {
               config: onRampConfig,
               index,
-              onClick: () => __async(this, null, function* () {
+              onClick: () => __async(void 0, null, function* () {
                 if (!(activeWallet == null ? void 0 : activeWallet.type)) return;
                 const { onRampPurchase: newOnRampPurchase } = yield para.initiateOnRampTransaction({
                   walletId: activeWallet.isExternal ? void 0 : activeWallet.id,
@@ -71,7 +72,7 @@ function AddFundsProvider() {
     }) : null }) }),
     TestModeAlert
   ] }));
-}
+};
 const Container = safeStyled(motion.div)`
   width: 100%;
   height: 100%;

package/dist/modal/components/flows/account/AddFunds/AddFundsReceive.d.ts

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

package/dist/modal/components/{AddFunds → flows/account/AddFunds}/AddFundsReceive.js

@@ -1,25 +1,25 @@
 "use client";
-import "../../../chunk-MMUBH76A.js";
+import "../../../../../chunk-MMUBH76A.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { CpslQrCode, CpslSpinner } from "@getpara/react-components";
-import { CenteredText, InnerStepContainer, QRContainer } from "../common.js";
+import { CenteredText, InnerStepContainer, QRContainer } from "../../../common.js";
 import { isMobile } from "@getpara/web-sdk";
-import { useModalStore } from "../../stores/index.js";
 import { useMemo } from "react";
-import { useAccount, useWallet } from "../../../provider/hooks/index.js";
+import { useAccount, useWallet } from "../../../../../provider/hooks/index.js";
 import { useAddFunds } from "./AddFundsContext.js";
-import { formatNetworkList } from "../../utils/stringFormatters.js";
-import { useInternalClient } from "../../../provider/hooks/utils/useInternalClient.js";
-import { WalletSelectOld } from "../WalletSelectOld/WalletSelectOld.js";
+import { formatNetworkList } from "../../../../utils/stringFormatters.js";
+import { useInternalClient } from "../../../../../provider/hooks/utils/useInternalClient.js";
+import { WalletSelectOld } from "../../../WalletSelectOld/WalletSelectOld.js";
+import { useStore } from "../../../../../provider/stores/useStore.js";
 const GENERIC_WALLET = {
   EVM: "Ethereum or EVM-based networks",
   SOLANA: "Solana or SVM-based networks",
   COSMOS: "Cosmos networks"
 };
-function AddFundsReceive() {
+const AddFundsReceive = () => {
   const { networks } = useAddFunds();
   const para = useInternalClient();
-  const onRampConfig = useModalStore((state) => state.onRampConfig);
+  const onRampConfig = useStore((state) => state.onRampConfig);
   const { data: activeWallet } = useWallet();
   const { embedded } = useAccount();
   const address = useMemo(
@@ -35,7 +35,7 @@ function AddFundsReceive() {
       !!(onRampConfig == null ? void 0 : onRampConfig.allowedAssets) && networks.length > 0 ? formatNetworkList(networks) : GENERIC_WALLET[activeWallet.type]
     ] }) })
   ] });
-}
+};
 export {
   AddFundsReceive
 };

package/dist/modal/components/{AddFunds → flows/account/AddFunds}/AddFundsSettings.js

@@ -2,24 +2,24 @@
 import {
   __spreadProps,
   __spreadValues
-} from "../../../chunk-MMUBH76A.js";
+} from "../../../../../chunk-MMUBH76A.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useMemo, useState } from "react";
 import { useAddFunds } from "./AddFundsContext.js";
-import { isAmountWithinProviderLimits, PROVIDER_LIMITS } from "../../utils/onramps.js";
+import { isAmountWithinProviderLimits, PROVIDER_LIMITS } from "../../../../utils/onramps.js";
 import { CpslButton, CpslIcon, CpslRow, CpslText } from "@getpara/react-components";
-import { AssetIcon, contentMotionProps } from "../common.js";
-import { QuantityInput } from "../QuantityInput.js";
+import { AssetIcon, contentMotionProps } from "../../../common.js";
+import { QuantityInput } from "../../../QuantityInput.js";
 import { formatAssetQuantity, OnRampPurchaseType, EnabledFlow } from "@getpara/web-sdk";
-import { OnRampStep, useModalStore } from "../../stores/index.js";
 import { safeStyled, getAssetCode, getNetworkName } from "@getpara/react-common";
 import { AnimatePresence, motion, useIsPresent } from "framer-motion";
 import { AddFundsAsset } from "./AddFundsAsset.js";
-import { WalletSelectOld } from "../WalletSelectOld/WalletSelectOld.js";
-import { useAccount } from "../../../provider/index.js";
-import { useAssetInfo } from "../../../provider/hooks/utils/useAssetInfo.js";
+import { WalletSelectOld } from "../../../WalletSelectOld/WalletSelectOld.js";
+import { useAccount } from "../../../../../provider/index.js";
+import { useAssetInfo } from "../../../../../provider/hooks/utils/useAssetInfo.js";
 import { AddFundsNetwork } from "./AddFundsNetwork.js";
-import { useStore } from "../../../provider/stores/useStore.js";
+import { useStore } from "../../../../../provider/stores/useStore.js";
+import { OnRampStep } from "../../../../../provider/stores/types.js";
 function AddFundsSettings() {
   const hideWallets = useStore((state) => {
     var _a;
@@ -27,7 +27,7 @@ function AddFundsSettings() {
   });
   const assetInfo = useAssetInfo();
   const isPresent = useIsPresent();
-  const setOnRampStep = useModalStore((state) => state.setOnRampStep);
+  const setOnRampStep = useStore((state) => state.setOnRampStep);
   const { embedded } = useAccount();
   const {
     assets,

package/dist/modal/components/{AddFunds → flows/account/AddFunds}/MoonPayEmbed.js

@@ -1,5 +1,5 @@
 "use client";
-import "../../../chunk-MMUBH76A.js";
+import "../../../../../chunk-MMUBH76A.js";
 import { MoonPayEmbed } from "@getpara/react-common";
 var MoonPayEmbed_default = MoonPayEmbed;
 export {

package/dist/modal/components/flows/account/AddFunds/utils.d.ts

@@ -0,0 +1,3 @@
+import { EnabledFlow } from '@getpara/web-sdk';
+import { AccountView } from '../AccountProvider/AccountContext.js';
+export declare function getAddFundsStep(currentTab: EnabledFlow): AccountView;

package/dist/modal/components/flows/account/AddFunds/utils.js

@@ -0,0 +1,16 @@
+"use client";
+import "../../../../../chunk-MMUBH76A.js";
+function getAddFundsStep(currentTab) {
+  switch (currentTab) {
+    case "BUY":
+      return "ACCOUNT_ADD_FUNDS_BUY";
+    case "RECEIVE":
+      return "ACCOUNT_ADD_FUNDS_RECEIVE";
+    case "WITHDRAW":
+    default:
+      return "ACCOUNT_ADD_FUNDS_WITHDRAW";
+  }
+}
+export {
+  getAddFundsStep
+};

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

@@ -1,12 +1,11 @@
 "use client";
 import {
   __async
-} from "../../../chunk-MMUBH76A.js";
+} from "../../../../../chunk-MMUBH76A.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { CpslButton, CpslIcon, CpslQrCode, CpslSpinner, CpslText } from "@getpara/react-components";
-import { HeroAccountTypeIcon, InnerStepContainer, QRContainer, StepContainer } from "../common.js";
+import { HeroAccountTypeIcon, InnerStepContainer, QRContainer, StepContainer } from "../../../common.js";
 import { useEffect, useMemo } from "react";
-import { useModalStore } from "../../stores/index.js";
 import {
   HeroSpinner,
   safeStyled,
@@ -14,13 +13,12 @@ import {
   useCopyToClipboard,
   openMobileUrl
 } from "@getpara/react-common";
-import { ModalStep } from "../../utils/steps.js";
-import { useExternalWallets } from "../../../provider/providers/ExternalWalletProvider.js";
+import { useExternalWallets } from "../../../../../provider/providers/ExternalWalletProvider.js";
+import { useStore } from "../../../../../provider/stores/useStore.js";
 const ChainSwitch = () => {
   const [isCopied, copy] = useCopyToClipboard();
-  const externalWalletError = useModalStore((state) => state.externalWalletError);
-  const setStep = useModalStore((state) => state.setStep);
-  const setStepDirection = useModalStore((state) => state.setStepDirection);
+  const externalWalletError = useStore((state) => state.externalWalletError);
+  const setAccountView = useStore((state) => state.setAccountView);
   const { switchChain, wallet, qrUri, chainIdSwitchingTo, walletDisplayHelpers } = useExternalWallets();
   useEffect(() => {
     if ((wallet == null ? void 0 : wallet.type) === "COSMOS") {
@@ -29,8 +27,7 @@ const ChainSwitch = () => {
   }, [qrUri, wallet]);
   useEffect(() => {
     if (!wallet) {
-      setStepDirection(-1);
-      setStep(ModalStep.ACCOUNT_MAIN);
+      setAccountView("ACCOUNT_MAIN");
     }
   }, [wallet]);
   const handleTryAgainClick = () => __async(void 0, null, function* () {

package/dist/modal/components/{ChainSwitch → flows/account/ChainSwitch}/config.js

@@ -1,5 +1,5 @@
 "use client";
-import "../../../chunk-MMUBH76A.js";
+import "../../../../../chunk-MMUBH76A.js";
 var TabValue = /* @__PURE__ */ ((TabValue2) => {
   TabValue2["extension"] = "extension";
   TabValue2["mobile"] = "mobile";

package/dist/modal/components/{Account → flows/account/Profile}/AccountMonitorTx.js

@@ -1,24 +1,24 @@
 "use client";
 import {
   __async
-} from "../../../chunk-MMUBH76A.js";
+} from "../../../../../chunk-MMUBH76A.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useMemo, useState } from "react";
-import { useModalStore, useModalSessionStore } from "../../stores/index.js";
-import { ModalStep } from "../../utils/steps.js";
-import { StepContainer, InnerStepContainer, Heading, HeroIcon, SpinnerContainer, ExplorerLink } from "../common.js";
+import { useModalSessionStore } from "../../../../stores/index.js";
+import { StepContainer, InnerStepContainer, Heading, HeroIcon, SpinnerContainer, ExplorerLink } from "../../../common.js";
 import { CpslButton, CpslSpinner, CpslText } from "@getpara/react-components";
-import { useInternalClient } from "../../../provider/hooks/utils/useInternalClient.js";
-import { useSendMutations } from "../../hooks/index.js";
-import { useWalletState } from "../../../provider/index.js";
+import { useInternalClient } from "../../../../../provider/hooks/utils/useInternalClient.js";
+import { useSendMutations } from "../../../../hooks/index.js";
+import { useWalletState } from "../../../../../provider/index.js";
 import { formatAssetQuantity } from "@getpara/shared";
 import { truncateAddress } from "@getpara/web-sdk";
 import { AnimatePresence, motion } from "framer-motion";
 import { safeStyled } from "@getpara/react-common";
-import { ErrorBoundary } from "../ErrorBoundary.js";
+import { ErrorBoundary } from "../../../ErrorBoundary.js";
+import { useStore } from "../../../../../provider/stores/useStore.js";
 const ErrorFallback = () => {
   var _a;
-  const setStep = useModalStore((state) => state.setStep);
+  const setAccountView = useStore((state) => state.setAccountView);
   const sendTx = useModalSessionStore((state) => state.sendTx);
   return /* @__PURE__ */ jsxs(StepContainer, { children: [
     /* @__PURE__ */ jsx(HeroIcon, { icon: "alertTriangle" }),
@@ -32,7 +32,7 @@ const ErrorFallback = () => {
       {
         fullWidth: true,
         onClick: () => {
-          setStep(ModalStep.ACCOUNT_MAIN);
+          setAccountView("ACCOUNT_MAIN");
         },
         children: "Go Back"
       }
@@ -46,7 +46,7 @@ const AccountMonitorTxContent = () => {
   var _a, _b, _c, _d, _e, _f;
   const sendTx = useModalSessionStore((state) => state.sendTx);
   const setSendTx = useModalSessionStore((state) => state.setSendTx);
-  const setStep = useModalStore((state) => state.setStep);
+  const setAccountView = useStore((state) => state.setAccountView);
   const para = useInternalClient();
   const { selectedWallet, setSelectedWallet } = useWalletState();
   const [isRetrying, setIsRetrying] = useState(false);
@@ -61,9 +61,9 @@ const AccountMonitorTxContent = () => {
   useEffect(() => {
     var _a2;
     if (!((_a2 = sendTx == null ? void 0 : sendTx.result) == null ? void 0 : _a2.status)) {
-      setStep(ModalStep.ACCOUNT_MAIN);
+      setAccountView("ACCOUNT_MAIN");
     }
-  }, [sendTx, setStep]);
+  }, [sendTx, setAccountView]);
   const { estimateMutateAsync, broadcastMutateAsync } = useSendMutations({
     estimateOnSuccess: () => {
     },

package/dist/modal/components/flows/account/Profile/FarcasterLink.d.ts

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

package/dist/modal/components/{OAuth → flows/account/Profile}/FarcasterLink.js

@@ -1,12 +1,12 @@
 "use client";
-import "../../../chunk-MMUBH76A.js";
+import "../../../../../chunk-MMUBH76A.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { CpslButton, CpslIcon, CpslQrCode, CpslSpinner, CpslText } from "@getpara/react-components";
-import { CenteredText, Heading, InnerStepContainer, QRContainer, StepContainer } from "../common.js";
-import { useModalStore } from "../../stores/index.js";
+import { CenteredText, Heading, InnerStepContainer, QRContainer, StepContainer } from "../../../common.js";
 import { isMobile } from "@getpara/web-sdk";
-function FarcasterConnectQR() {
-  const farcasterConnectUri = useModalStore((state) => state.farcasterConnectUri);
+import { useStore } from "../../../../../provider/stores/useStore.js";
+const FarcasterConnectQR = () => {
+  const farcasterConnectUri = useStore((state) => state.farcasterConnectUri);
   return /* @__PURE__ */ jsx(Fragment, { children: isMobile() ? /* @__PURE__ */ jsxs(InnerStepContainer, { children: [
     /* @__PURE__ */ jsx(CpslText, { weight: "medium", color: "secondary", children: `Don\u2019t have Farcaster` }),
     /* @__PURE__ */ jsxs(CpslButton, { as: "a", href: "https://link.warpcast.com/download-qr", target: "_blank", variant: "secondary", children: [
@@ -20,7 +20,7 @@ function FarcasterConnectQR() {
       /* @__PURE__ */ jsx(QRContainer, { children: !farcasterConnectUri ? /* @__PURE__ */ jsx(CpslSpinner, { size: 100 }) : /* @__PURE__ */ jsx(CpslQrCode, { url: farcasterConnectUri }) })
     ] })
   ] }) });
-}
+};
 const FarcasterLink = () => {
   return /* @__PURE__ */ jsx(StepContainer, { $wide: true, children: /* @__PURE__ */ jsx(FarcasterConnectQR, {}) });
 };

package/dist/modal/components/{Account/AccountProfile.d.ts → flows/account/Profile/Profile.d.ts}

@@ -1,4 +1,4 @@
-export declare const AccountProfile: ({ isDisconnecting, onDisconnect, }: {
+export declare const Profile: ({ isDisconnecting, onDisconnect }: {
     isDisconnecting: boolean;
     onDisconnect: () => void;
 }) => import("react/jsx-runtime").JSX.Element;

package/dist/modal/components/{Account/AccountProfile.js → flows/account/Profile/Profile.js}

@@ -2,26 +2,21 @@
 import {
   __spreadProps,
   __spreadValues
-} from "../../../chunk-MMUBH76A.js";
+} from "../../../../../chunk-MMUBH76A.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { GradientScroll, StepContainer } from "../common.js";
+import { GradientScroll, StepContainer } from "../../../common.js";
 import { CpslButton, CpslIcon, CpslText } from "@getpara/react-components";
-import { useAccount } from "../../../provider/index.js";
-import { useLinkedAccounts } from "../../../provider/hooks/index.js";
-import { useAccountLinking } from "../../../provider/providers/AccountLinkProvider.js";
+import { useAccount } from "../../../../../provider/index.js";
+import { useLinkedAccounts } from "../../../../../provider/hooks/index.js";
+import { useAccountLinking } from "../../../../../provider/providers/AccountLinkProvider.js";
 import { useEffect, useMemo } from "react";
 import { safeStyled } from "@getpara/react-common";
-import { useStore } from "../../../provider/stores/useStore.js";
-import { useAuthActions } from "../../../provider/providers/AuthProvider.js";
-import { useModalStore } from "../../stores/index.js";
-import { ModalStep } from "../../utils/steps.js";
-import { useInternalClient } from "../../../provider/hooks/utils/useInternalClient.js";
-import { Waiting } from "../Waiting/Waiting.js";
-import { AccountLinkEntry, WalletEntry } from "./AccountProfileEntry.js";
-const AccountProfile = ({
-  isDisconnecting,
-  onDisconnect
-}) => {
+import { useStore } from "../../../../../provider/stores/useStore.js";
+import { useInternalClient } from "../../../../../provider/hooks/utils/useInternalClient.js";
+import { Waiting } from "../../../Waiting/Waiting.js";
+import { AccountLinkEntry, WalletEntry } from "./ProfileEntry.js";
+import { useAccountActions } from "../AccountProvider/AccountProvider.js";
+const Profile = ({ isDisconnecting, onDisconnect }) => {
   const para = useInternalClient();
   const { embedded } = useAccount();
   const { data: linkedAccounts } = useLinkedAccounts();
@@ -30,8 +25,9 @@ const AccountProfile = ({
     var _a;
     return (_a = state.modalConfig) == null ? void 0 : _a.hideWallets;
   });
-  const { switchWallets, switchWalletsUrl, setSwitchWalletsUrl, isSwitchWalletsPending } = useAuthActions();
-  const setStep = useModalStore((state) => state.setStep);
+  const { switchWallets, switchWalletsUrl, setSwitchWalletsUrl, isSwitchWalletsPending } = useAccountActions();
+  const setAccountView = useStore((state) => state.setAccountView);
+  const isGuestMode = embedded.isGuestMode;
   const partnerGroups = useMemo(() => {
     var _a;
     return (_a = embedded == null ? void 0 : embedded.wallets) == null ? void 0 : _a.reduce((acc, wallet) => {
@@ -46,13 +42,13 @@ const AccountProfile = ({
     }, []);
   }, [embedded == null ? void 0 : embedded.wallets]);
   useEffect(() => {
-    if (para) {
+    if (para && isGuestMode === false) {
       para.getSwitchWalletsUrl().then((url) => {
         setSwitchWalletsUrl(url);
       });
     }
-  }, []);
-  if (!para || !switchWalletsUrl) {
+  }, [isGuestMode]);
+  if (!para || !switchWalletsUrl && !isGuestMode) {
     return /* @__PURE__ */ jsx(Waiting, {});
   }
   return /* @__PURE__ */ jsxs(StepContainer, { children: [
@@ -66,7 +62,7 @@ const AccountProfile = ({
           /* @__PURE__ */ jsx(Content, { children: wallets.map((wallet) => /* @__PURE__ */ jsx(WalletEntry, { wallet, isSelectable: true }, `${wallet.address}-${wallet.type}`)) })
         ] }, partner.id);
       }),
-      !embedded.isGuestMode && /* @__PURE__ */ jsx(
+      !isGuestMode && /* @__PURE__ */ jsx(
         CpslButton,
         {
           fullWidth: true,
@@ -93,7 +89,7 @@ const AccountProfile = ({
             fullWidth: true,
             variant: "tertiary",
             onClick: () => {
-              setStep(ModalStep.ADD_EX_WALLET_MORE);
+              setAccountView("ACCOUNT_ADD_EX_WALLET_MORE");
             },
             "data-testid": "para-add-wallet",
             children: [
@@ -161,5 +157,5 @@ const DisconnectButton = safeStyled(CpslButton)`
   --button-destructive-active-background-color: rgba(255, 0, 0, 0.1);
 `;
 export {
-  AccountProfile
+  Profile
 };

package/dist/modal/components/{Account/AccountProfileEntry.js → flows/account/Profile/ProfileEntry.js}

@@ -2,7 +2,7 @@
 import {
   __spreadProps,
   __spreadValues
-} from "../../../chunk-MMUBH76A.js";
+} from "../../../../../chunk-MMUBH76A.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useMemo } from "react";
 import { ACCOUNT_TYPES, safeStyled, useCopyToClipboard, WalletTypeIcon } from "@getpara/react-common";
@@ -12,15 +12,13 @@ import {
   formatCurrency,
   truncateAddress
 } from "@getpara/web-sdk";
-import { useStore } from "../../../provider/stores/useStore.js";
-import { useModalStore } from "../../stores/index.js";
-import { useAssets } from "../../../provider/providers/AssetsProvider.js";
-import { ModalStep } from "../../utils/steps.js";
-import { AccountTypeIcon } from "../common.js";
-import { useExternalWallets } from "../../../provider/providers/ExternalWalletProvider.js";
-import { useAccountLinking } from "../../../provider/providers/AccountLinkProvider.js";
-import { useInternalClient } from "../../../provider/hooks/utils/useInternalClient.js";
-const AccountProfileEntry = ({
+import { useStore } from "../../../../../provider/stores/useStore.js";
+import { useAssets } from "../../../../../provider/providers/AssetsProvider.js";
+import { AccountTypeIcon } from "../../../common.js";
+import { useExternalWallets } from "../../../../../provider/providers/ExternalWalletProvider.js";
+import { useAccountLinking } from "../../../../../provider/providers/AccountLinkProvider.js";
+import { useInternalClient } from "../../../../../provider/hooks/utils/useInternalClient.js";
+const ProfileEntry = ({
   icon,
   text,
   textSecondary,
@@ -71,8 +69,8 @@ const WalletEntry = ({
     var _a2;
     return (_a2 = state.modalConfig) == null ? void 0 : _a2.balances;
   });
-  const setProfileWallet = useModalStore((state) => state.setProfileWallet);
-  const setStep = useModalStore((state) => state.setStep);
+  const setProfileWallet = useStore((state) => state.setProfileWallet);
+  const setAccountView = useStore((state) => state.setAccountView);
   const walletBalance = useMemo(() => {
     return profileBalance == null ? void 0 : profileBalance.wallets.find((w) => w.address === wallet.address);
   }, [profileBalance, wallet.address]);
@@ -97,7 +95,7 @@ const WalletEntry = ({
     }
   }, [balancesConfig, walletBalance]);
   return /* @__PURE__ */ jsx(
-    AccountProfileEntry,
+    ProfileEntry,
     {
       icon: /* @__PURE__ */ jsx(
         WalletTypeIcon,
@@ -116,7 +114,7 @@ const WalletEntry = ({
       className,
       onSelect: isSelectable ? () => {
         setProfileWallet(wallet);
-        setStep(ModalStep.ACCOUNT_WALLET);
+        setAccountView("ACCOUNT_WALLET");
       } : void 0,
       dataTestId: `wallet-entry-${wallet.type}-${wallet.address}`
     },
@@ -159,7 +157,7 @@ const AccountLinkEntry = ({
     }
   }
   return /* @__PURE__ */ jsx(
-    AccountProfileEntry,
+    ProfileEntry,
     {
       icon: /* @__PURE__ */ jsx(AccountTypeIcon, { accountType, src, size: "24px" }),
       text: externalWallet ? (_d = (_c = (_b = externalWallet.ensName) != null ? _b : externalWalletConnector == null ? void 0 : externalWalletConnector.name) != null ? _c : externalWallet.provider) != null ? _d : "" : displayName != null ? displayName : identifier,

package/dist/modal/components/flows/account/Profile/ProfileLink.d.ts

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

package/dist/modal/components/{Account/AccountProfileLink.js → flows/account/Profile/ProfileLink.js}

@@ -1,24 +1,24 @@
 "use client";
 import {
   __async
-} from "../../../chunk-MMUBH76A.js";
+} from "../../../../../chunk-MMUBH76A.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { HeroSpinner } from "@getpara/react-common";
 import { CpslButton, CpslIcon } from "@getpara/react-components";
 import { useEffect, useMemo } from "react";
-import { HeroAccountTypeIcon, HeroSuccessIcon } from "../common.js";
-import { VerificationCode } from "../VerificationCodeStep/VerificationCodeStep.js";
+import { HeroAccountTypeIcon, HeroSuccessIcon } from "../../../common.js";
 import { extractAuthInfo } from "@getpara/user-management-client";
-import { FarcasterLink } from "../OAuth/FarcasterLink.js";
-import { useTelegramLogin } from "../../hooks/useTelegramLogin.js";
-import { TelegramIFrame } from "../OAuth/TelegramOAuthStep.js";
-import { AuthInput } from "../AuthInput/AuthInput.js";
-import { useAccountLinking } from "../../../provider/providers/AccountLinkProvider.js";
-import { useWalletDisplayHelpers, useExternalWallets } from "../../../provider/providers/ExternalWalletProvider.js";
-import { ExternalWalletMobileConnect } from "../ExternalWalletStep/ExternalWalletStep.js";
-import { useResendVerificationCode } from "../../../provider/index.js";
+import { FarcasterLink } from "./FarcasterLink.js";
+import { useTelegramLink } from "./useTelegramLink.js";
+import { useAccountLinking } from "../../../../../provider/providers/AccountLinkProvider.js";
+import { useWalletDisplayHelpers, useExternalWallets } from "../../../../../provider/providers/ExternalWalletProvider.js";
+import { useResendVerificationCode } from "../../../../../provider/index.js";
 import { AccountLinkError } from "@getpara/web-sdk";
-function AccountProfileLink() {
+import { VerificationCode } from "../../../shared/VerificationCode.js";
+import { EmailOrPhoneInput } from "../../../shared/EmailOrPhone/EmailOrPhoneInput.js";
+import { IFrame } from "../../../shared/IFrame.js";
+import { ExternalWalletMobileConnect } from "../../../shared/ConnectExternalWallet/ConnectExternalWallet.js";
+const ProfileLink = () => {
   var _a, _b, _c, _d;
   const {
     accountLinkInProgress,
@@ -29,13 +29,8 @@ function AccountProfileLink() {
     linkAccount,
     isLinkAccountPending,
     resetMutations
-  } = useAccountLinking(), { wallets } = useExternalWallets(), { resendVerificationCode } = useResendVerificationCode(), accountLinkType = accountLinkInProgress == null ? void 0 : accountLinkInProgress.type, externalWalletProvider = (_b = accountLinkInProgress == null ? void 0 : accountLinkInProgress.pendingWalletProvider) != null ? _b : (_a = accountLinkInProgress == null ? void 0 : accountLinkInProgress.externalWallet) == null ? void 0 : _a.providerId, externalWalletType = (_d = accountLinkInProgress == null ? void 0 : accountLinkInProgress.pendingWalletType) != null ? _d : (_c = accountLinkInProgress == null ? void 0 : accountLinkInProgress.externalWallet) == null ? void 0 : _c.type, externalWallet = wallets.find((w) => w.id === externalWalletProvider), isTelegram = accountLinkType === "TELEGRAM", {
-    url,
-    status: telegramStatus,
-    isLoaded,
-    setIsLoaded
-  } = useTelegramLogin(
-    isTelegram ? { isActive: isTelegram, status: linkAccountStatus, onSubmit: verifyTelegramLink, isLinking: true } : { isActive: false, isLinking: true }
+  } = useAccountLinking(), { wallets } = useExternalWallets(), { resendVerificationCode } = useResendVerificationCode(), accountLinkType = accountLinkInProgress == null ? void 0 : accountLinkInProgress.type, externalWalletProvider = (_b = accountLinkInProgress == null ? void 0 : accountLinkInProgress.pendingWalletProvider) != null ? _b : (_a = accountLinkInProgress == null ? void 0 : accountLinkInProgress.externalWallet) == null ? void 0 : _a.providerId, externalWalletType = (_d = accountLinkInProgress == null ? void 0 : accountLinkInProgress.pendingWalletType) != null ? _d : (_c = accountLinkInProgress == null ? void 0 : accountLinkInProgress.externalWallet) == null ? void 0 : _c.type, externalWallet = wallets.find((w) => w.id === externalWalletProvider), isTelegram = accountLinkType === "TELEGRAM", { status: telegramStatus } = useTelegramLink(
+    isTelegram ? { isActive: isTelegram, status: linkAccountStatus, onSubmit: verifyTelegramLink } : { isActive: false }
   ), status = (accountLinkInProgress == null ? void 0 : accountLinkInProgress.isComplete) ? "success" : isTelegram ? telegramStatus : linkAccountStatus, commonWallet = useMemo(() => {
     const wallet = wallets.find(
       (w) => [w.name, w.internalId, w.id].includes(externalWalletProvider != null ? externalWalletProvider : "") && w.type === externalWalletType
@@ -92,7 +87,7 @@ function AccountProfileLink() {
       case (!accountLinkInProgress.identifier && (accountLinkInProgress.type === "EMAIL" || accountLinkInProgress.type === "PHONE")):
         upper2 = heroSpinner;
         lower2 = /* @__PURE__ */ jsx(
-          AuthInput,
+          EmailOrPhoneInput,
           {
             disableEmailLogin: accountLinkInProgress.type !== "EMAIL",
             disablePhoneLogin: accountLinkInProgress.type !== "PHONE",
@@ -154,7 +149,7 @@ function AccountProfileLink() {
                   {
                     wallet: commonWallet,
                     isSelfFetching: true,
-                    onConnectWc: (w) => __async(this, null, function* () {
+                    onConnectWc: (w) => __async(void 0, null, function* () {
                       yield linkAccount({ externalWallet: { provider: w.id, type: w.type } });
                     })
                   }
@@ -164,15 +159,7 @@ function AccountProfileLink() {
             }
             break;
           case accountLinkType === "TELEGRAM":
-            lower2 = /* @__PURE__ */ jsx(
-              TelegramIFrame,
-              {
-                url,
-                isLoaded,
-                setIsLoaded,
-                isVisible: status === "error" || status === "idle"
-              }
-            );
+            lower2 = /* @__PURE__ */ jsx(IFrame, {});
             break;
           case (status === "error" && !!accountLinkInProgress):
             lower2 = tryAgain;
@@ -189,8 +176,6 @@ function AccountProfileLink() {
     accountLinkType,
     accountLinkInProgress,
     telegramStatus,
-    url,
-    isLoaded,
     linkAccount,
     status,
     isTelegram,
@@ -207,7 +192,7 @@ function AccountProfileLink() {
     upper,
     lower
   ] });
-}
+};
 export {
-  AccountProfileLink
+  ProfileLink
 };

package/dist/modal/components/flows/account/Profile/ProfileLinkOptions.d.ts

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