@vechain/vechain-kit 1.3.1 → 1.4.1

package/dist/index.cjs

@@ -4,7 +4,7 @@ var chunkNKGOARGM_cjs = require('./chunk-NKGOARGM.cjs');
 var chunkEO3CLT4E_cjs = require('./chunk-EO3CLT4E.cjs');
 var chunkX4PAU76A_cjs = require('./chunk-X4PAU76A.cjs');
 require('./chunk-Q7SFCCGT.cjs');
-var React9 = require('react');
+var React8 = require('react');
 var reactAuth = require('@privy-io/react-auth');
 var dappKitReact = require('@vechain/dapp-kit-react');
 var viem = require('viem');
@@ -31,13 +31,15 @@ var hi2 = require('react-icons/hi2');
 var ci = require('react-icons/ci');
 var lu = require('react-icons/lu');
 var md = require('react-icons/md');
-var bi = require('react-icons/bi');
-var ri = require('react-icons/ri');
 var vsc = require('react-icons/vsc');
 var fa = require('react-icons/fa');
 var fi = require('react-icons/fi');
-var gi = require('react-icons/gi');
+var picasso = require('@vechain/picasso');
+var gr = require('react-icons/gr');
+var ri = require('react-icons/ri');
+var bi = require('react-icons/bi');
 var pi = require('react-icons/pi');
+var gi = require('react-icons/gi');
 var reactQrcodeLogo = require('react-qrcode-logo');
 var go = require('react-icons/go');
 var fa6 = require('react-icons/fa6');
@@ -48,7 +50,7 @@ var anatomy = require('@chakra-ui/anatomy');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
-var React9__default = /*#__PURE__*/_interopDefault(React9);
+var React8__default = /*#__PURE__*/_interopDefault(React8);
 var imageCompression__default = /*#__PURE__*/_interopDefault(imageCompression);
 var i18n__default = /*#__PURE__*/_interopDefault(i18n);
 
@@ -520,10 +522,10 @@ var pollForReceipt = async (thor, id, blocksTimeout = 5) => {
 };
 var useTxReceipt = (txId, blockTimeout) => {
   const { thor } = dappKitReact.useConnex();
-  const [receipt, setReceipt] = React9.useState();
-  const [error, setError] = React9.useState(null);
-  const [isLoading, setIsLoading] = React9.useState(false);
-  React9.useEffect(() => {
+  const [receipt, setReceipt] = React8.useState();
+  const [error, setError] = React8.useState(null);
+  const [isLoading, setIsLoading] = React8.useState(false);
+  React8.useEffect(() => {
     const fetchReceipt = async () => {
       if (!txId) {
         setReceipt(null);
@@ -719,7 +721,7 @@ var useXApps = () => {
 // src/hooks/api/vebetterdao/xApps/hooks/useXApp.ts
 var useXApp = (appId) => {
   const { data: xApps, ...props } = useXApps();
-  const allApps = React9.useMemo(() => [...xApps?.active ?? [], ...xApps?.unendorsed ?? []], [xApps]);
+  const allApps = React8.useMemo(() => [...xApps?.active ?? [], ...xApps?.unendorsed ?? []], [xApps]);
   const app = allApps.find((xa) => xa.id === appId);
   return {
     data: app,
@@ -865,7 +867,7 @@ var useUserVotesInAllRounds = (address) => {
 var useUserTopVotedApps = (user) => {
   const userRoundVotes = useUserVotesInAllRounds(user);
   const { data: xApps } = useXApps();
-  const topVotedAppIds = React9.useMemo(() => {
+  const topVotedAppIds = React8.useMemo(() => {
     const appIdToVotes = {};
     userRoundVotes.data?.forEach((voteEvent) => {
       const appIds = voteEvent.appsIds;
@@ -881,7 +883,7 @@ var useUserTopVotedApps = (user) => {
     });
     return Object.entries(appIdToVotes).sort(([, aVotes], [, bVotes]) => Number(bVotes) - Number(aVotes)).map(([appId, votes]) => ({ appId, votes }));
   }, [userRoundVotes]);
-  const topVotedApps = React9.useMemo(() => {
+  const topVotedApps = React8.useMemo(() => {
     return topVotedAppIds.map((app) => {
       const appFound = xApps?.allApps.find(
         (xApp) => xApp.id === app.appId
@@ -941,7 +943,7 @@ var useMostVotedAppsInRound = (roundId) => {
     apps?.map((app) => app.id) ?? [],
     roundId
   );
-  const mostVotedApps = React9.useMemo(
+  const mostVotedApps = React8.useMemo(
     () => xAppsShares.data?.map((appShares) => ({
       percentage: appShares.share + appShares.unallocatedShare,
       id: apps?.find((xa) => xa.id === appShares.app)?.id ?? "",
@@ -1160,20 +1162,20 @@ var compressImages = async (images) => {
   }
 };
 var useUploadImages = ({ compressImages: compressImages2, defaultImages }) => {
-  const [uploadedImages, setUploadedImages] = React9.useState(
+  const [uploadedImages, setUploadedImages] = React8.useState(
     defaultImages ?? []
   );
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     if (defaultImages) {
       setUploadedImages(defaultImages);
     }
   }, [defaultImages]);
-  const [invalidDateError, setInvalidDateError] = React9.useState([]);
-  const onRemove = React9.useCallback(
+  const [invalidDateError, setInvalidDateError] = React8.useState([]);
+  const onRemove = React8.useCallback(
     (index) => setUploadedImages((s) => s.filter((_, i) => i !== index)),
     []
   );
-  const onUpload = React9.useCallback(
+  const onUpload = React8.useCallback(
     async (acceptedFiles, keepCurrent = true) => {
       setInvalidDateError([]);
       const parsedUploads = [];
@@ -1214,14 +1216,14 @@ var useSingleImageUpload = ({
   compressImage,
   defaultImage
 }) => {
-  const [uploadedImage, setUploadedImage] = React9.useState(defaultImage);
-  React9.useEffect(() => {
+  const [uploadedImage, setUploadedImage] = React8.useState(defaultImage);
+  React8.useEffect(() => {
     if (defaultImage) {
       setUploadedImage(defaultImage);
     }
   }, [defaultImage]);
-  const onRemove = React9.useCallback(() => setUploadedImage(void 0), []);
-  const onUpload = React9.useCallback(
+  const onRemove = React8.useCallback(() => setUploadedImage(void 0), []);
+  const onUpload = React8.useCallback(
     async (acceptedFile) => {
       let parsedFile = acceptedFile;
       if (compressImage) {
@@ -1696,7 +1698,7 @@ var useAllocationsRound = (roundId) => {
   const currentAllocationState = useAllocationsRoundState(roundId);
   const allocationRoundsEvents = useAllocationsRoundsEvents();
   const { network } = useVeChainKitConfig();
-  const currentAllocationRound = React9.useMemo(() => {
+  const currentAllocationRound = React8.useMemo(() => {
     if (!currentAllocationId.data || !allocationRoundsEvents.data)
       return;
     const roundInfo = allocationRoundsEvents.data.created.find(
@@ -1718,7 +1720,7 @@ var useAllocationsRound = (roundId) => {
   const isError = currentAllocationId.isError || allocationRoundsEvents.isError || currentAllocationState.isError;
   const error = currentAllocationId.error || allocationRoundsEvents.error || currentAllocationState.error;
   const blockTime = chunkEO3CLT4E_cjs.getConfig(network.type).network.blockTime;
-  const estimatedEndTime = React9.useMemo(() => {
+  const estimatedEndTime = React8.useMemo(() => {
     if (!currentAllocationRound) return null;
     const endBlock = Number(currentAllocationRound.voteEnd);
     if (!endBlock || !currentBlock) return null;
@@ -1726,7 +1728,7 @@ var useAllocationsRound = (roundId) => {
     const durationLeftTimestamp = endBlockFromNow * blockTime;
     return Date.now() + durationLeftTimestamp;
   }, [currentBlock, currentAllocationRound, blockTime]);
-  const estimatedStartTime = React9.useMemo(() => {
+  const estimatedStartTime = React8.useMemo(() => {
     if (!currentAllocationRound) return null;
     const startBlock = Number(currentAllocationRound.voteStart);
     if (!startBlock || !currentBlock) return null;
@@ -1783,7 +1785,7 @@ function getOrCreateQueryClient() {
 }
 var EnsureQueryClient = ({ children }) => {
   try {
-    const existingQueryClient = React9__default.default.useContext(reactQuery.QueryClientContext);
+    const existingQueryClient = React8__default.default.useContext(reactQuery.QueryClientContext);
     if (existingQueryClient) {
       return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
     }
@@ -2165,7 +2167,7 @@ var useIsWhitelisted = (address) => {
 var useUserStatus = (address) => {
   const { data: isBlacklisted } = useIsBlacklisted(address);
   const { data: isWhitelisted } = useIsWhitelisted(address);
-  const userStatus = React9.useMemo(() => {
+  const userStatus = React8.useMemo(() => {
     if (!isBlacklisted && !isWhitelisted) {
       return "NONE" /* NONE */;
     }
@@ -2439,7 +2441,7 @@ var useAccountLinking = (user) => {
   const isPassport = !isEntity && userLinkedEntities?.length > 0;
   const { data: entityPassport, isLoading: isEntityPassportLoading } = useGetPassportForEntity(!!isEntity ? user : void 0);
   const isLinked = !!isPassport || !!isEntity;
-  const passport = React9.useMemo(() => {
+  const passport = React8.useMemo(() => {
     if (isEntity) return entityPassport ?? void 0;
     if (isPassport) return user;
     return void 0;
@@ -2576,7 +2578,7 @@ var useVotingRewards = (currentRoundId, voter) => {
   const queryClient = reactQuery.useQueryClient();
   const { network } = useVeChainKitConfig();
   const contractAddress = chunkEO3CLT4E_cjs.getConfig(network.type).voterRewardsContractAddress;
-  const rounds = React9.useMemo(() => {
+  const rounds = React8.useMemo(() => {
     return Array.from(
       { length: parseInt(currentRoundId ?? "0") - 1 },
       (_, i) => (i + 1).toString()
@@ -2846,7 +2848,7 @@ var useClaimVeWorldSubdomain = ({
   const queryClient = reactQuery.useQueryClient();
   const { account } = useWallet();
   const { network } = useVeChainKitConfig();
-  const buildClauses = React9.useCallback(async () => {
+  const buildClauses = React8.useCallback(async () => {
     if (!subdomain) throw new Error("Invalid subdomain");
     const clausesArray = [];
     clausesArray.push({
@@ -2887,7 +2889,7 @@ var useClaimVeWorldSubdomain = ({
     });
     return clausesArray;
   }, [subdomain, domain, account?.address, alreadyOwned]);
-  const handleOnSuccess = React9.useCallback(async () => {
+  const handleOnSuccess = React8.useCallback(async () => {
     queryClient.cancelQueries({
       queryKey: getVechainDomainQueryKey(account?.address ?? ""),
       refetchType: "none"
@@ -3141,7 +3143,7 @@ var useSendTransaction = ({
     }
     return parsedClauses;
   }
-  const sendTransaction = React9.useCallback(
+  const sendTransaction = React8.useCallback(
     async (clauses2, options) => {
       if (connection.isConnectedWithSocialLogin || connection.isConnectedWithCrossApp) {
         return await privyWalletProvider.sendTransaction({
@@ -3185,13 +3187,13 @@ var useSendTransaction = ({
       privyUIOptions
     ]
   );
-  const [sendTransactionTx, setSendTransactionTx] = React9.useState(
+  const [sendTransactionTx, setSendTransactionTx] = React8.useState(
     null
   );
-  const [sendTransactionPending, setSendTransactionPending] = React9.useState(false);
-  const [sendTransactionError, setSendTransactionError] = React9.useState(null);
-  const [progress, setProgress] = React9.useState();
-  const sendTransactionAdapter = React9.useCallback(
+  const [sendTransactionPending, setSendTransactionPending] = React8.useState(false);
+  const [sendTransactionError, setSendTransactionError] = React8.useState(null);
+  const [progress, setProgress] = React8.useState();
+  const sendTransactionAdapter = React8.useCallback(
     async (_clauses) => {
       if (!_clauses && !clauses) throw new Error("clauses are required");
       try {
@@ -3228,7 +3230,7 @@ var useSendTransaction = ({
     isLoading: isTxReceiptLoading,
     error: txReceiptError
   } = useTxReceipt(sendTransactionTx ?? "");
-  const explainTxRevertReason = React9.useCallback(
+  const explainTxRevertReason = React8.useCallback(
     async (txReceipt2) => {
       if (!txReceipt2.reverted) return;
       const transactionData = await thor.transaction(txReceipt2.meta.txID).get();
@@ -3237,8 +3239,8 @@ var useSendTransaction = ({
     },
     [thor]
   );
-  const [error, setError] = React9.useState();
-  const status = React9.useMemo(() => {
+  const [error, setError] = React8.useState();
+  const status = React8.useMemo(() => {
     if (sendTransactionPending) return "pending";
     if (sendTransactionError) {
       return "error";
@@ -3264,7 +3266,7 @@ var useSendTransaction = ({
     txReceipt,
     txReceiptError
   ]);
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     if (status === "success" || status === "error") {
       if (sendTransactionError && !error) {
         setError({
@@ -3294,13 +3296,13 @@ var useSendTransaction = ({
     explainTxRevertReason,
     sendTransactionError
   ]);
-  const resetStatus = React9.useCallback(() => {
+  const resetStatus = React8.useCallback(() => {
     setSendTransactionTx(null);
     setSendTransactionPending(false);
     setSendTransactionError(null);
     setError(void 0);
   }, []);
-  const isTransactionPending = React9.useMemo(() => {
+  const isTransactionPending = React8.useMemo(() => {
     return sendTransactionPending || isTxReceiptLoading || status === "pending" || status === "waitingConfirmation";
   }, [sendTransactionPending, isTxReceiptLoading, status]);
   return {
@@ -3329,7 +3331,7 @@ var useUpdateAvatarRecord = ({
     onTxConfirmed: onSuccess,
     onTxFailedOrCancelled: onError
   });
-  const updateAvatar = React9.useCallback(
+  const updateAvatar = React8.useCallback(
     async (domain, ipfsUri) => {
       if (!domain) throw new Error("Domain is required");
       const node = ethers.namehash(domain);
@@ -3489,7 +3491,7 @@ var PrivyCrossAppProvider = ({
   privyEcosystemAppIDS,
   children
 }) => {
-  const wagmiConfigRef = React9.useRef(
+  const wagmiConfigRef = React8.useRef(
     wagmi.createConfig({
       chains: [vechain],
       ssr: true,
@@ -3515,9 +3517,9 @@ var usePrivyCrossAppSdk = () => {
   const { signMessageAsync } = wagmi.useSignMessage();
   const { disconnectAsync } = wagmi.useDisconnect();
   const { isConnected } = wagmi.useAccount();
-  const [isConnecting, setIsConnecting] = React9.useState(false);
-  const [connectionError, setConnectionError] = React9.useState(null);
-  const logout = React9.useCallback(async () => {
+  const [isConnecting, setIsConnecting] = React8.useState(false);
+  const [connectionError, setConnectionError] = React8.useState(null);
+  const logout = React8.useCallback(async () => {
     try {
       if (isConnected) {
         await disconnectAsync();
@@ -3528,7 +3530,7 @@ var usePrivyCrossAppSdk = () => {
       throw error;
     }
   }, [disconnectAsync, isConnected]);
-  const login = React9.useCallback(
+  const login = React8.useCallback(
     async (appID) => {
       try {
         setIsConnecting(true);
@@ -3550,7 +3552,7 @@ var usePrivyCrossAppSdk = () => {
     },
     [connectAsync, connectors]
   );
-  const signMessage = React9.useCallback(
+  const signMessage = React8.useCallback(
     async (message) => {
       try {
         return await signMessageAsync({ message });
@@ -3565,7 +3567,7 @@ var usePrivyCrossAppSdk = () => {
     },
     [signMessageAsync]
   );
-  const signTypedData = React9.useCallback(
+  const signTypedData = React8.useCallback(
     async (data) => {
       try {
         return await signTypedDataAsync(data);
@@ -3592,12 +3594,15 @@ var usePrivyCrossAppSdk = () => {
 
 // src/hooks/api/wallet/useWalletMetadata.ts
 var useWalletMetadata = (address, networkType) => {
-  const { data: domain } = useVechainDomain(address ?? "");
-  const { data: avatar } = useGetAvatar(domain?.domain);
+  const { data: domain, isLoading: isLoadingVechainDomain } = useVechainDomain(address ?? "");
+  const { data: avatar, isLoading: isLoadingAvatar } = useGetAvatar(
+    domain?.domain
+  );
   const avatarUrl = chunkEO3CLT4E_cjs.convertUriToUrl(avatar ?? "", networkType);
   return {
     domain: domain?.domain,
-    image: avatarUrl ?? chunkEO3CLT4E_cjs.getPicassoImage(address ?? "")
+    image: avatarUrl ?? chunkEO3CLT4E_cjs.getPicassoImage(address ?? ""),
+    isLoading: isLoadingVechainDomain || isLoadingAvatar
   };
 };
 
@@ -3623,7 +3628,7 @@ var useWallet = () => {
   const isConnectedWithPrivy = isConnectedWithSocialLogin || isConnectedWithCrossApp;
   const isConnectedWithVeChain = isConnectedWithSocialLogin && privy?.appId === chunkEO3CLT4E_cjs.VECHAIN_PRIVY_APP_ID || isConnectedWithCrossApp && connectionCache?.ecosystemApp?.appId === chunkEO3CLT4E_cjs.VECHAIN_PRIVY_APP_ID;
   const isLoading = isConnectingWithCrossApp || isReconnectingWithCrossApp || isLoadingLoginOAuth || !ready;
-  const [isConnected, setIsConnected] = React9.useState(false);
+  const [isConnected, setIsConnected] = React8.useState(false);
   const connectionSource = isConnectedWithCrossApp ? {
     type: "privy-cross-app",
     displayName: "Ecosystem"
@@ -3634,7 +3639,7 @@ var useWallet = () => {
     type: "privy",
     displayName: "Social Login"
   };
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     const isNowConnected = isConnectedWithDappKit || isConnectedWithSocialLogin || isConnectedWithCrossApp;
     if (isConnected !== isNowConnected) {
       setIsConnected(isNowConnected);
@@ -3666,18 +3671,20 @@ var useWallet = () => {
   const account = activeAddress ? {
     address: activeAddress,
     domain: activeMetadata.domain,
-    image: activeMetadata.image
+    image: activeMetadata.image,
+    isLoadingAvatar: activeMetadata.isLoading
   } : null;
   const connectedWallet = connectedWalletAddress ? {
     address: connectedWalletAddress,
     domain: connectedMetadata.domain,
-    image: connectedMetadata.image
+    image: connectedMetadata.image,
+    isLoadingAvatar: connectedMetadata.isLoading
   } : null;
   const { data: smartAccountVersion } = useContractVersion(
     smartAccount?.address ?? ""
   );
   const hasActiveSmartAccount = !!smartAccount?.address && !!account?.address && chunkEO3CLT4E_cjs.compareAddresses(smartAccount?.address, account?.address);
-  const disconnect = React9.useCallback(async () => {
+  const disconnect = React8.useCallback(async () => {
     try {
       setIsConnected(false);
       if (isConnectedWithDappKit) {
@@ -3709,7 +3716,8 @@ var useWallet = () => {
       image: smartAccountMetadata.image,
       isDeployed: smartAccount?.isDeployed ?? false,
       isActive: hasActiveSmartAccount,
-      version: smartAccountVersion ?? null
+      version: smartAccountVersion ?? null,
+      isLoadingAvatar: smartAccountMetadata.isLoading
     },
     connectedWallet,
     privyUser: user,
@@ -4022,7 +4030,7 @@ var useSendTokenModal = () => {
 var SendTokenModalProvider = ({
   children
 }) => /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
-var useEmbeddedWalletSettingsModal = () => {
+var useAccessAndSecurityModal = () => {
   const {
     openAccountModal,
     closeAccountModal,
@@ -4030,7 +4038,7 @@ var useEmbeddedWalletSettingsModal = () => {
     setAccountModalContent
   } = useVeChainKitConfig();
   const open = () => {
-    setAccountModalContent("embedded-wallet");
+    setAccountModalContent("access-and-security");
     openAccountModal();
   };
   const close = () => {
@@ -4042,7 +4050,7 @@ var useEmbeddedWalletSettingsModal = () => {
     isOpen: isAccountModalOpen
   };
 };
-var EmbeddedWalletSettingsModalProvider = ({
+var AccessAndSecurityModalProvider = ({
   children
 }) => /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
 var useExploreEcosystemModal = () => {
@@ -4156,6 +4164,52 @@ var useReceiveModal = () => {
   };
 };
 var ReceiveModalProvider = ({ children }) => /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
+var useLoginModalContent = () => {
+  const { privy, loginMethods } = useVeChainKitConfig();
+  const isVeChainApp = privy?.appId === chunkEO3CLT4E_cjs.VECHAIN_PRIVY_APP_ID;
+  const showEcosystemLogin = React8.useMemo(() => {
+    if (!loginMethods) return true;
+    if (loginMethods.length > 0 && !loginMethods?.find((method35) => method35.method === "ecosystem")) {
+      return false;
+    }
+    return true;
+  }, [loginMethods]);
+  if (!privy) {
+    return {
+      showSocialLogin: false,
+      showPasskey: false,
+      showVeChainLogin: true,
+      showDappKit: true,
+      showEcosystem: showEcosystemLogin,
+      showMoreLogin: false,
+      isOfficialVeChainApp: false
+    };
+  }
+  if (isVeChainApp) {
+    return {
+      showSocialLogin: false,
+      showPasskey: false,
+      showVeChainLogin: true,
+      showDappKit: true,
+      showEcosystem: showEcosystemLogin,
+      showMoreLogin: false,
+      isOfficialVeChainApp: true
+    };
+  }
+  const showMoreLogin = React8.useMemo(() => {
+    if (!loginMethods) return true;
+    return loginMethods.some((method35) => method35.method === "more");
+  }, [loginMethods]);
+  return {
+    showSocialLogin: true,
+    showPasskey: true,
+    showVeChainLogin: true,
+    showDappKit: true,
+    showEcosystem: showEcosystemLogin,
+    showMoreLogin,
+    isOfficialVeChainApp: false
+  };
+};
 var ERC20Interface2 = chunkNKGOARGM_cjs.ERC20__factory.createInterface();
 var useTransferERC20 = ({
   fromAddress,
@@ -4167,7 +4221,7 @@ var useTransferERC20 = ({
 }) => {
   const queryClient = reactQuery.useQueryClient();
   const { refresh } = useRefreshBalances();
-  const buildClauses = React9.useCallback(async () => {
+  const buildClauses = React8.useCallback(async () => {
     if (!receiverAddress || !amount || !chunkEO3CLT4E_cjs.isValidAddress(receiverAddress))
       throw new Error("Invalid receiver address or amount");
     const clausesArray = [];
@@ -4183,7 +4237,7 @@ var useTransferERC20 = ({
     });
     return clausesArray;
   }, [receiverAddress, amount]);
-  const handleOnSuccess = React9.useCallback(async () => {
+  const handleOnSuccess = React8.useCallback(async () => {
     await refresh();
     onSuccess?.();
   }, [onSuccess, fromAddress, queryClient]);
@@ -4210,7 +4264,7 @@ var useTransferVET = ({
   onSuccess
 }) => {
   const { refresh } = useRefreshBalances();
-  const buildClauses = React9.useCallback(async () => {
+  const buildClauses = React8.useCallback(async () => {
     if (!receiverAddress || !amount || !chunkEO3CLT4E_cjs.isValidAddress(receiverAddress))
       throw new Error("Invalid receiver address or amount");
     if (isNaN(Number(amount))) {
@@ -4262,7 +4316,7 @@ var DEFAULT_NOTIFICATIONS = [
 ];
 var useNotifications = () => {
   const { account } = useWallet();
-  const getStorageKeys = React9.useCallback((address) => {
+  const getStorageKeys = React8.useCallback((address) => {
     const normalizedAddress = address?.toLowerCase();
     return {
       notifications: `vechain_kit_notifications_${normalizedAddress}`,
@@ -4270,7 +4324,7 @@ var useNotifications = () => {
       initialized: `vechain_kit_notifications_initialized_${normalizedAddress}`
     };
   }, []);
-  const initializeNotifications = React9.useCallback(() => {
+  const initializeNotifications = React8.useCallback(() => {
     if (!account?.address) return;
     const keys = getStorageKeys(account.address);
     const isInitialized = localStorage.getItem(keys.initialized);
@@ -4282,24 +4336,24 @@ var useNotifications = () => {
       localStorage.setItem(keys.initialized, "true");
     }
   }, [account?.address, getStorageKeys]);
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     initializeNotifications();
   }, [initializeNotifications]);
-  const getNotifications = React9.useCallback(() => {
+  const getNotifications = React8.useCallback(() => {
     if (!account?.address) return [];
     const keys = getStorageKeys(account.address);
     const cached = localStorage.getItem(keys.notifications);
     if (!cached) return [];
     return JSON.parse(cached);
   }, [account?.address, getStorageKeys]);
-  const getArchivedNotifications = React9.useCallback(() => {
+  const getArchivedNotifications = React8.useCallback(() => {
     if (!account?.address) return [];
     const keys = getStorageKeys(account.address);
     const cached = localStorage.getItem(keys.archived);
     if (!cached) return [];
     return JSON.parse(cached);
   }, [account?.address, getStorageKeys]);
-  const addNotification = React9.useCallback(
+  const addNotification = React8.useCallback(
     (notification) => {
       if (!account?.address) return;
       const keys = getStorageKeys(account.address);
@@ -4325,7 +4379,7 @@ var useNotifications = () => {
     },
     [account?.address, getNotifications, getStorageKeys]
   );
-  const clearAllNotifications = React9.useCallback(() => {
+  const clearAllNotifications = React8.useCallback(() => {
     if (!account?.address) return;
     const keys = getStorageKeys(account.address);
     const notifications = getNotifications();
@@ -4340,7 +4394,7 @@ var useNotifications = () => {
     getArchivedNotifications,
     getStorageKeys
   ]);
-  const markAsRead = React9.useCallback(
+  const markAsRead = React8.useCallback(
     (notificationId) => {
       if (!account?.address) return;
       const keys = getStorageKeys(account.address);
@@ -4386,7 +4440,7 @@ var useNotificationAlerts = () => {
   const { t } = reactI18next.useTranslation();
   const { account, connection } = useWallet();
   const { addNotification, getNotifications } = useNotifications();
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     if (!connection.isConnectedWithPrivy || !account?.address) return;
     const notifications = getNotifications();
     const hasSmartAccountNotification = notifications.some(
@@ -4403,7 +4457,7 @@ var useNotificationAlerts = () => {
       });
     }
   }, [connection.isConnectedWithPrivy, account?.address]);
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     if (!connection.isConnectedWithPrivy || !account?.address) return;
     const notifications = getNotifications();
     const hasMulticlauseWarning = notifications.some(
@@ -4422,13 +4476,13 @@ var useNotificationAlerts = () => {
   }, [connection.isConnectedWithPrivy, account?.address]);
 };
 var useSignMessage2 = () => {
-  const [isSigningPending, setIsSigningPending] = React9.useState(false);
-  const [signature, setSignature] = React9.useState(null);
-  const [error, setError] = React9.useState(null);
+  const [isSigningPending, setIsSigningPending] = React8.useState(false);
+  const [signature, setSignature] = React8.useState(null);
+  const [error, setError] = React8.useState(null);
   const { connection } = useWallet();
   const { vendor } = dappKitReact.useConnex();
   const privyWalletProvider = usePrivyWalletProvider();
-  const signMessage = React9.useCallback(
+  const signMessage = React8.useCallback(
     async (message) => {
       setIsSigningPending(true);
       setError(null);
@@ -4458,7 +4512,7 @@ var useSignMessage2 = () => {
     },
     [connection, privyWalletProvider]
   );
-  const reset = React9.useCallback(() => {
+  const reset = React8.useCallback(() => {
     setIsSigningPending(false);
     setSignature(null);
     setError(null);
@@ -4472,13 +4526,13 @@ var useSignMessage2 = () => {
   };
 };
 var useSignTypedData2 = () => {
-  const [isSigningPending, setIsSigningPending] = React9.useState(false);
-  const [signature, setSignature] = React9.useState(null);
-  const [error, setError] = React9.useState(null);
+  const [isSigningPending, setIsSigningPending] = React8.useState(false);
+  const [signature, setSignature] = React8.useState(null);
+  const [error, setError] = React8.useState(null);
   const { connection } = useWallet();
   const privyWalletProvider = usePrivyWalletProvider();
   const { signTypedData: signTypedDataDappKit } = dappKitReact.useWallet();
-  const signTypedData = React9.useCallback(
+  const signTypedData = React8.useCallback(
     async (data) => {
       setIsSigningPending(true);
       setError(null);
@@ -4510,7 +4564,7 @@ var useSignTypedData2 = () => {
     },
     [connection, privyWalletProvider]
   );
-  const reset = React9.useCallback(() => {
+  const reset = React8.useCallback(() => {
     setIsSigningPending(false);
     setSignature(null);
     setError(null);
@@ -4549,7 +4603,7 @@ var useLoginWithOAuth2 = () => {
 };
 var useCrossAppConnectionCache = () => {
   const CACHE_KEY = "vechain_kit_cross_app_connection";
-  const setConnectionCache = React9.useCallback(
+  const setConnectionCache = React8.useCallback(
     (ecosystemApp) => {
       const cacheData = {
         timestamp: Date.now(),
@@ -4559,12 +4613,12 @@ var useCrossAppConnectionCache = () => {
     },
     []
   );
-  const getConnectionCache = React9.useCallback(() => {
+  const getConnectionCache = React8.useCallback(() => {
     const cached = localStorage.getItem(CACHE_KEY);
     if (!cached) return null;
     return JSON.parse(cached);
   }, []);
-  const clearConnectionCache = React9.useCallback(() => {
+  const clearConnectionCache = React8.useCallback(() => {
     localStorage.removeItem(CACHE_KEY);
   }, []);
   return {
@@ -4599,7 +4653,7 @@ var useLoginWithVeChain = () => {
   return { login };
 };
 var useScrollToTop = () => {
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     const modalContent = document.querySelector(".chakra-modal__content");
     if (modalContent) {
       modalContent.scrollTop = 0;
@@ -4607,8 +4661,8 @@ var useScrollToTop = () => {
   }, []);
 };
 var useIsPWA = () => {
-  const [isPWA, setIsPWA] = React9.useState(true);
-  React9.useEffect(() => {
+  const [isPWA, setIsPWA] = React8.useState(true);
+  React8.useEffect(() => {
     const checkIsPWA = () => {
       const isStandalone = window.matchMedia("(display-mode: standalone)").matches || window.standalone || document.referrer.includes("android-app://");
       setIsPWA(isStandalone);
@@ -4622,9 +4676,9 @@ var useIsPWA = () => {
   return isPWA;
 };
 var useFeatureAnnouncement = () => {
-  const [isVisible, setIsVisible] = React9.useState(true);
+  const [isVisible, setIsVisible] = React8.useState(true);
   const CACHE_KEY = "vechain_kit_feature_announcement_closed";
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     const isClosed = localStorage.getItem(CACHE_KEY);
     if (isClosed) {
       setIsVisible(false);
@@ -4649,7 +4703,7 @@ var useCall = ({
   mapResponse
 }) => {
   const { thor } = dappKitReact.useConnex();
-  const queryFn = React9.useCallback(async () => {
+  const queryFn = React8.useCallback(async () => {
     try {
       const functionFragment2 = contractInterface21?.getFunction(method35)?.format("json");
       if (!functionFragment2)
@@ -4669,11 +4723,11 @@ var useCall = ({
       throw error;
     }
   }, [args, contractAddress, contractInterface21, mapResponse, method35, thor]);
-  const queryKey = React9.useMemo(
+  const queryKey = React8.useMemo(
     () => getCallKey({ method: method35, keyArgs: keyArgs || args }),
     [method35, keyArgs, args]
   );
-  const enableQuery = React9.useMemo(() => enabled, [enabled]);
+  const enableQuery = React8.useMemo(() => enabled, [enabled]);
   return reactQuery.useQuery({
     queryFn,
     queryKey,
@@ -4684,7 +4738,7 @@ var getCallKey = ({ method: method35, keyArgs = [] }) => {
   return ["VECHAIN_KIT_", method35, ...keyArgs];
 };
 var useLocalStorage = (key, initialValue) => {
-  const [storedValue, setStoredValue] = React9.useState(() => {
+  const [storedValue, setStoredValue] = React8.useState(() => {
     try {
       const item = window.localStorage.getItem(key);
       return item ? JSON.parse(item) : initialValue;
@@ -4693,7 +4747,7 @@ var useLocalStorage = (key, initialValue) => {
       return initialValue;
     }
   });
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     window.localStorage.setItem(key, JSON.stringify(storedValue));
   }, [key, storedValue]);
   return [storedValue, setStoredValue];
@@ -4723,7 +4777,7 @@ var useEcosystemShortcuts = () => {
     isShortcut
   };
 };
-var PrivyWalletProviderContext = React9.createContext(null);
+var PrivyWalletProviderContext = React8.createContext(null);
 var PrivyWalletProvider = ({
   children,
   nodeUrl,
@@ -5070,7 +5124,7 @@ var PrivyWalletProvider = ({
   );
 };
 var usePrivyWalletProvider = () => {
-  const context = React9.useContext(PrivyWalletProviderContext);
+  const context = React8.useContext(PrivyWalletProviderContext);
   if (!context) {
     throw new Error(
       "usePrivyWalletProvider must be used within a PrivyWalletProvider"
@@ -5090,7 +5144,7 @@ var FadeInView = ({ children }) => {
   );
 };
 var FadeInViewFromBottom = ({ children }) => {
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     const modalContent = document.querySelector(".chakra-modal__content");
     if (modalContent) {
       modalContent.scrollTop = 0;
@@ -5148,9 +5202,14 @@ var ModalBackButton = ({ onClick, ...props }) => {
     }
   );
 };
-var AddressDisplay = ({ wallet, label, size = "lg" }) => {
-  const [copied, setCopied] = React9.useState(false);
-  const [copiedDomain, setCopiedDomain] = React9.useState(false);
+var AddressDisplay = ({
+  wallet,
+  label,
+  size = "lg",
+  style
+}) => {
+  const [copied, setCopied] = React8.useState(false);
+  const [copiedDomain, setCopiedDomain] = React8.useState(false);
   const copyToClipboard = async (textToCopy, setCopied2) => {
     await navigator.clipboard.writeText(textToCopy);
     setCopied2(true);
@@ -5158,7 +5217,7 @@ var AddressDisplay = ({ wallet, label, size = "lg" }) => {
       setCopied2(false);
     }, 2e3);
   };
-  return /* @__PURE__ */ jsxRuntime.jsx(react.VStack, { w: "full", justifyContent: "center", children: /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { children: [
+  return /* @__PURE__ */ jsxRuntime.jsx(react.VStack, { w: "full", justifyContent: "center", ...style, children: /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { children: [
     label && /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", opacity: 0.7, children: label }),
     wallet?.domain ? /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { children: [
       /* @__PURE__ */ jsxRuntime.jsxs(
@@ -5234,7 +5293,7 @@ var AddressDisplay = ({ wallet, label, size = "lg" }) => {
 // package.json
 var package_default = {
   name: "@vechain/vechain-kit",
-  version: "1.3.1",
+  version: "1.4.1",
   private: false,
   homepage: "https://github.com/vechain/vechain-kit",
   repository: "github:vechain/vechain-kit",
@@ -5260,8 +5319,8 @@ var package_default = {
   dependencies: {
     "@chakra-ui/react": "^2.8.2",
     "@choc-ui/chakra-autocomplete": "^5.3.0",
-    "@privy-io/cross-app-connect": "^0.1.3",
-    "@privy-io/react-auth": "2.0.1",
+    "@privy-io/cross-app-connect": "^0.1.6",
+    "@privy-io/react-auth": "2.3.0",
     "@rainbow-me/rainbowkit": "^2.1.5",
     "@tanstack/react-query": "^5.64.2",
     "@tanstack/react-query-devtools": "^5.64.1",
@@ -5381,10 +5440,10 @@ var VersionFooter = ({ ...props }) => {
   );
 };
 var StickyHeaderContainer = ({ children }) => {
-  const [hasContentBelow, setHasContentBelow] = React9.useState(false);
-  const observerRef = React9.useRef(null);
+  const [hasContentBelow, setHasContentBelow] = React8.useState(false);
+  const observerRef = React8.useRef(null);
   const { darkMode: isDark } = useVeChainKitConfig();
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     const observer = new IntersectionObserver(
       ([entry]) => {
         setHasContentBelow(!entry.isIntersecting);
@@ -5596,7 +5655,8 @@ var AddressDisplayCard = ({
                 src: imageSrc,
                 alt: imageAlt,
                 boxSize: "40px",
-                borderRadius: "xl"
+                borderRadius: "xl",
+                objectFit: "cover"
               }
             ),
             /* @__PURE__ */ jsxRuntime.jsx(react.VStack, { align: "start", spacing: 0, children: domain ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
@@ -5646,10 +5706,26 @@ var ScrollToTopWrapper = ({ children, ...props }) => {
   useScrollToTop();
   return /* @__PURE__ */ jsxRuntime.jsx(react.VStack, { ...props, children });
 };
+var AccountAvatar = ({ wallet, props }) => {
+  if (wallet?.isLoadingAvatar) {
+    return /* @__PURE__ */ jsxRuntime.jsx(react.Spinner, { size: "sm" });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    react.Image,
+    {
+      src: props?.src ?? wallet?.image,
+      alt: props?.alt ?? wallet?.domain,
+      fallbackSrc: chunkEO3CLT4E_cjs.notFoundImage,
+      objectFit: "cover",
+      rounded: "full",
+      ...props
+    }
+  );
+};
 var VeChainLoginButton = ({ isDark, gridColumn }) => {
   const { t } = reactI18next.useTranslation();
   const { login: loginWithVeChain } = useLoginWithVeChain();
-  const [loginError, setLoginError] = React9.useState();
+  const [loginError, setLoginError] = React8.useState();
   const loginLoadingModal = react.useDisclosure();
   const handleLoginWithVeChain = async () => {
     loginLoadingModal.onOpen();
@@ -5691,12 +5767,19 @@ var VeChainLoginButton = ({ isDark, gridColumn }) => {
     )
   ] });
 };
-var SocialLoginButtons = ({ isDark, loginModalUI }) => {
+var SocialLoginButtons = ({
+  isDark,
+  loginMethods,
+  gridColumn
+}) => {
   const { t } = reactI18next.useTranslation();
   const { initOAuth } = useLoginWithOAuth2();
-  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: loginModalUI?.preferredLoginMethods?.map((method35, index) => /* @__PURE__ */ jsxRuntime.jsxs(React9__default.default.Fragment, { children: [
-    method35 === "email" && /* @__PURE__ */ jsxRuntime.jsx(react.GridItem, { colSpan: 4, w: "full", children: /* @__PURE__ */ jsxRuntime.jsx(EmailLoginButton, {}) }),
-    method35 === "google" && /* @__PURE__ */ jsxRuntime.jsx(react.GridItem, { colSpan: 4, w: "full", children: /* @__PURE__ */ jsxRuntime.jsx(
+  const selfHostedPrivyLoginMethods = loginMethods?.filter(
+    (method35) => method35.method === "email" || method35.method === "google"
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(react.GridItem, { colSpan: gridColumn, w: "full", children: selfHostedPrivyLoginMethods?.map((loginMethod, index) => /* @__PURE__ */ jsxRuntime.jsxs(React8__default.default.Fragment, { children: [
+    loginMethod.method === "email" && /* @__PURE__ */ jsxRuntime.jsx(react.GridItem, { colSpan: 4, w: "full", children: /* @__PURE__ */ jsxRuntime.jsx(EmailLoginButton, {}) }),
+    loginMethod.method === "google" && /* @__PURE__ */ jsxRuntime.jsx(react.GridItem, { colSpan: 4, w: "full", children: /* @__PURE__ */ jsxRuntime.jsx(
       ConnectionButton,
       {
         isDark,
@@ -5707,17 +5790,17 @@ var SocialLoginButtons = ({ isDark, loginModalUI }) => {
         text: t("Continue with Google")
       }
     ) }),
-    index !== (loginModalUI?.preferredLoginMethods?.length ?? 0) - 1 && /* @__PURE__ */ jsxRuntime.jsx(react.GridItem, { colSpan: 4, w: "full", children: /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { children: [
+    index !== (selfHostedPrivyLoginMethods?.length ?? 0) - 1 && /* @__PURE__ */ jsxRuntime.jsx(react.GridItem, { colSpan: 4, w: "full", children: /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(react.Divider, {}),
       /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "xs", children: "or" }),
       /* @__PURE__ */ jsxRuntime.jsx(react.Divider, {})
     ] }) })
-  ] }, method35)) });
+  ] }, loginMethod.method)) });
 };
-var PasskeyLoginButton = ({ isDark, gridColumn = 1 }) => {
+var PasskeyLoginButton = ({ isDark, gridColumn }) => {
   const { t } = reactI18next.useTranslation();
   const { loginWithPasskey } = useLoginWithPasskey();
-  const [loginError, setLoginError] = React9.useState();
+  const [loginError, setLoginError] = React8.useState();
   const loginLoadingModal = react.useDisclosure();
   const handleLoginWithPasskey = async () => {
     loginLoadingModal.onOpen();
@@ -5738,7 +5821,8 @@ var PasskeyLoginButton = ({ isDark, gridColumn = 1 }) => {
       {
         isDark,
         onClick: handleLoginWithPasskey,
-        icon: io.IoIosFingerPrint
+        icon: io.IoIosFingerPrint,
+        text: gridColumn && gridColumn >= 2 ? t("Passkey") : void 0
       }
     ) }),
     /* @__PURE__ */ jsxRuntime.jsx(
@@ -5771,20 +5855,20 @@ var DappKitButton = ({ isDark, gridColumn = 2 }) => {
 };
 var EcosystemButton = ({
   isDark,
-  privySocialLoginEnabled,
   appsInfo,
-  isLoading
+  isLoading,
+  gridColumn
 }) => {
   const { t } = reactI18next.useTranslation();
   const ecosystemModal = react.useDisclosure();
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(react.GridItem, { colSpan: privySocialLoginEnabled ? 1 : 2, w: "full", children: /* @__PURE__ */ jsxRuntime.jsx(
+    /* @__PURE__ */ jsxRuntime.jsx(react.GridItem, { colSpan: gridColumn, w: "full", children: /* @__PURE__ */ jsxRuntime.jsx(
       ConnectionButton,
       {
         isDark,
         onClick: ecosystemModal.onOpen,
-        icon: io5.IoPlanet,
-        text: !privySocialLoginEnabled ? t("Ecosystem") : void 0
+        icon: io.IoMdApps,
+        text: gridColumn && gridColumn >= 2 ? t("Other") : void 0
       }
     ) }),
     /* @__PURE__ */ jsxRuntime.jsx(
@@ -5798,11 +5882,7 @@ var EcosystemButton = ({
     )
   ] });
 };
-var PrivyButton = ({
-  isDark,
-  onViewMoreLogin,
-  gridColumn = 1
-}) => {
+var PrivyButton = ({ isDark, onViewMoreLogin, gridColumn }) => {
   const { t } = reactI18next.useTranslation();
   return /* @__PURE__ */ jsxRuntime.jsx(react.GridItem, { colSpan: gridColumn, w: "full", children: /* @__PURE__ */ jsxRuntime.jsx(
     ConnectionButton,
@@ -5810,7 +5890,7 @@ var PrivyButton = ({
       isDark,
       onClick: onViewMoreLogin,
       icon: ci.CiCircleMore,
-      text: gridColumn >= 2 ? t("More") : void 0
+      text: gridColumn && gridColumn >= 2 ? t("More") : void 0
     }
   ) });
 };
@@ -5867,10 +5947,10 @@ var EmailCodeVerificationModal = ({
 }) => {
   const { t } = reactI18next.useTranslation();
   const { darkMode: isDark } = useVeChainKitConfig();
-  const [code, setCode] = React9.useState("");
-  const [error, setError] = React9.useState(null);
+  const [code, setCode] = React8.useState("");
+  const [error, setError] = React8.useState(null);
   const { loginWithCode } = reactAuth.useLoginWithEmail({});
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     if (code.length === 6) {
       loginWithCode({ code }).then(() => {
         onClose();
@@ -6057,7 +6137,7 @@ var EmailCodeVerificationModal = ({
 var EmailLoginButton = () => {
   const { t } = reactI18next.useTranslation();
   const { darkMode: isDark } = useVeChainKitConfig();
-  const [email, setEmail] = React9.useState("");
+  const [email, setEmail] = React8.useState("");
   const { sendCode, state: emailState } = reactAuth.useLoginWithEmail({});
   const emailCodeVerificationModal = react.useDisclosure();
   const handleSendCode = async () => {
@@ -6136,51 +6216,99 @@ var VeChainWithPrivyLoginButton = ({ isDark, gridColumn }) => {
     }
   ) });
 };
-var MainContent = ({
-  setCurrentContent,
-  onClose,
-  variant = "vechain-wallet-ecosystem"
-}) => {
+var MainContent = ({ setCurrentContent, onClose }) => {
   const { t } = reactI18next.useTranslation();
   const { darkMode: isDark } = useVeChainKitConfig();
   const { connection } = useWallet();
-  const { loginModalUI, privySocialLoginEnabled, privyEcosystemAppIDS } = useVeChainKitConfig();
+  const { loginModalUI, privyEcosystemAppIDS, loginMethods } = useVeChainKitConfig();
   const { login: viewMoreLogin } = reactAuth.usePrivy();
+  const {
+    showSocialLogin,
+    showPasskey,
+    showVeChainLogin,
+    showDappKit,
+    showEcosystem,
+    showMoreLogin,
+    isOfficialVeChainApp
+  } = useLoginModalContent();
   const { data: appsInfo, isLoading: isEcosystemAppsLoading } = useFetchAppInfo(privyEcosystemAppIDS);
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     if (connection.isConnected) {
       onClose();
     }
   }, [connection.isConnected, onClose]);
-  const dappKitGridColumn = React9.useMemo(() => {
-    switch (variant) {
-      case "full":
-        return 1;
-      case "vechain-and-wallet":
-        return 4;
-      case "vechain-wallet-ecosystem":
-        if (privyEcosystemAppIDS.length === 0) {
-          return 4;
+  const gridLayout = React8.useMemo(() => {
+    if (loginMethods?.length) {
+      const layout = {};
+      loginMethods.forEach(({ method: method35, gridColumn }) => {
+        switch (method35) {
+          case "email":
+          case "google":
+            layout.socialLoginColumn = gridColumn || 4;
+            break;
+          case "vechain":
+            layout.veChainColumn = gridColumn || 4;
+            break;
+          case "passkey":
+            layout.passkeyColumn = gridColumn || 1;
+            break;
+          case "dappkit":
+            layout.dappKitColumn = gridColumn || 2;
+            break;
+          case "ecosystem":
+            layout.ecosystemColumn = gridColumn || 2;
+            break;
+          case "more":
+            layout.moreLoginColumn = gridColumn || 1;
+            break;
         }
-        return 2;
-      default:
-        if (!privySocialLoginEnabled || privyEcosystemAppIDS.length === 0) {
-          return 4;
-        }
-        return 1;
-    }
-  }, [variant, privySocialLoginEnabled, privyEcosystemAppIDS]);
-  const privyGridColumn = React9.useMemo(() => {
-    switch (variant) {
-      case "full":
-        if (privyEcosystemAppIDS.length === 0) {
-          return 2;
-        }
-        return 1;
-      default:
-        return 0;
+      });
+      return layout;
+    }
+    const visibleButtons = {
+      socialLogin: showSocialLogin,
+      veChainLogin: showVeChainLogin,
+      dappKit: showDappKit,
+      ecosystem: showEcosystem,
+      moreLogin: showMoreLogin,
+      passkey: showPasskey
+    };
+    if (visibleButtons.veChainLogin && visibleButtons.dappKit && visibleButtons.ecosystem && !visibleButtons.socialLogin) {
+      return {
+        veChainColumn: 4,
+        // Full width
+        dappKitColumn: 2,
+        // Half width
+        ecosystemColumn: 2
+        // Half width
+      };
     }
-  }, [variant, privyEcosystemAppIDS]);
+    if (visibleButtons.socialLogin) {
+      return {
+        socialLoginColumn: 4,
+        veChainColumn: 4,
+        dappKitColumn: 1,
+        ecosystemColumn: 1,
+        moreLoginColumn: 1,
+        passkeyColumn: 1
+      };
+    }
+    const totalButtons = Object.values(visibleButtons).filter(Boolean).length;
+    const defaultColumn = Math.min(4, totalButtons);
+    return {
+      veChainColumn: 4,
+      dappKitColumn: defaultColumn,
+      ecosystemColumn: defaultColumn
+    };
+  }, [
+    loginMethods,
+    showSocialLogin,
+    showVeChainLogin,
+    showDappKit,
+    showEcosystem,
+    showMoreLogin,
+    showPasskey
+  ]);
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsxs(StickyHeaderContainer, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(ModalFAQButton, { onClick: () => setCurrentContent("faq") }),
@@ -6227,53 +6355,56 @@ var MainContent = ({
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsx(react.Stack, { spacing: 4, w: "full", align: "center", children: /* @__PURE__ */ jsxRuntime.jsxs(react.Grid, { templateColumns: "repeat(4, 1fr)", gap: 2, w: "full", children: [
-        variant === "full" && privySocialLoginEnabled && /* @__PURE__ */ jsxRuntime.jsx(
+        showSocialLogin && /* @__PURE__ */ jsxRuntime.jsx(
           SocialLoginButtons,
           {
             isDark,
-            loginModalUI
+            loginMethods,
+            gridColumn: gridLayout.socialLoginColumn
           }
         ),
-        variant === "vechain" ? (
-          // This exists because we want to use same button but connect
-          // with privy-auth instead of cross-app, used only by vechain.
-          /* @__PURE__ */ jsxRuntime.jsx(
-            VeChainWithPrivyLoginButton,
-            {
-              isDark,
-              gridColumn: 4
-            }
-          )
+        showVeChainLogin && (isOfficialVeChainApp ? /* @__PURE__ */ jsxRuntime.jsx(
+          VeChainWithPrivyLoginButton,
+          {
+            isDark,
+            gridColumn: gridLayout.veChainColumn
+          }
         ) : /* @__PURE__ */ jsxRuntime.jsx(
           VeChainLoginButton,
           {
             isDark,
-            gridColumn: 4
+            gridColumn: gridLayout.veChainColumn
+          }
+        )),
+        gridLayout.passkeyColumn && /* @__PURE__ */ jsxRuntime.jsx(
+          PasskeyLoginButton,
+          {
+            isDark,
+            gridColumn: gridLayout.passkeyColumn
           }
         ),
-        variant === "full" && privySocialLoginEnabled && /* @__PURE__ */ jsxRuntime.jsx(PasskeyLoginButton, { isDark }),
-        /* @__PURE__ */ jsxRuntime.jsx(
+        showDappKit && /* @__PURE__ */ jsxRuntime.jsx(
           DappKitButton,
           {
             isDark,
-            gridColumn: dappKitGridColumn
+            gridColumn: gridLayout.dappKitColumn
           }
         ),
-        (variant === "full" || variant === "vechain-wallet-ecosystem") && privyEcosystemAppIDS.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
+        showEcosystem && /* @__PURE__ */ jsxRuntime.jsx(
           EcosystemButton,
           {
             isDark,
-            privySocialLoginEnabled: variant === "full" && privySocialLoginEnabled,
             appsInfo: Object.values(appsInfo || {}),
-            isLoading: isEcosystemAppsLoading
+            isLoading: isEcosystemAppsLoading,
+            gridColumn: gridLayout.ecosystemColumn
           }
         ),
-        variant === "full" && privySocialLoginEnabled && /* @__PURE__ */ jsxRuntime.jsx(
+        showMoreLogin && /* @__PURE__ */ jsxRuntime.jsx(
           PrivyButton,
           {
             isDark,
             onViewMoreLogin: viewMoreLogin,
-            gridColumn: privyGridColumn
+            gridColumn: gridLayout.moreLoginColumn
           }
         )
       ] }) })
@@ -6338,21 +6469,35 @@ var FeatureAnnouncementCard = ({
     }
   );
 };
-var AccountMainContent = ({
-  setCurrentContent,
-  wallet,
-  onClose
-}) => {
+var ExchangeWarningAlert = () => {
+  const { t } = reactI18next.useTranslation();
+  const [showFullText, setShowFullText] = React8.useState(false);
+  return /* @__PURE__ */ jsxRuntime.jsx(react.Alert, { status: "warning", fontSize: "xs", borderRadius: "xl", p: 2, children: /* @__PURE__ */ jsxRuntime.jsx(react.VStack, { spacing: 1, align: "stretch", w: "full", children: /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { spacing: 2, align: "flex-start", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(react.AlertIcon, { boxSize: 4 }),
+    /* @__PURE__ */ jsxRuntime.jsxs(react.Text, { w: "full", children: [
+      t(
+        "Sending to OceanX or other exchanges may result in loss of funds."
+      ),
+      showFullText && t("Send the tokens to your VeWorld wallet first."),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        react.Button,
+        {
+          variant: "link",
+          size: "xs",
+          onClick: () => setShowFullText(!showFullText),
+          color: "inherit",
+          pl: 6,
+          mt: 0,
+          children: t(showFullText ? "Show Less" : "Read More")
+        }
+      )
+    ] })
+  ] }) }) });
+};
+var AccountMainContent = ({ setCurrentContent, wallet }) => {
   const { t } = reactI18next.useTranslation();
   const { darkMode: isDark } = useVeChainKitConfig();
-  const { disconnect, connection, account } = useWallet();
-  const { getNotifications } = useNotifications();
-  const notifications = getNotifications();
-  const hasUnreadNotifications = notifications.some((n) => !n.isRead);
-  const handleDisconnect = () => {
-    disconnect();
-    onClose();
-  };
+  const { connection, account } = useWallet();
   return /* @__PURE__ */ jsxRuntime.jsxs(ScrollToTopWrapper, { children: [
     /* @__PURE__ */ jsxRuntime.jsxs(StickyHeaderContainer, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(
@@ -6375,60 +6520,16 @@ var AccountMainContent = ({
           setCurrentContent
         }
       ),
-      /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { justify: "space-between", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          react.IconButton,
-          {
-            p: 2,
-            h: 9,
-            icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { boxSize: 5, as: ri.RiLogoutBoxLine }),
-            "aria-label": "Disconnect",
-            variant: "vechainKitSelector",
-            onClick: () => setCurrentContent({
-              type: "disconnect-confirm",
-              props: {
-                onDisconnect: handleDisconnect,
-                onBack: () => setCurrentContent("main")
-              }
-            })
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          AccountSelector,
-          {
-            mt: 0,
-            onClick: () => {
-              setCurrentContent("settings");
-            },
-            wallet
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { position: "relative", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            react.IconButton,
-            {
-              p: 2,
-              h: 9,
-              variant: "vechainKitSelector",
-              "aria-label": "notifications",
-              icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { boxSize: 5, as: bi.BiBell }),
-              onClick: () => setCurrentContent("notifications")
-            }
-          ),
-          hasUnreadNotifications && /* @__PURE__ */ jsxRuntime.jsx(
-            react.Box,
-            {
-              position: "absolute",
-              top: 1,
-              right: 1,
-              width: "8px",
-              height: "8px",
-              bg: "red.500",
-              borderRadius: "full"
-            }
-          )
-        ] })
-      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        AccountSelector,
+        {
+          mt: 0,
+          onClick: () => {
+            setCurrentContent("settings");
+          },
+          wallet
+        }
+      ),
       /* @__PURE__ */ jsxRuntime.jsx(BalanceSection, { mt: 14 }),
       /* @__PURE__ */ jsxRuntime.jsx(
         QuickActionsSection,
@@ -6515,7 +6616,6 @@ var ActionButton = ({
   leftIcon,
   rightIcon,
   title,
-  description,
   onClick,
   leftImage,
   hide = false,
@@ -6526,7 +6626,8 @@ var ActionButton = ({
   stacked = false,
   isLoading,
   loadingText,
-  style
+  style,
+  extraContent
 }) => {
   const { t } = reactI18next.useTranslation();
   const { colorMode } = react.useColorMode();
@@ -6555,10 +6656,11 @@ var ActionButton = ({
             h: "35px",
             borderRadius: "full",
             alt: "left-image",
-            alignSelf: "end"
+            alignSelf: "end",
+            objectFit: "cover"
           }
         ) : /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { as: leftIcon, fontSize: "25px" }) }),
-        /* @__PURE__ */ jsxRuntime.jsxs(
+        /* @__PURE__ */ jsxRuntime.jsx(
           react.VStack,
           {
             textAlign: "left",
@@ -6566,26 +6668,11 @@ var ActionButton = ({
             flex: 1,
             justifyContent: "flex-start",
             alignItems: "flex-start",
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { justify: "flex-start", children: [
-                /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", fontWeight: "400", children: title }),
-                showComingSoon && /* @__PURE__ */ jsxRuntime.jsx(react.Tag, { size: "sm", colorScheme: "red", children: t("Coming Soon!") })
-              ] }),
-              /* @__PURE__ */ jsxRuntime.jsx(
-                react.Text,
-                {
-                  fontSize: "xs",
-                  fontWeight: "400",
-                  opacity: 0.5,
-                  overflowWrap: "break-word",
-                  wordBreak: "break-word",
-                  whiteSpace: "normal",
-                  w: "full",
-                  pr: rightIcon ? "0px" : "10px",
-                  children: description
-                }
-              )
-            ]
+            children: /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { justify: "flex-start", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", fontWeight: "400", children: title }),
+              showComingSoon && /* @__PURE__ */ jsxRuntime.jsx(react.Tag, { size: "sm", colorScheme: "red", children: t("Coming Soon!") }),
+              extraContent
+            ] })
           }
         ),
         rightIcon && /* @__PURE__ */ jsxRuntime.jsx(react.VStack, { minW: "40px", justifyContent: "flex-end", children: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { as: rightIcon, fontSize: "20px", opacity: 0.5 }) })
@@ -6599,28 +6686,25 @@ var AccountSelector = ({
   onClick,
   mt
 }) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(react.HStack, { mt, children: /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx(react.HStack, { mt, w: "full", justify: "center", children: /* @__PURE__ */ jsxRuntime.jsx(
     react.Button,
     {
       w: "fit-content",
       p: 2,
       pl: 4,
-      h: 9,
+      h: 14,
       "aria-label": "Wallet",
       onClick,
       variant: "vechainKitSelector",
       children: /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { spacing: 2, align: "center", children: [
         /* @__PURE__ */ jsxRuntime.jsx(
-          react.Image,
+          AccountAvatar,
           {
-            src: wallet?.image,
-            alt: wallet?.domain,
-            width: 5,
-            height: 5,
-            rounded: "full"
+            wallet,
+            props: { width: 10, height: 10 }
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: size, fontWeight: "500", children: chunkEO3CLT4E_cjs.humanDomain(wallet?.domain ?? "", 6, 4) || chunkEO3CLT4E_cjs.humanAddress(wallet?.address ?? "", 6, 4) }),
+        /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: size, fontWeight: "500", children: chunkEO3CLT4E_cjs.humanDomain(wallet?.domain ?? "", 20, 0) || chunkEO3CLT4E_cjs.humanAddress(wallet?.address ?? "", 6, 4) }),
         /* @__PURE__ */ jsxRuntime.jsx(
           react.Icon,
           {
@@ -6646,7 +6730,7 @@ var BalanceSection = ({ mb, mt }) => {
     address: account?.address ?? ""
   });
   const { refresh } = useRefreshBalances();
-  const [isRefreshing, setIsRefreshing] = React9.useState(false);
+  const [isRefreshing, setIsRefreshing] = React8.useState(false);
   const handleRefresh = async () => {
     setIsRefreshing(true);
     await refresh();
@@ -6765,7 +6849,7 @@ var AssetsSection = ({ mt, setCurrentContent }) => {
   const tabBgColor = react.useColorModeValue("white", "#1f1f1e");
   const tabBorderColor = react.useColorModeValue("#ebebeb", "#2d2d2d");
   const tabTextColor = react.useColorModeValue("#4d4d4d", "#dfdfdd");
-  const tabPanelsRef = React9.useRef(null);
+  const tabPanelsRef = React8.useRef(null);
   const scrollToContent = () => {
     setTimeout(() => {
       if (tabPanelsRef.current) {
@@ -6820,8 +6904,8 @@ var QuickActionsSection = ({ mt, setCurrentContent }) => {
         py: 3,
         fontSize: "xs",
         verticalAlign: "middle",
-        "aria-label": "Ecosystem",
-        icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { as: io5.IoPlanet, boxSize: 5, opacity: 0.9 }),
+        "aria-label": "Apps",
+        icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { as: io.IoMdApps, boxSize: 5, opacity: 0.9 }),
         onClick: () => setCurrentContent("ecosystem")
       }
     ),
@@ -6874,83 +6958,539 @@ var QuickActionsSection = ({ mt, setCurrentContent }) => {
     )
   ] });
 };
-var NetworkInfo = () => {
+var Profile = ({ onEditClick }) => {
+  const { darkMode: isDark } = useVeChainKitConfig();
+  const { account } = useWallet();
+  const baseBackgroundColor = isDark ? "whiteAlpha.100" : "#00000005";
+  const headerImageSvg = picasso.picasso(account?.address ?? "");
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    react.Card,
+    {
+      bg: baseBackgroundColor,
+      borderRadius: "xl",
+      width: "full",
+      position: "relative",
+      overflow: "visible",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          react.Box,
+          {
+            p: 0,
+            backgroundSize: "100% !important",
+            backgroundPosition: "center",
+            position: "relative",
+            h: "80px",
+            background: `no-repeat url('data:image/svg+xml;utf8,${headerImageSvg}')`,
+            w: "100%",
+            borderRadius: "14px 14px 0 0"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          react.Box,
+          {
+            position: "absolute",
+            top: "30px",
+            left: "50%",
+            transform: "translateX(-50%)",
+            children: /* @__PURE__ */ jsxRuntime.jsx(
+              AccountAvatar,
+              {
+                wallet: account,
+                props: {
+                  width: "100px",
+                  height: "100px",
+                  boxShadow: "0px 0px 3px 2px #00000024"
+                }
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(react.CardBody, { pt: "14", pb: "6", backgroundColor: "none", border: "none", children: /* @__PURE__ */ jsxRuntime.jsx(AddressDisplay, { wallet: account }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(react.CardFooter, { pt: 0, justify: "center", children: /* @__PURE__ */ jsxRuntime.jsx(
+          react.Button,
+          {
+            size: "sm",
+            variant: "ghost",
+            leftIcon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { as: fa.FaEdit }),
+            onClick: onEditClick,
+            children: "Edit"
+          }
+        ) })
+      ]
+    }
+  );
+};
+var AccessAndSecurityContent = ({ setCurrentContent }) => {
   const { t } = reactI18next.useTranslation();
-  const { darkMode: isDark, network } = useVeChainKitConfig();
-  const { connection, smartAccount } = useWallet();
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { w: "full", justifyContent: "space-between", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(react.Text, { fontSize: "sm", color: isDark ? "#dfdfdd" : "#4d4d4d", children: [
-        t("Connection Type"),
-        ":"
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", color: isDark ? "#dfdfdd" : "#4d4d4d", children: connection.source.type })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { w: "full", justifyContent: "space-between", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(react.Text, { fontSize: "sm", color: isDark ? "#dfdfdd" : "#4d4d4d", children: [
-        t("Network"),
-        ":"
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", color: isDark ? "#dfdfdd" : "#4d4d4d", children: network.type })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { w: "full", justifyContent: "space-between", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(react.Text, { fontSize: "sm", color: isDark ? "#dfdfdd" : "#4d4d4d", children: [
-        t("Node URL"),
-        ":"
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", color: isDark ? "#dfdfdd" : "#4d4d4d", children: network.nodeUrl || chunkEO3CLT4E_cjs.getConfig(network.type).nodeUrl })
-    ] }),
-    connection.isConnectedWithPrivy ? /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { w: "full", justifyContent: "space-between", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(react.Text, { fontSize: "sm", color: isDark ? "#dfdfdd" : "#4d4d4d", children: [
-        t("Smart Account"),
-        ":"
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", color: isDark ? "#dfdfdd" : "#4d4d4d", children: smartAccount.version ? `v${smartAccount.version}` : "v1" })
-    ] }) : smartAccount.isDeployed && /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { w: "full", justifyContent: "space-between", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(
-        react.Text,
+  const { linkPasskey } = reactAuth.usePrivy();
+  const { darkMode: isDark, privy } = useVeChainKitConfig();
+  const { connection } = useWallet();
+  return /* @__PURE__ */ jsxRuntime.jsxs(ScrollToTopWrapper, { children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(StickyHeaderContainer, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        react.ModalHeader,
         {
-          fontSize: "sm",
+          fontSize: "md",
+          fontWeight: "500",
+          textAlign: "center",
           color: isDark ? "#dfdfdd" : "#4d4d4d",
-          children: [
-            t("Smart Account"),
-            ":"
-          ]
+          children: t("Access and security")
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsx(
-        react.Text,
+        ModalBackButton,
         {
-          fontSize: "sm",
-          color: isDark ? "#dfdfdd" : "#4d4d4d",
-          children: smartAccount.version ? `v${smartAccount.version}` : "v1"
+          onClick: () => setCurrentContent("settings")
         }
-      )
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(react.ModalCloseButton, {})
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { w: "full", justifyContent: "space-between", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(react.Text, { fontSize: "sm", color: isDark ? "#dfdfdd" : "#4d4d4d", children: [
-        t("VeChain Kit"),
-        ":"
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", color: isDark ? "#dfdfdd" : "#4d4d4d", children: package_default.version })
-    ] })
-  ] });
-};
-var CrossAppConnectionCard = ({ connectionCache }) => {
-  const { t } = reactI18next.useTranslation();
-  const { darkMode: isDark } = useVeChainKitConfig();
-  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: connectionCache.ecosystemApp && /* @__PURE__ */ jsxRuntime.jsxs(
-    react.VStack,
-    {
-      p: 4,
-      bg: isDark ? "#1a1a1a" : "#f5f5f5",
-      borderRadius: "xl",
-      spacing: 4,
-      w: "full",
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { w: "full", justifyContent: "space-between", children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(
-            react.Text,
+    /* @__PURE__ */ jsxRuntime.jsx(react.ModalBody, { w: "full", children: /* @__PURE__ */ jsxRuntime.jsxs(
+      react.VStack,
+      {
+        justify: "center",
+        spacing: 3,
+        align: "flex-start",
+        w: "full",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", opacity: 0.5, children: t(
+            "Manage your embedded wallet security settings or back it up to a new device."
+          ) }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            ActionButton,
+            {
+              title: t("Passkey"),
+              description: t(
+                "Enable one click login by adding a passkey to your account."
+              ),
+              onClick: () => {
+                linkPasskey();
+              },
+              leftIcon: io.IoIosFingerPrint,
+              rightIcon: void 0,
+              isDisabled: !privy?.allowPasskeyLinking
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            ActionButton,
+            {
+              title: t("Login methods"),
+              description: t(
+                connection.isConnectedWithSocialLogin ? "View and manage the login methods linked to your wallet." : "Login methods can be managed only in the app securing your wallet."
+              ),
+              onClick: () => {
+                setCurrentContent("privy-linked-accounts");
+              },
+              isDisabled: !connection.isConnectedWithSocialLogin,
+              leftIcon: gr.GrUserAdmin,
+              rightIcon: md.MdOutlineNavigateNext
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            ActionButton,
+            {
+              title: t("Embedded wallet"),
+              description: t(
+                connection.isConnectedWithSocialLogin ? "Store your Recovery Phrase or Private Key in a secure location, avoid losing access to your assets." : "Backup can be done only in the app securing your wallet."
+              ),
+              onClick: () => {
+                setCurrentContent("embedded-wallet");
+              },
+              leftIcon: hi2.HiOutlineWallet,
+              rightIcon: md.MdOutlineNavigateNext
+            }
+          )
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsx(react.ModalFooter, { w: "full" })
+  ] });
+};
+var SettingsContent = ({
+  setCurrentContent,
+  onLogoutSuccess
+}) => {
+  const contentRef = React8.useRef(null);
+  const { t } = reactI18next.useTranslation();
+  const { privy, darkMode: isDark } = useVeChainKitConfig();
+  const { connection, disconnect } = useWallet();
+  const { getConnectionCache } = useCrossAppConnectionCache();
+  const connectionCache = getConnectionCache();
+  const { data: appInfo } = useFetchAppInfo(privy?.appId ?? "");
+  const { getNotifications } = useNotifications();
+  const notifications = getNotifications();
+  const hasUnreadNotifications = notifications.some((n) => !n.isRead);
+  React8.useEffect(() => {
+    if (contentRef.current) {
+      contentRef.current.scrollTop = 0;
+    }
+  }, []);
+  return /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(StickyHeaderContainer, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        react.ModalHeader,
+        {
+          fontSize: "md",
+          fontWeight: "500",
+          textAlign: "center",
+          color: isDark ? "#dfdfdd" : "#4d4d4d",
+          children: t("Settings")
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(ModalBackButton, { onClick: () => setCurrentContent("main") }),
+      /* @__PURE__ */ jsxRuntime.jsx(react.ModalCloseButton, {})
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs(react.ModalBody, { w: "full", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        Profile,
+        {
+          onEditClick: () => setCurrentContent("account-customization")
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { w: "full", spacing: 0, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ActionButton,
+          {
+            style: {
+              marginTop: "10px",
+              borderBottomRadius: connection.isConnectedWithPrivy ? "0px" : "12px"
+            },
+            title: t("Connection details"),
+            description: t(
+              "View the details of your connection to this app."
+            ),
+            onClick: () => {
+              setCurrentContent("connection-details");
+            },
+            leftIcon: vsc.VscDebugDisconnect,
+            rightIcon: md.MdOutlineNavigateNext
+          }
+        ),
+        connection.isConnectedWithPrivy && /* @__PURE__ */ jsxRuntime.jsx(
+          ActionButton,
+          {
+            style: {
+              borderTopRadius: "0px"
+            },
+            title: t("Access and security"),
+            description: t(
+              "Manage your embedded wallet security settings or back it up to a new device."
+            ),
+            onClick: () => {
+              setCurrentContent("access-and-security");
+            },
+            leftIcon: io5.IoShieldOutline,
+            rightIcon: md.MdOutlineNavigateNext
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ActionButton,
+          {
+            style: {
+              marginTop: "10px",
+              borderBottomRadius: "0px"
+            },
+            title: t("Notifications"),
+            description: t("View your notifications and updates."),
+            onClick: () => {
+              setCurrentContent("notifications");
+            },
+            leftIcon: bi.BiBell,
+            rightIcon: md.MdOutlineNavigateNext,
+            extraContent: hasUnreadNotifications && /* @__PURE__ */ jsxRuntime.jsx(
+              react.Box,
+              {
+                minWidth: "16px",
+                height: "16px",
+                bg: "red.500",
+                borderRadius: "full",
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "center",
+                ml: 2,
+                children: /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "xs", color: "white", children: notifications.filter(
+                  (n) => !n.isRead
+                ).length })
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ActionButton,
+          {
+            title: t("Help"),
+            description: t(
+              "Still have some doubts? Check out our FAQs and learn more.",
+              {
+                appName: connection.isConnectedWithCrossApp ? connectionCache?.ecosystemApp?.name : Object.values(appInfo ?? {})[0]?.name ?? ""
+              }
+            ),
+            onClick: () => setCurrentContent("faq"),
+            leftIcon: bs.BsQuestionCircle,
+            rightIcon: md.MdOutlineNavigateNext,
+            style: {
+              borderTopRadius: "0px"
+            }
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(react.ModalFooter, { w: "full", children: /* @__PURE__ */ jsxRuntime.jsx(
+      react.Button,
+      {
+        onClick: () => setCurrentContent({
+          type: "disconnect-confirm",
+          props: {
+            onDisconnect: () => {
+              disconnect();
+              onLogoutSuccess();
+            },
+            onBack: () => setCurrentContent("settings")
+          }
+        }),
+        variant: "vechainKitSecondary",
+        leftIcon: /* @__PURE__ */ jsxRuntime.jsx(ri.RiLogoutBoxLine, { color: "#888888" }),
+        children: t("Logout")
+      }
+    ) })
+  ] });
+};
+var AccountCustomizationContent = ({ setCurrentContent }) => {
+  const { t } = reactI18next.useTranslation();
+  const { network, darkMode: isDark } = useVeChainKitConfig();
+  const { account } = useWallet();
+  const fileInputRef = React8.useRef(null);
+  const [isUploading, setIsUploading] = React8.useState(false);
+  const [isProcessing, setIsProcessing] = React8.useState(false);
+  const [showFullText, setShowFullText] = React8.useState(false);
+  const queryClient = reactQuery.useQueryClient();
+  const { onUpload } = useSingleImageUpload({
+    compressImage: true
+  });
+  const { updateAvatar } = useUpdateAvatarRecord({
+    onSuccess: async () => {
+      await queryClient.invalidateQueries({
+        queryKey: getAvatarQueryKey(account?.domain ?? "")
+      });
+      await queryClient.refetchQueries({
+        queryKey: getAvatarQueryKey(account?.domain ?? "")
+      });
+      setIsProcessing(false);
+    },
+    onError: () => {
+      setIsProcessing(false);
+    }
+  });
+  const handleImageUpload = async (event) => {
+    const file = event.target.files?.[0];
+    if (!file) return;
+    try {
+      setIsUploading(true);
+      setIsProcessing(true);
+      const uploadedImage = await onUpload(file);
+      if (!uploadedImage) throw new Error("Failed to compress image");
+      const ipfsHash = await chunkEO3CLT4E_cjs.uploadBlobToIPFS(
+        uploadedImage.file,
+        file.name,
+        network.type
+      );
+      await updateAvatar(account?.domain ?? "", "ipfs://" + ipfsHash);
+    } catch (error) {
+      console.error("Error uploading image:", error);
+      setIsProcessing(false);
+    } finally {
+      setIsUploading(false);
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(StickyHeaderContainer, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        react.ModalHeader,
+        {
+          fontSize: "md",
+          fontWeight: "500",
+          textAlign: "center",
+          color: isDark ? "#dfdfdd" : "#4d4d4d",
+          children: t("Customize Account")
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        ModalBackButton,
+        {
+          onClick: () => setCurrentContent("settings")
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(react.ModalCloseButton, {})
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(react.ModalBody, { children: /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { spacing: 3, align: "center", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        react.VStack,
+        {
+          spacing: 3,
+          w: "full",
+          justifyContent: "flex-start",
+          alignItems: "flex-start",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", opacity: 0.5, children: t(
+              "Customize your account with a unique .vet domain name and profile image to enhance your identity across VeChain applications."
+            ) }),
+            showFullText && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+              /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", opacity: 0.5, children: t(
+                "Your customizations are linked to your .vet domain name, making them portable across different applications."
+              ) }),
+              /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", opacity: 0.5, children: t(
+                "To get started with customization, first secure your .vet domain name. Once you have a domain, you can add a profile image that will be visible wherever you use your account."
+              ) }),
+              /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", opacity: 0.5, children: t(
+                "Changing your domain name will update also your profile image."
+              ) })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              react.Button,
+              {
+                mt: 0,
+                variant: "link",
+                size: "sm",
+                onClick: () => setShowFullText(!showFullText),
+                color: "blue.500",
+                textAlign: "left",
+                children: t(showFullText ? "Show Less" : "Read More")
+              }
+            )
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        ActionButton,
+        {
+          style: {
+            mt: 3
+          },
+          title: account?.domain ? account?.domain : t("Choose account name"),
+          description: t(
+            "Choose a unique .vet domain name for your account."
+          ),
+          onClick: () => {
+            if (account?.domain) {
+              setCurrentContent({
+                type: "choose-name-search",
+                props: {
+                  name: "",
+                  setCurrentContent
+                }
+              });
+            } else {
+              setCurrentContent("choose-name");
+            }
+          },
+          leftIcon: fa.FaRegAddressCard,
+          rightIcon: md.MdOutlineNavigateNext
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        ActionButton,
+        {
+          title: t("Update profile image"),
+          description: t(
+            !account?.domain ? "You can change your profile image only after you setup your domain name." : "Customize your account by adding a profile image, which will be displayed on the apps you use."
+          ),
+          onClick: () => fileInputRef.current?.click(),
+          leftImage: account?.image,
+          isLoading: isUploading || isProcessing,
+          isDisabled: !account?.domain,
+          loadingText: isUploading ? t("Uploading image") : t("Setting image")
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          type: "file",
+          ref: fileInputRef,
+          hidden: true,
+          accept: "image/*",
+          onChange: async (event) => await handleImageUpload(event)
+        }
+      )
+    ] }) })
+  ] });
+};
+var NetworkInfo = () => {
+  const { t } = reactI18next.useTranslation();
+  const { darkMode: isDark, network } = useVeChainKitConfig();
+  const { connection, smartAccount } = useWallet();
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { w: "full", justifyContent: "space-between", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(react.Text, { fontSize: "sm", color: isDark ? "#dfdfdd" : "#4d4d4d", children: [
+        t("Connection Type"),
+        ":"
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", color: isDark ? "#dfdfdd" : "#4d4d4d", children: connection.source.type })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { w: "full", justifyContent: "space-between", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(react.Text, { fontSize: "sm", color: isDark ? "#dfdfdd" : "#4d4d4d", children: [
+        t("Network"),
+        ":"
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", color: isDark ? "#dfdfdd" : "#4d4d4d", children: network.type })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { w: "full", justifyContent: "space-between", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(react.Text, { fontSize: "sm", color: isDark ? "#dfdfdd" : "#4d4d4d", children: [
+        t("Node URL"),
+        ":"
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", color: isDark ? "#dfdfdd" : "#4d4d4d", children: network.nodeUrl || chunkEO3CLT4E_cjs.getConfig(network.type).nodeUrl })
+    ] }),
+    connection.isConnectedWithPrivy ? /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { w: "full", justifyContent: "space-between", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(react.Text, { fontSize: "sm", color: isDark ? "#dfdfdd" : "#4d4d4d", children: [
+        t("Smart Account"),
+        ":"
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", color: isDark ? "#dfdfdd" : "#4d4d4d", children: smartAccount.version ? `v${smartAccount.version}` : "v1" })
+    ] }) : smartAccount.isDeployed && /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { w: "full", justifyContent: "space-between", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        react.Text,
+        {
+          fontSize: "sm",
+          color: isDark ? "#dfdfdd" : "#4d4d4d",
+          children: [
+            t("Smart Account"),
+            ":"
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        react.Text,
+        {
+          fontSize: "sm",
+          color: isDark ? "#dfdfdd" : "#4d4d4d",
+          children: smartAccount.version ? `v${smartAccount.version}` : "v1"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { w: "full", justifyContent: "space-between", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(react.Text, { fontSize: "sm", color: isDark ? "#dfdfdd" : "#4d4d4d", children: [
+        t("VeChain Kit"),
+        ":"
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", color: isDark ? "#dfdfdd" : "#4d4d4d", children: package_default.version })
+    ] })
+  ] });
+};
+var CrossAppConnectionCard = ({ connectionCache }) => {
+  const { t } = reactI18next.useTranslation();
+  const { darkMode: isDark } = useVeChainKitConfig();
+  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: connectionCache.ecosystemApp && /* @__PURE__ */ jsxRuntime.jsxs(
+    react.VStack,
+    {
+      p: 4,
+      bg: isDark ? "#1a1a1a" : "#f5f5f5",
+      borderRadius: "xl",
+      spacing: 4,
+      w: "full",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { w: "full", justifyContent: "space-between", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            react.Text,
             {
               fontSize: "sm",
               color: isDark ? "#dfdfdd" : "#4d4d4d",
@@ -7126,14 +7666,13 @@ var WalletSecuredBy = () => {
 };
 var EmbeddedWalletContent = ({ setCurrentContent }) => {
   const { t } = reactI18next.useTranslation();
-  const [showFullText, setShowFullText] = React9.useState(false);
-  const { connectedWallet } = useWallet();
-  const { exportWallet } = reactAuth.usePrivy();
+  const { connectedWallet, connection } = useWallet();
+  const [showFullText, setShowFullText] = React8.useState(false);
   const walletImage = chunkEO3CLT4E_cjs.getPicassoImage(connectedWallet?.address ?? "");
   const { getConnectionCache } = useCrossAppConnectionCache();
-  const { darkMode: isDark } = useVeChainKitConfig();
-  const { connection } = useWallet();
   const connectionCache = getConnectionCache();
+  const { darkMode: isDark } = useVeChainKitConfig();
+  const { exportWallet } = reactAuth.usePrivy();
   return /* @__PURE__ */ jsxRuntime.jsxs(ScrollToTopWrapper, { children: [
     /* @__PURE__ */ jsxRuntime.jsxs(StickyHeaderContainer, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(
@@ -7143,13 +7682,13 @@ var EmbeddedWalletContent = ({ setCurrentContent }) => {
           fontWeight: "500",
           textAlign: "center",
           color: isDark ? "#dfdfdd" : "#4d4d4d",
-          children: t("Embedded Wallet")
+          children: t("Embedded wallet")
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsx(
         ModalBackButton,
         {
-          onClick: () => setCurrentContent("settings")
+          onClick: () => setCurrentContent("access-and-security")
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsx(react.ModalCloseButton, {})
@@ -7247,278 +7786,8 @@ var EmbeddedWalletContent = ({ setCurrentContent }) => {
                 " ",
                 t(
                   "to learn more about embedded wallets."
-                )
-              ] })
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              react.Button,
-              {
-                mt: 0,
-                variant: "link",
-                size: "sm",
-                onClick: () => setShowFullText(!showFullText),
-                color: "blue.500",
-                textAlign: "left",
-                children: t(showFullText ? "Show Less" : "Read More")
-              }
-            )
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ActionButton,
-            {
-              title: t("Backup your wallet"),
-              description: t(
-                connection.isConnectedWithSocialLogin ? "Store your Recovery Phrase or Private Key in a secure location, avoid losing access to your assets." : "Backup can be done only in the app securing your wallet."
-              ),
-              onClick: () => {
-                exportWallet();
-              },
-              isDisabled: !connection.isConnectedWithSocialLogin,
-              leftIcon: gi.GiHouseKeys,
-              rightIcon: md.MdOutlineNavigateNext
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ActionButton,
-            {
-              title: t("Login methods"),
-              description: t(
-                connection.isConnectedWithSocialLogin ? "View and manage the login methods linked to your wallet." : "Login methods can be managed only in the app securing your wallet."
-              ),
-              onClick: () => {
-                setCurrentContent("privy-linked-accounts");
-              },
-              isDisabled: !connection.isConnectedWithSocialLogin,
-              leftIcon: md.MdManageAccounts,
-              rightIcon: md.MdOutlineNavigateNext
-            }
-          )
-        ]
-      }
-    ) }),
-    /* @__PURE__ */ jsxRuntime.jsx(react.ModalFooter, { w: "full", children: /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { w: "full", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(react.Divider, {}),
-      connection.isConnectedWithPrivy && /* @__PURE__ */ jsxRuntime.jsx(WalletSecuredBy, {})
-    ] }) })
-  ] });
-};
-var WalletSettingsContent = ({
-  setCurrentContent,
-  onLogoutSuccess
-}) => {
-  const contentRef = React9.useRef(null);
-  const { t } = reactI18next.useTranslation();
-  const { privy, darkMode: isDark, network } = useVeChainKitConfig();
-  const { connection, disconnect, account } = useWallet();
-  const { getConnectionCache } = useCrossAppConnectionCache();
-  const connectionCache = getConnectionCache();
-  const { data: appInfo } = useFetchAppInfo(privy?.appId ?? "");
-  React9.useEffect(() => {
-    if (contentRef.current) {
-      contentRef.current.scrollTop = 0;
-    }
-  }, []);
-  return /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(StickyHeaderContainer, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        react.ModalHeader,
-        {
-          fontSize: "md",
-          fontWeight: "500",
-          textAlign: "center",
-          color: isDark ? "#dfdfdd" : "#4d4d4d",
-          children: t("Settings")
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(ModalBackButton, { onClick: () => setCurrentContent("main") }),
-      /* @__PURE__ */ jsxRuntime.jsx(react.ModalCloseButton, {})
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs(react.ModalBody, { w: "full", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { justify: "center", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          react.Image,
-          {
-            src: account?.image,
-            maxW: "100px",
-            borderRadius: "50%"
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(AddressDisplay, { wallet: account }),
-        network.type !== "main" && /* @__PURE__ */ jsxRuntime.jsx(
-          react.Tag,
-          {
-            size: "sm",
-            colorScheme: "blue",
-            width: "fit-content",
-            justifyContent: "center",
-            padding: "10px",
-            children: network.type === "test" ? t("Testnet") : t("Unknown")
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { mt: 10, w: "full", spacing: 3, children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ActionButton,
-          {
-            title: t("Connection Details"),
-            description: t(
-              "View the details of your connection to this app."
-            ),
-            onClick: () => {
-              setCurrentContent("connection-details");
-            },
-            leftIcon: vsc.VscDebugDisconnect,
-            rightIcon: md.MdOutlineNavigateNext
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ActionButton,
-          {
-            title: t("Customize account"),
-            description: t(
-              "Customize your account with a nickname and a picture to easily identify it."
-            ),
-            onClick: () => {
-              setCurrentContent("account-customization");
-            },
-            leftIcon: gi.GiPaintBrush,
-            rightIcon: md.MdOutlineNavigateNext
-          }
-        ),
-        connection.isConnectedWithPrivy && /* @__PURE__ */ jsxRuntime.jsx(
-          ActionButton,
-          {
-            title: t("Embedded Wallet"),
-            description: t(
-              "Manage your embedded wallet security settings or back it up to a new device."
-            ),
-            onClick: () => {
-              setCurrentContent("embedded-wallet");
-            },
-            leftIcon: hi2.HiOutlineWallet,
-            rightIcon: md.MdOutlineNavigateNext
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ActionButton,
-          {
-            title: t("FAQs"),
-            description: t(
-              "Still have some doubts? Check out our FAQs and learn more.",
-              {
-                appName: connection.isConnectedWithCrossApp ? connectionCache?.ecosystemApp?.name : Object.values(appInfo ?? {})[0]?.name ?? ""
-              }
-            ),
-            onClick: () => setCurrentContent("faq"),
-            leftIcon: bs.BsQuestionCircle,
-            rightIcon: md.MdOutlineNavigateNext
-          }
-        )
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(react.ModalFooter, { w: "full", children: /* @__PURE__ */ jsxRuntime.jsx(
-      react.Button,
-      {
-        onClick: () => {
-          disconnect();
-          onLogoutSuccess();
-        },
-        variant: "vechainKitSecondary",
-        leftIcon: /* @__PURE__ */ jsxRuntime.jsx(ri.RiLogoutBoxLine, { color: "#888888" }),
-        children: t("Logout")
-      }
-    ) })
-  ] });
-};
-var AccountCustomizationContent = ({ setCurrentContent }) => {
-  const { t } = reactI18next.useTranslation();
-  const { network, darkMode: isDark } = useVeChainKitConfig();
-  const { account } = useWallet();
-  const fileInputRef = React9.useRef(null);
-  const [isUploading, setIsUploading] = React9.useState(false);
-  const [isProcessing, setIsProcessing] = React9.useState(false);
-  const [showFullText, setShowFullText] = React9.useState(false);
-  const queryClient = reactQuery.useQueryClient();
-  const { onUpload } = useSingleImageUpload({
-    compressImage: true
-  });
-  const { updateAvatar } = useUpdateAvatarRecord({
-    onSuccess: async () => {
-      await queryClient.invalidateQueries({
-        queryKey: getAvatarQueryKey(account?.domain ?? "")
-      });
-      await queryClient.refetchQueries({
-        queryKey: getAvatarQueryKey(account?.domain ?? "")
-      });
-      setIsProcessing(false);
-    },
-    onError: () => {
-      setIsProcessing(false);
-    }
-  });
-  const handleImageUpload = async (event) => {
-    const file = event.target.files?.[0];
-    if (!file) return;
-    try {
-      setIsUploading(true);
-      setIsProcessing(true);
-      const uploadedImage = await onUpload(file);
-      if (!uploadedImage) throw new Error("Failed to compress image");
-      const ipfsHash = await chunkEO3CLT4E_cjs.uploadBlobToIPFS(
-        uploadedImage.file,
-        file.name,
-        network.type
-      );
-      await updateAvatar(account?.domain ?? "", "ipfs://" + ipfsHash);
-    } catch (error) {
-      console.error("Error uploading image:", error);
-      setIsProcessing(false);
-    } finally {
-      setIsUploading(false);
-    }
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(StickyHeaderContainer, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        react.ModalHeader,
-        {
-          fontSize: "md",
-          fontWeight: "500",
-          textAlign: "center",
-          color: isDark ? "#dfdfdd" : "#4d4d4d",
-          children: t("Customize Account")
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        ModalBackButton,
-        {
-          onClick: () => setCurrentContent("settings")
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(react.ModalCloseButton, {})
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(react.ModalBody, { children: /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { spacing: 3, align: "center", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(
-        react.VStack,
-        {
-          spacing: 3,
-          w: "full",
-          justifyContent: "flex-start",
-          alignItems: "flex-start",
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", opacity: 0.5, children: t(
-              "Customize your account with a unique .vet domain name and profile image to enhance your identity across VeChain applications."
-            ) }),
-            showFullText && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-              /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", opacity: 0.5, children: t(
-                "Your customizations are linked to your .vet domain name, making them portable across different applications."
-              ) }),
-              /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", opacity: 0.5, children: t(
-                "To get started with customization, first secure your .vet domain name. Once you have a domain, you can add a profile image that will be visible wherever you use your account."
-              ) }),
-              /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", opacity: 0.5, children: t(
-                "Changing your domain name will update also your profile image."
-              ) })
+                )
+              ] })
             ] }),
             /* @__PURE__ */ jsxRuntime.jsx(
               react.Button,
@@ -7532,60 +7801,27 @@ var AccountCustomizationContent = ({ setCurrentContent }) => {
                 children: t(showFullText ? "Show Less" : "Read More")
               }
             )
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        ActionButton,
-        {
-          style: {
-            mt: 3
-          },
-          title: account?.domain ? account?.domain : t("Choose account name"),
-          description: t(
-            "Choose a unique .vet domain name for your account."
-          ),
-          onClick: () => {
-            if (account?.domain) {
-              setCurrentContent({
-                type: "choose-name-search",
-                props: {
-                  name: "",
-                  setCurrentContent
-                }
-              });
-            } else {
-              setCurrentContent("choose-name");
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            ActionButton,
+            {
+              title: t("Backup your wallet"),
+              description: t(
+                connection.isConnectedWithSocialLogin ? "Store your Recovery Phrase or Private Key in a secure location, avoid losing access to your assets." : "Backup can be done only in the app securing your wallet."
+              ),
+              onClick: () => {
+                exportWallet();
+              },
+              isDisabled: !connection.isConnectedWithSocialLogin,
+              leftIcon: gi.GiHouseKeys
             }
-          },
-          leftIcon: fa.FaRegAddressCard,
-          rightIcon: md.MdOutlineNavigateNext
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        ActionButton,
-        {
-          title: t("Update profile image"),
-          description: t(
-            !account?.domain ? "You can change your profile image only after you setup your domain name." : "Customize your account by adding a profile image, which will be displayed on the apps you use."
-          ),
-          onClick: () => fileInputRef.current?.click(),
-          leftImage: account?.image,
-          isLoading: isUploading || isProcessing,
-          isDisabled: !account?.domain,
-          loadingText: isUploading ? t("Uploading image") : t("Setting image")
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "input",
-        {
-          type: "file",
-          ref: fileInputRef,
-          hidden: true,
-          accept: "image/*",
-          onChange: async (event) => await handleImageUpload(event)
-        }
-      )
+          )
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsx(react.ModalFooter, { w: "full", children: /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { w: "full", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(react.Divider, {}),
+      connection.isConnectedWithPrivy && /* @__PURE__ */ jsxRuntime.jsx(WalletSecuredBy, {})
     ] }) })
   ] });
 };
@@ -7596,7 +7832,7 @@ var SelectTokenContent = ({ onSelectToken, onBack }) => {
   const { balances, prices } = useBalances({
     address: account?.address ?? ""
   });
-  const [searchQuery, setSearchQuery] = React9.useState("");
+  const [searchQuery, setSearchQuery] = React8.useState("");
   const { network } = useVeChainKitConfig();
   const tokens = [
     {
@@ -7732,23 +7968,23 @@ var SendTokenContent = ({
 }) => {
   const { t } = reactI18next.useTranslation();
   const { darkMode: isDark } = useVeChainKitConfig();
-  const [toAddressOrDomain, setToAddress] = React9.useState("");
-  const [amount, setAmount] = React9.useState("");
-  const [error, setError] = React9.useState(null);
-  const [isSelectingToken, setIsSelectingToken] = React9.useState(
+  const [toAddressOrDomain, setToAddress] = React8.useState("");
+  const [amount, setAmount] = React8.useState("");
+  const [error, setError] = React8.useState(null);
+  const [isSelectingToken, setIsSelectingToken] = React8.useState(
     isNavigatingFromMain && !preselectedToken
   );
-  const [selectedToken, setSelectedToken] = React9.useState(
+  const [selectedToken, setSelectedToken] = React8.useState(
     preselectedToken ?? null
   );
-  const [addressError, setAddressError] = React9.useState(null);
-  const [isInitialTokenSelection, setIsInitialTokenSelection] = React9.useState(isNavigatingFromMain);
+  const [addressError, setAddressError] = React8.useState(null);
+  const [isInitialTokenSelection, setIsInitialTokenSelection] = React8.useState(isNavigatingFromMain);
   const {
     domain: resolvedDomain,
     address: resolvedAddress,
     isLoading: isLoadingDomain
   } = dappKitReact.useVechainDomain({ addressOrDomain: toAddressOrDomain });
-  const validateAddress = React9.useCallback(
+  const validateAddress = React8.useCallback(
     (value) => {
       if (!value) {
         setAddressError(t("Address is required"));
@@ -8060,6 +8296,14 @@ var SendTokenSummaryContent = ({
   const { darkMode: isDark } = useVeChainKitConfig();
   const { account, connection } = useWallet();
   const transactionModal = react.useDisclosure();
+  const { data: avatar } = useGetAvatar(resolvedDomain);
+  const { network } = useVeChainKitConfig();
+  const toImageSrc = React8.useMemo(() => {
+    if (avatar) {
+      return chunkEO3CLT4E_cjs.convertUriToUrl(avatar, network.type);
+    }
+    return chunkEO3CLT4E_cjs.getPicassoImage(resolvedAddress || toAddressOrDomain);
+  }, [avatar, network.type, resolvedAddress, toAddressOrDomain]);
   const transferERC20 = useTransferERC20({
     fromAddress: account?.address ?? "",
     receiverAddress: resolvedAddress || toAddressOrDomain,
@@ -8111,20 +8355,7 @@ var SendTokenSummaryContent = ({
       /* @__PURE__ */ jsxRuntime.jsx(react.ModalCloseButton, {})
     ] }),
     /* @__PURE__ */ jsxRuntime.jsx(react.ModalBody, { children: /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { spacing: 6, align: "stretch", w: "full", children: [
-      connection.isConnectedWithPrivy && /* @__PURE__ */ jsxRuntime.jsxs(
-        react.Alert,
-        {
-          status: "warning",
-          fontSize: "xs",
-          borderRadius: "xl",
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(react.AlertIcon, {}),
-            t(
-              "Sending to OceanX or other exchanges may result in loss of funds. Send the tokens to your VeWorld wallet first."
-            )
-          ]
-        }
-      ),
+      connection.isConnectedWithPrivy && /* @__PURE__ */ jsxRuntime.jsx(ExchangeWarningAlert, {}),
       /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { spacing: 4, w: "full", children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           AddressDisplayCard,
@@ -8144,9 +8375,7 @@ var SendTokenSummaryContent = ({
             label: t("To"),
             address: resolvedAddress || toAddressOrDomain,
             domain: resolvedDomain,
-            imageSrc: chunkEO3CLT4E_cjs.getPicassoImage(
-              resolvedAddress || toAddressOrDomain
-            ),
+            imageSrc: toImageSrc ?? "",
             imageAlt: "To account",
             symbol: selectedToken.symbol
           }
@@ -8390,6 +8619,123 @@ var ChooseNameContent = ({
     ] }) })
   ] });
 };
+var ExistingDomainsList = ({
+  domains,
+  onDomainSelect,
+  isLoading
+}) => {
+  const { t } = reactI18next.useTranslation();
+  const { darkMode: isDark } = useVeChainKitConfig();
+  const { account, connection } = useWallet();
+  if (domains.length === 0 || isLoading) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(react.Accordion, { allowToggle: true, children: /* @__PURE__ */ jsxRuntime.jsx(react.AccordionItem, { border: "none", children: ({ isExpanded }) => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      react.AccordionButton,
+      {
+        bg: isDark ? "whiteAlpha.50" : "gray.50",
+        borderRadius: "xl",
+        _hover: {
+          bg: isDark ? "whiteAlpha.100" : "gray.100"
+        },
+        opacity: isLoading ? 0.7 : 1,
+        transition: "all 0.2s",
+        disabled: isLoading,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(react.Box, { flex: "1", textAlign: "left", py: 2, children: /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontWeight: "500", children: isLoading ? t("Loading your domains...") : `${t("Your existing domains")} (${domains.length})` }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            react.Icon,
+            {
+              as: isExpanded ? io5.IoChevronUp : io5.IoChevronDown,
+              fontSize: "20px",
+              opacity: 0.5
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(react.AccordionPanel, { pb: 4, pt: 2, children: /* @__PURE__ */ jsxRuntime.jsx(react.List, { spacing: 2, children: domains.map((domain) => {
+      const isCurrentDomain = domain.name === account?.domain;
+      const metadata = useWalletMetadata(
+        domain.name,
+        connection.network
+      );
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        react.ListItem,
+        {
+          p: 4,
+          bg: isDark ? "#1f1f1e" : "white",
+          borderRadius: "xl",
+          cursor: isCurrentDomain ? "default" : "pointer",
+          opacity: isCurrentDomain ? 0.7 : 1,
+          border: `1px solid ${isDark ? "#2d2d2d" : "#eaeaea"}`,
+          _hover: {
+            bg: isCurrentDomain ? isDark ? "#1f1f1e" : "white" : isDark ? "#252525" : "gray.50",
+            borderColor: isDark ? "#3d3d3d" : "#dedede"
+          },
+          onClick: () => !isCurrentDomain && onDomainSelect(domain.name),
+          transition: "all 0.2s",
+          children: /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { spacing: 3, align: "center", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              AccountAvatar,
+              {
+                props: {
+                  width: "40px",
+                  height: "40px",
+                  src: metadata.image,
+                  alt: domain.name
+                }
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsxs(
+              react.VStack,
+              {
+                align: "start",
+                spacing: 0,
+                flex: 1,
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    react.Text,
+                    {
+                      color: isDark ? "whiteAlpha.900" : "gray.700",
+                      fontSize: "md",
+                      fontWeight: "500",
+                      children: domain.name
+                    }
+                  ),
+                  isCurrentDomain && /* @__PURE__ */ jsxRuntime.jsx(
+                    react.Text,
+                    {
+                      fontSize: "sm",
+                      color: isDark ? "whiteAlpha.600" : "gray.500",
+                      children: t(
+                        "Current domain"
+                      )
+                    }
+                  )
+                ]
+              }
+            ),
+            isCurrentDomain && /* @__PURE__ */ jsxRuntime.jsx(
+              react.Tag,
+              {
+                size: "sm",
+                bg: isDark ? "whiteAlpha.200" : "gray.100",
+                color: isDark ? "whiteAlpha.800" : "gray.600",
+                px: 3,
+                py: 1,
+                borderRadius: "full",
+                children: t("Current")
+              }
+            )
+          ] })
+        },
+        domain.name
+      );
+    }) }) })
+  ] }) }) });
+};
 var ChooseNameSearchContent = ({
   name: initialName,
   setCurrentContent
@@ -8397,11 +8743,11 @@ var ChooseNameSearchContent = ({
   const { t } = reactI18next.useTranslation();
   const { account } = useWallet();
   const { darkMode: isDark } = useVeChainKitConfig();
-  const [name, setName] = React9.useState(initialName);
-  const [error, setError] = React9.useState(null);
-  const [isOwnDomain, setIsOwnDomain] = React9.useState(false);
-  const [isAvailable, setIsAvailable] = React9.useState(false);
-  const [hasInteracted, setHasInteracted] = React9.useState(false);
+  const [name, setName] = React8.useState(initialName);
+  const [error, setError] = React8.useState(null);
+  const [isOwnDomain, setIsOwnDomain] = React8.useState(false);
+  const [isAvailable, setIsAvailable] = React8.useState(false);
+  const [hasInteracted, setHasInteracted] = React8.useState(false);
   const { data: ensRecordExists, isLoading: isEnsCheckLoading } = useEnsRecordExists(name);
   const { data: domainInfo, isLoading: isDomainInfoLoading } = useVechainDomain(`${name}.veworld.vet`);
   const { data: isProtected, isLoading: isProtectedLoading } = useIsDomainProtected(name);
@@ -8419,7 +8765,7 @@ var ChooseNameSearchContent = ({
     ...veworldDomainsOfAddress?.domains || [],
     ...vetDomainsOfAddress?.domains || []
   ];
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     if (!hasInteracted) return;
     if (name.length < 3) {
       setError(t("Name must be at least 3 characters long"));
@@ -8500,104 +8846,69 @@ var ChooseNameSearchContent = ({
       ),
       /* @__PURE__ */ jsxRuntime.jsx(react.ModalCloseButton, {})
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs(react.ModalBody, { children: [
-      isLoadingOwnedDomains ? /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", color: "gray.500", children: t("Loading your domains...") }) : allUserDomains.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { spacing: 4, align: "stretch", mb: 6, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(react.ModalBody, { children: /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { spacing: 4, align: "stretch", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        ExistingDomainsList,
+        {
+          domains: allUserDomains,
+          onDomainSelect: handleDomainSelect,
+          isLoading: isLoadingOwnedDomains
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs(react.InputGroup, { size: "lg", children: [
         /* @__PURE__ */ jsxRuntime.jsx(
-          react.Text,
+          react.Input,
           {
-            fontSize: "sm",
-            fontWeight: "500",
-            color: isDark ? "whiteAlpha.800" : "gray.600",
-            children: t("Your existing domains")
+            placeholder: t("Enter your name"),
+            value: name,
+            onChange: (e) => {
+              setName(e.target.value);
+              if (!hasInteracted) setHasInteracted(true);
+            },
+            paddingRight: "120px",
+            fontSize: "lg",
+            height: "60px",
+            bg: isDark ? "#1a1a1a" : "white",
+            border: `1px solid ${isDark ? "#ffffff29" : "#ebebeb"}`,
+            _hover: {
+              border: `1px solid ${isDark ? "#ffffff40" : "#e0e0e0"}`
+            },
+            _focus: {
+              border: `1px solid ${isDark ? "#ffffff60" : "#d0d0d0"}`,
+              boxShadow: "none"
+            },
+            isInvalid: !!error
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsx(react.List, { spacing: 2, children: allUserDomains.map((domain) => {
-          const isCurrentDomain = domain.name === account?.domain;
-          return /* @__PURE__ */ jsxRuntime.jsx(
-            react.ListItem,
-            {
-              p: 3,
-              bg: isDark ? "#1a1a1a" : "gray.50",
-              borderRadius: "md",
-              cursor: isCurrentDomain ? "default" : "pointer",
-              opacity: isCurrentDomain ? 0.7 : 1,
-              _hover: {
-                bg: isCurrentDomain ? isDark ? "#1a1a1a" : "gray.50" : isDark ? "#252525" : "gray.100"
-              },
-              onClick: () => !isCurrentDomain && handleDomainSelect(domain.name),
-              children: /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { justify: "space-between", children: [
-                /* @__PURE__ */ jsxRuntime.jsx(react.Text, { children: domain.name }),
-                isCurrentDomain && /* @__PURE__ */ jsxRuntime.jsx(
-                  react.Tag,
-                  {
-                    size: "sm",
-                    colorScheme: "green",
-                    variant: "subtle",
-                    children: t("Current")
-                  }
-                )
-              ] })
-            },
-            domain.name
-          );
-        }) })
-      ] }) : null,
-      /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { spacing: 4, align: "stretch", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(react.InputGroup, { size: "lg", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            react.Input,
-            {
-              placeholder: t("Enter your name"),
-              value: name,
-              onChange: (e) => {
-                setName(e.target.value);
-                if (!hasInteracted) setHasInteracted(true);
-              },
-              paddingRight: "120px",
-              fontSize: "lg",
-              height: "60px",
-              bg: isDark ? "#1a1a1a" : "white",
-              border: `1px solid ${isDark ? "#ffffff29" : "#ebebeb"}`,
-              _hover: {
-                border: `1px solid ${isDark ? "#ffffff40" : "#e0e0e0"}`
-              },
-              _focus: {
-                border: `1px solid ${isDark ? "#ffffff60" : "#d0d0d0"}`,
-                boxShadow: "none"
-              },
-              isInvalid: !!error
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            react.InputRightElement,
-            {
-              width: "auto",
-              paddingRight: "12px",
-              h: "full",
-              children: /* @__PURE__ */ jsxRuntime.jsx(
-                react.Box,
-                {
-                  mr: 4,
-                  fontSize: "sm",
-                  color: isDark ? "whiteAlpha.800" : "gray.500",
-                  children: ".veworld.vet"
-                }
-              )
-            }
-          )
-        ] }),
-        error && hasInteracted && /* @__PURE__ */ jsxRuntime.jsx(react.Text, { color: "red.500", fontSize: "sm", children: error }),
-        !error && hasInteracted && name.length >= 3 && /* @__PURE__ */ jsxRuntime.jsx(
-          react.Text,
+        /* @__PURE__ */ jsxRuntime.jsx(
+          react.InputRightElement,
           {
-            fontSize: "sm",
-            color: isAvailable ? "green.500" : "red.500",
-            fontWeight: "500",
-            children: isOwnDomain ? t("YOU OWN THIS") : isAvailable ? t("AVAILABLE") : t("UNAVAILABLE")
+            width: "auto",
+            paddingRight: "12px",
+            h: "full",
+            children: /* @__PURE__ */ jsxRuntime.jsx(
+              react.Box,
+              {
+                mr: 4,
+                fontSize: "sm",
+                color: isDark ? "whiteAlpha.800" : "gray.500",
+                children: ".veworld.vet"
+              }
+            )
           }
         )
-      ] })
-    ] }),
+      ] }),
+      error && hasInteracted && /* @__PURE__ */ jsxRuntime.jsx(react.Text, { color: "red.500", fontSize: "sm", children: error }),
+      !error && hasInteracted && name.length >= 3 && /* @__PURE__ */ jsxRuntime.jsx(
+        react.Text,
+        {
+          fontSize: "sm",
+          color: isAvailable ? "green.500" : "red.500",
+          fontWeight: "500",
+          children: isOwnDomain ? t("YOU OWN THIS") : isAvailable ? t("AVAILABLE") : t("UNAVAILABLE")
+        }
+      )
+    ] }) }),
     /* @__PURE__ */ jsxRuntime.jsx(react.ModalFooter, { children: /* @__PURE__ */ jsxRuntime.jsx(
       react.Button,
       {
@@ -8621,8 +8932,8 @@ var ConfirmationModalContent = ({
   const { t } = reactI18next.useTranslation();
   const { connection } = useWallet();
   const { darkMode: isDark } = useVeChainKitConfig();
-  const [showTimeout, setShowTimeout] = React9.useState(false);
-  React9.useEffect(() => {
+  const [showTimeout, setShowTimeout] = React8.useState(false);
+  React8.useEffect(() => {
     setShowTimeout(false);
     const timer = setTimeout(() => {
       setShowTimeout(true);
@@ -8809,8 +9120,8 @@ var LoadingModalContent = ({
   const { network } = useVeChainKitConfig();
   const { darkMode: isDark } = useVeChainKitConfig();
   const explorerUrl = chunkEO3CLT4E_cjs.getConfig(network.type).explorerUrl;
-  const [showTimeout, setShowTimeout] = React9.useState(false);
-  React9.useEffect(() => {
+  const [showTimeout, setShowTimeout] = React8.useState(false);
+  React8.useEffect(() => {
     const timer = setTimeout(() => {
       setShowTimeout(true);
     }, 12e3);
@@ -9021,7 +9332,7 @@ var TransactionModal = ({
   txId,
   progress
 }) => {
-  const modalContent = React9.useMemo(() => {
+  const modalContent = React8.useMemo(() => {
     if (status === "pending")
       return /* @__PURE__ */ jsxRuntime.jsx(
         ConfirmationModalContent,
@@ -9202,7 +9513,7 @@ var ChooseNameSummaryContent = ({
 var FAQAccordion = () => {
   const { t } = reactI18next.useTranslation();
   const { darkMode: isDark } = useVeChainKitConfig();
-  const [searchQuery, setSearchQuery] = React9.useState("");
+  const [searchQuery, setSearchQuery] = React8.useState("");
   const faqItems = [
     {
       question: t("What is VeChain?"),
@@ -9439,6 +9750,7 @@ var en_default = {
   "Continue with Google": "Continue with Google",
   "Copy your address or scan this QR code": "Copy your address or scan this QR code",
   Current: "Current",
+  "Current domain": "Current domain",
   "Currently, multiclause transactions are not supported for smart accounts. Your multiclause transaction will be split into multiple transactions.": "Currently, multiclause transactions are not supported for smart accounts. Your multiclause transaction will be split into multiple transactions.",
   "Customize Account": "Customize Account",
   "Customize account": "Customize account",
@@ -9537,6 +9849,7 @@ var en_default = {
   Passkey: "Passkey",
   "Phone Number": "Phone Number",
   "Please approve the request in the connection request window...": "Please approve the request in the connection request window...",
+  "Please be sure to keep this wallet safe and backed up.": "Please be sure to keep this wallet safe and backed up.",
   "Please check {{email}} for an email from privy.io and enter your code below.": "Please check {{email}} for an email from privy.io and enter your code below.",
   "Please click 'Try again' to open the login window.": "Please click 'Try again' to open the login window.",
   "Please complete the passkey authentication...": "Please complete the passkey authentication...",
@@ -9601,6 +9914,7 @@ var en_default = {
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} app or extension to manage your wallet and security settings.": "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} app or extension to manage your wallet and security settings.",
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} website to manage your login methods and security settings.": "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} website to manage your login methods and security settings.",
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} website to manage your wallet and security settings.": "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} website to manage your wallet and security settings.",
+  "This is your main wallet, created by {{element}} and secured by Privy.": "This is your main wallet, created by {{element}} and secured by Privy.",
   "This is your main wallet, created by {{element}} and secured by Privy. This wallet is the owner of your smart account, which is used as your identity and as a gateway for your blockchain interactions. Please be sure to keep it safe and backed up.": "This is your main wallet, created by {{element}} and secured by Privy. This wallet is the owner of your smart account, which is used as your identity and as a gateway for your blockchain interactions. Please be sure to keep it safe and backed up.",
   "This may take a few seconds. You can close this window and check the status later.": "This may take a few seconds. You can close this window and check the status later.",
   "This wallet is the owner of your smart account, which is used as your identity and as a gateway for your blockchain interactions.": "This wallet is the owner of your smart account, which is used as your identity and as a gateway for your blockchain interactions.",
@@ -9689,8 +10003,19 @@ var en_default = {
   "your@email.com": "your@email.com",
   "{{element}} website": "{{element}} website",
   "{{name}}": "{{name}}",
-  "This is your main wallet, created by {{element}} and secured by Privy.": "This is your main wallet, created by {{element}} and secured by Privy.",
-  "Please be sure to keep this wallet safe and backed up.": "Please be sure to keep this wallet safe and backed up."
+  "Sending to OceanX or other exchanges may result in loss of funds.": "Sending to OceanX or other exchanges may result in loss of funds.",
+  "Send the tokens to your VeWorld wallet first.": "Send the tokens to your VeWorld wallet first.",
+  "Sign in with a wallet from other x2earn apps.": "Sign in with a wallet from other x2earn apps.",
+  "Select an app": "Select an app",
+  Other: "Other",
+  Apps: "Apps",
+  "View your notifications and updates.": "View your notifications and updates.",
+  "Access and security": "Access and security",
+  "Connection details": "Connection details",
+  "Customize profile": "Customize profile",
+  Help: "Help",
+  "Add Passkey": "Add Passkey",
+  "Embedded wallet": "Embedded wallet"
 };
 
 // src/languages/de.json
@@ -9779,6 +10104,7 @@ var de_default = {
   "Continue with Google": "Mit Google fortfahren",
   "Copy your address or scan this QR code": "Kopieren Sie Ihre Adresse oder scannen Sie diesen QR-Code",
   Current: "Aktuell",
+  "Current domain": "Aktuelle Domain",
   "Currently, multiclause transactions are not supported for smart accounts. Your multiclause transaction will be split into multiple transactions.": "Derzeit werden Multiclauses-Transaktionen f\xFCr Smart-Konten nicht unterst\xFCtzt. Ihre Multiclause-Transaktion wird in mehrere Transaktionen aufgeteilt.",
   "Customize Account": "Konto anpassen",
   "Customize account": "Konto anpassen",
@@ -9877,6 +10203,7 @@ var de_default = {
   Passkey: "Passwort",
   "Phone Number": "Telefonnummer",
   "Please approve the request in the connection request window...": "Bitte genehmigen Sie die Anfrage im Verbindungsanfragefenster...",
+  "Please be sure to keep this wallet safe and backed up.": "Bitte stellen Sie sicher, dass diese Brieftasche sicher und gesichert aufbewahrt wird.",
   "Please check {{email}} for an email from privy.io and enter your code below.": "Bitte \xFCberpr\xFCfen Sie {{email}} auf eine E-Mail von privy.io und geben Sie Ihren Code unten ein.",
   "Please click 'Try again' to open the login window.": "Bitte klicken Sie auf 'Erneut versuchen', um das Anmeldefenster zu \xF6ffnen.",
   "Please complete the passkey authentication...": "Bitte schlie\xDFen Sie die Passworthauthentifizierung ab...",
@@ -9941,6 +10268,7 @@ var de_default = {
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} app or extension to manage your wallet and security settings.": "Dies ist Ihr Hauptwallet und Ihre Identit\xE4t. Bitte stellen Sie sicher, dass es sicher und gesichert ist. Gehen Sie zur {{element}} App oder Erweiterung, um Ihr Wallet und Ihre Sicherheitseinstellungen zu verwalten.",
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} website to manage your login methods and security settings.": "Dies ist Ihr Hauptwallet und Ihre Identit\xE4t. Bitte achten Sie darauf, es sicher zu verwahren und ein Backup zu erstellen. Gehen Sie auf die {{element}} Website, um Ihre Anmeldemethoden und Sicherheitseinstellungen zu verwalten.",
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} website to manage your wallet and security settings.": "Dies ist Ihre Hauptgeldb\xF6rse und Identit\xE4t. Bitte achten Sie darauf, sie sicher und abgesichert zu halten. Besuchen Sie die Website von {{element}}, um Ihre Geldb\xF6rse und Sicherheitseinstellungen zu verwalten.",
+  "This is your main wallet, created by {{element}} and secured by Privy.": "Dies ist Ihre Hauptbrieftasche, erstellt von {{element}} und gesichert durch Privy.",
   "This is your main wallet, created by {{element}} and secured by Privy. This wallet is the owner of your smart account, which is used as your identity and as a gateway for your blockchain interactions. Please be sure to keep it safe and backed up.": "Dies ist Ihr Haupt-Wallet, erstellt von {{element}} und gesichert von Privy. Dieses Wallet ist der Besitzer Ihres Smart-Accounts, der als Ihre Identit\xE4t und als Tor f\xFCr Ihre Blockchain-Interaktionen verwendet wird. Bitte stellen Sie sicher, dass es sicher und gesichert ist.",
   "This may take a few seconds. You can close this window and check the status later.": "Dies kann einige Sekunden dauern. Sie k\xF6nnen dieses Fenster schlie\xDFen und den Status sp\xE4ter \xFCberpr\xFCfen.",
   "This wallet is the owner of your smart account, which is used as your identity and as a gateway for your blockchain interactions.": "Dieses Wallet ist der Besitzer Ihres Smart-Accounts, der als Ihre Identit\xE4t und als Tor f\xFCr Ihre Blockchain-Interaktionen verwendet wird.",
@@ -10117,6 +10445,7 @@ var it_default = {
   "Continue with Google": "Continua con Google",
   "Copy your address or scan this QR code": "Copia il tuo indirizzo o scansiona questo codice QR",
   Current: "Attuale",
+  "Current domain": "Dominio attuale",
   "Currently, multiclause transactions are not supported for smart accounts. Your multiclause transaction will be split into multiple transactions.": "Attualmente, le transazioni multiclausole non sono supportate per gli account smart. La tua transazione multiclausola sar\xE0 divisa in pi\xF9 transazioni.",
   "Customize Account": "Personalizza Account",
   "Customize account": "Personalizza account",
@@ -10215,6 +10544,7 @@ var it_default = {
   Passkey: "Chiave di accesso",
   "Phone Number": "Numero di telefono",
   "Please approve the request in the connection request window...": "Si prega di approvare la richiesta nella finestra della richiesta di connessione...",
+  "Please be sure to keep this wallet safe and backed up.": "Si prega di assicurarsi che questo portafoglio sia al sicuro e con un backup.",
   "Please check {{email}} for an email from privy.io and enter your code below.": "Controlla {{email}} per un'email da privy.io e inserisci il tuo codice qui sotto.",
   "Please click 'Try again' to open the login window.": "Fai clic su 'Riprova' per aprire la finestra di accesso.",
   "Please complete the passkey authentication...": "Si prega di completare l'autenticazione con chiave di accesso...",
@@ -10279,6 +10609,7 @@ var it_default = {
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} app or extension to manage your wallet and security settings.": "Questo \xE8 il tuo portafoglio principale e la tua identit\xE0. Assicurati di tenerlo al sicuro e di eseguire il backup. Vai all'app o all'estensione {{element}} per gestire il tuo portafoglio e le impostazioni di sicurezza.",
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} website to manage your login methods and security settings.": "Questo \xE8 il tuo portafoglio principale e la tua identit\xE0. Assicurati di tenerlo al sicuro e di fare un backup. Vai al sito web {{element}} per gestire i metodi di accesso e le impostazioni di sicurezza.",
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} website to manage your wallet and security settings.": "Questo \xE8 il tuo portafoglio e identit\xE0 principale. Assicurati di tenerlo al sicuro e di averne una copia di backup. Vai al sito web di {{element}} per gestire le impostazioni del tuo portafoglio e della sicurezza.",
+  "This is your main wallet, created by {{element}} and secured by Privy.": "Questo \xE8 il tuo portafoglio principale, creato da {{element}} e protetto da Privy.",
   "This is your main wallet, created by {{element}} and secured by Privy. This wallet is the owner of your smart account, which is used as your identity and as a gateway for your blockchain interactions. Please be sure to keep it safe and backed up.": "Questo \xE8 il tuo portafoglio principale, creato da {{element}} e protetto da Privy. Questo portafoglio \xE8 il proprietario del tuo account smart, che \xE8 utilizzato come la tua identit\xE0 e come un gateway per le tue interazioni con la blockchain. Assicurati di tenerlo al sicuro e di eseguirne il backup.",
   "This may take a few seconds. You can close this window and check the status later.": "Potrebbe richiedere alcuni secondi. Puoi chiudere questa finestra e controllare lo stato pi\xF9 tardi.",
   "This wallet is the owner of your smart account, which is used as your identity and as a gateway for your blockchain interactions.": "Questo portafoglio \xE8 il proprietario del tuo account smart, che \xE8 utilizzato come la tua identit\xE0 e come un gateway per le tue interazioni con la blockchain.",
@@ -10455,6 +10786,7 @@ var fr_default = {
   "Continue with Google": "Continuer avec Google",
   "Copy your address or scan this QR code": "Copiez votre adresse ou scannez ce code QR",
   Current: "Actuel",
+  "Current domain": "Domaine actuel",
   "Currently, multiclause transactions are not supported for smart accounts. Your multiclause transaction will be split into multiple transactions.": "Actuellement, les transactions \xE0 clauses multiples ne sont pas prises en charge pour les comptes intelligents. Votre transaction \xE0 clauses multiples sera divis\xE9e en plusieurs transactions.",
   "Customize Account": "Personnaliser le compte",
   "Customize account": "Personnaliser le compte",
@@ -10553,6 +10885,7 @@ var fr_default = {
   Passkey: "Cl\xE9 de passe",
   "Phone Number": "Num\xE9ro de t\xE9l\xE9phone",
   "Please approve the request in the connection request window...": "Veuillez approuver la demande dans la fen\xEAtre de demande de connexion...",
+  "Please be sure to keep this wallet safe and backed up.": "Veuillez vous assurer que ce portefeuille est en s\xE9curit\xE9 et sauvegard\xE9.",
   "Please check {{email}} for an email from privy.io and enter your code below.": "Veuillez v\xE9rifier {{email}} pour un email de privy.io et entrez votre code ci-dessous.",
   "Please click 'Try again' to open the login window.": "Veuillez cliquer sur 'R\xE9essayer' pour ouvrir la fen\xEAtre de connexion.",
   "Please complete the passkey authentication...": "Veuillez compl\xE9ter l'authentification par cl\xE9 de passe...",
@@ -10617,6 +10950,7 @@ var fr_default = {
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} app or extension to manage your wallet and security settings.": "Ceci est votre portefeuille principal et votre identit\xE9. Veuillez vous assurer de le garder en s\xE9curit\xE9 et sauvegard\xE9. Allez dans l'application ou l'extension {{element}} pour g\xE9rer votre portefeuille et vos param\xE8tres de s\xE9curit\xE9.",
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} website to manage your login methods and security settings.": "Ceci est votre portefeuille et identit\xE9 principaux. Veuillez vous assurer de les garder en s\xE9curit\xE9 et sauvegard\xE9s. Allez sur le site {{element}} pour g\xE9rer vos m\xE9thodes de connexion et vos param\xE8tres de s\xE9curit\xE9.",
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} website to manage your wallet and security settings.": "Ceci est votre portefeuille principal et votre identit\xE9. Veuillez vous assurer de le garder en s\xE9curit\xE9 et sauvegard\xE9. Allez sur le site {{element}} pour g\xE9rer votre portefeuille et vos param\xE8tres de s\xE9curit\xE9.",
+  "This is your main wallet, created by {{element}} and secured by Privy.": "Ceci est votre portefeuille principal, cr\xE9\xE9 par {{element}} et s\xE9curis\xE9 par Privy.",
   "This is your main wallet, created by {{element}} and secured by Privy. This wallet is the owner of your smart account, which is used as your identity and as a gateway for your blockchain interactions. Please be sure to keep it safe and backed up.": "Ceci est votre portefeuille principal, cr\xE9\xE9 par {{element}} et s\xE9curis\xE9 par Privy. Ce portefeuille est le propri\xE9taire de votre compte intelligent, qui est utilis\xE9 comme votre identit\xE9 et comme une passerelle pour vos interactions blockchain. Veuillez vous assurer de le garder en s\xE9curit\xE9 et sauvegard\xE9.",
   "This may take a few seconds. You can close this window and check the status later.": "Cela peut prendre quelques secondes. Vous pouvez fermer cette fen\xEAtre et v\xE9rifier le statut plus tard.",
   "This wallet is the owner of your smart account, which is used as your identity and as a gateway for your blockchain interactions.": "Ce portefeuille est le propri\xE9taire de votre compte intelligent, qui est utilis\xE9 comme votre identit\xE9 et comme une passerelle pour vos interactions blockchain.",
@@ -10793,6 +11127,7 @@ var es_default = {
   "Continue with Google": "Continuar con Google",
   "Copy your address or scan this QR code": "Copia tu direcci\xF3n o escanea este c\xF3digo QR",
   Current: "Actual",
+  "Current domain": "Dominio actual",
   "Currently, multiclause transactions are not supported for smart accounts. Your multiclause transaction will be split into multiple transactions.": "Actualmente, las transacciones con m\xFAltiples cl\xE1usulas no son compatibles con las cuentas inteligentes. Su transacci\xF3n con m\xFAltiples cl\xE1usulas se dividir\xE1 en varias transacciones.",
   "Customize Account": "Personalizar Cuenta",
   "Customize account": "Personalizar cuenta",
@@ -10891,6 +11226,7 @@ var es_default = {
   Passkey: "Clave de acceso",
   "Phone Number": "N\xFAmero de tel\xE9fono",
   "Please approve the request in the connection request window...": "Por favor, aprueba la solicitud en la ventana de solicitud de conexi\xF3n...",
+  "Please be sure to keep this wallet safe and backed up.": "Por favor, aseg\xFArese de mantener esta billetera segura y respaldada.",
   "Please check {{email}} for an email from privy.io and enter your code below.": "Por favor, revisa {{email}} para un correo electr\xF3nico de privy.io e ingresa tu c\xF3digo a continuaci\xF3n.",
   "Please click 'Try again' to open the login window.": "Por favor, haz clic en 'Intentar de nuevo' para abrir la ventana de inicio de sesi\xF3n.",
   "Please complete the passkey authentication...": "Por favor, completa la autenticaci\xF3n de clave de acceso...",
@@ -10955,6 +11291,7 @@ var es_default = {
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} app or extension to manage your wallet and security settings.": "Este es tu monedero principal e identidad. Aseg\xFArate de mantenerlo seguro y respaldado. Ve a la aplicaci\xF3n o extensi\xF3n de {{element}} para gestionar tu monedero y la configuraci\xF3n de seguridad.",
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} website to manage your login methods and security settings.": "Esta es tu billetera e identidad principal. Aseg\xFArate de mantenerla segura y respaldada. Ve al sitio web de {{element}} para gestionar tus m\xE9todos de inicio de sesi\xF3n y configuraciones de seguridad.",
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} website to manage your wallet and security settings.": "Esta es su billetera principal e identidad. Aseg\xFArese de mantenerla segura y respaldada. Vaya al sitio web de {{element}} para administrar su billetera y la configuraci\xF3n de seguridad.",
+  "This is your main wallet, created by {{element}} and secured by Privy.": "Esta es su billetera principal, creada por {{element}} y asegurada por Privy.",
   "This is your main wallet, created by {{element}} and secured by Privy. This wallet is the owner of your smart account, which is used as your identity and as a gateway for your blockchain interactions. Please be sure to keep it safe and backed up.": "Esta es tu billetera principal, creada por {{element}} y asegurada por Privy. Esta billetera es la propietaria de tu cuenta inteligente, la cual se utiliza como tu identidad y como puerta de entrada para tus interacciones con la blockchain. Por favor, aseg\xFArate de mantenerla segura y respaldada.",
   "This may take a few seconds. You can close this window and check the status later.": "Esto puede tardar unos segundos. Puede cerrar esta ventana y comprobar el estado m\xE1s tarde.",
   "This wallet is the owner of your smart account, which is used as your identity and as a gateway for your blockchain interactions.": "Esta billetera es la propietaria de tu cuenta inteligente, la cual se utiliza como tu identidad y como puerta de entrada para tus interacciones con la blockchain.",
@@ -11131,6 +11468,7 @@ var zh_default = {
   "Continue with Google": "\u901A\u8FC7Google\u7EE7\u7EED",
   "Copy your address or scan this QR code": "\u590D\u5236\u60A8\u7684\u5730\u5740\u6216\u626B\u63CF\u6B64\u4E8C\u7EF4\u7801",
   Current: "\u5F53\u524D",
+  "Current domain": "\u5F53\u524D\u57DF\u540D",
   "Currently, multiclause transactions are not supported for smart accounts. Your multiclause transaction will be split into multiple transactions.": "\u5F53\u524D\uFF0C\u4E0D\u652F\u6301\u667A\u80FD\u8D26\u6237\u7684\u591A\u6761\u6B3E\u4EA4\u6613\u3002\u60A8\u7684\u591A\u6761\u6B3E\u4EA4\u6613\u5C06\u88AB\u62C6\u5206\u4E3A\u591A\u7B14\u4EA4\u6613\u3002",
   "Customize Account": "\u81EA\u5B9A\u4E49\u5E10\u6237",
   "Customize account": "\u81EA\u5B9A\u4E49\u5E10\u6237",
@@ -11229,6 +11567,7 @@ var zh_default = {
   Passkey: "\u901A\u884C\u5BC6\u94A5",
   "Phone Number": "\u7535\u8BDD\u53F7\u7801",
   "Please approve the request in the connection request window...": "\u8BF7\u5728\u8FDE\u63A5\u8BF7\u6C42\u7A97\u53E3\u4E2D\u6279\u51C6\u8BF7\u6C42...",
+  "Please be sure to keep this wallet safe and backed up.": "\u8BF7\u52A1\u5FC5\u4FDD\u8BC1\u6B64\u94B1\u5305\u7684\u5B89\u5168\u5E76\u8FDB\u884C\u5907\u4EFD\u3002",
   "Please check {{email}} for an email from privy.io and enter your code below.": "\u8BF7\u67E5\u770B {{email}} \u662F\u5426\u6709\u6765\u81EA privy.io \u7684\u7535\u5B50\u90AE\u4EF6\uFF0C\u5E76\u5728\u4E0B\u65B9\u8F93\u5165\u60A8\u7684\u4EE3\u7801\u3002",
   "Please click 'Try again' to open the login window.": "\u8BF7\u70B9\u51FB\u201C\u91CD\u8BD5\u201D\u4EE5\u6253\u5F00\u767B\u5F55\u7A97\u53E3\u3002",
   "Please complete the passkey authentication...": "\u8BF7\u5B8C\u6210\u901A\u884C\u5BC6\u94A5\u8BA4\u8BC1...",
@@ -11293,6 +11632,7 @@ var zh_default = {
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} app or extension to manage your wallet and security settings.": "\u8FD9\u662F\u60A8\u7684\u4E3B\u8981\u94B1\u5305\u548C\u8EAB\u4EFD\u3002\u8BF7\u52A1\u5FC5\u59A5\u5584\u4FDD\u7BA1\u5E76\u5907\u4EFD\u3002\u8BF7\u524D\u5F80{{element}}\u5E94\u7528\u7A0B\u5E8F\u6216\u6269\u5C55\u7BA1\u7406\u60A8\u7684\u94B1\u5305\u548C\u5B89\u5168\u8BBE\u7F6E\u3002",
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} website to manage your login methods and security settings.": "\u8FD9\u662F\u60A8\u7684\u4E3B\u94B1\u5305\u548C\u8EAB\u4EFD\u3002\u8BF7\u52A1\u5FC5\u786E\u4FDD\u5176\u5B89\u5168\u5E76\u5907\u4EFD\u3002\u524D\u5F80 {{element}} \u7F51\u7AD9\u7BA1\u7406\u60A8\u7684\u767B\u5F55\u65B9\u5F0F\u548C\u5B89\u5168\u8BBE\u7F6E\u3002",
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} website to manage your wallet and security settings.": "\u8FD9\u662F\u60A8\u7684\u4E3B\u8981\u94B1\u5305\u548C\u8EAB\u4EFD\u3002\u8BF7\u786E\u4FDD\u5176\u5B89\u5168\u5E76\u8FDB\u884C\u5907\u4EFD\u3002\u8BBF\u95EE{{element}}\u7F51\u7AD9\u4EE5\u7BA1\u7406\u60A8\u7684\u94B1\u5305\u548C\u5B89\u5168\u8BBE\u7F6E\u3002",
+  "This is your main wallet, created by {{element}} and secured by Privy.": "\u8FD9\u662F\u60A8\u7684\u4E3B\u94B1\u5305\uFF0C\u7531{{element}}\u521B\u5EFA\uFF0C\u5E76\u7531Privy\u4FDD\u62A4\u3002",
   "This is your main wallet, created by {{element}} and secured by Privy. This wallet is the owner of your smart account, which is used as your identity and as a gateway for your blockchain interactions. Please be sure to keep it safe and backed up.": "\u8FD9\u662F\u60A8\u7684\u4E3B\u94B1\u5305\uFF0C\u7531{{element}}\u521B\u5EFA\u5E76\u901A\u8FC7Privy\u4FDD\u62A4\u3002\u6B64\u94B1\u5305\u662F\u60A8\u7684\u667A\u80FD\u8D26\u6237\u6240\u6709\u8005\uFF0C\u7528\u4F5C\u60A8\u7684\u8EAB\u4EFD\u6807\u8BC6\u4EE5\u53CA\u533A\u5757\u94FE\u4EA4\u4E92\u7684\u7F51\u5173\u3002\u8BF7\u52A1\u5FC5\u786E\u4FDD\u94B1\u5305\u7684\u5B89\u5168\u6027\u5E76\u8FDB\u884C\u5907\u4EFD\u3002",
   "This may take a few seconds. You can close this window and check the status later.": "\u8FD9\u53EF\u80FD\u9700\u8981\u51E0\u79D2\u949F\u3002\u60A8\u53EF\u4EE5\u5173\u95ED\u6B64\u7A97\u53E3\uFF0C\u7A0D\u540E\u67E5\u770B\u72B6\u6001\u3002",
   "This wallet is the owner of your smart account, which is used as your identity and as a gateway for your blockchain interactions.": "\u6B64\u94B1\u5305\u662F\u60A8\u7684\u667A\u80FD\u8D26\u6237\u6240\u6709\u8005\uFF0C\u7528\u4F5C\u60A8\u7684\u8EAB\u4EFD\u6807\u8BC6\u4EE5\u53CA\u533A\u5757\u94FE\u4EA4\u4E92\u7684\u7F51\u5173\u3002",
@@ -11469,6 +11809,7 @@ var ja_default = {
   "Continue with Google": "Google\u3067\u7D9A\u884C",
   "Copy your address or scan this QR code": "\u30A2\u30C9\u30EC\u30B9\u3092\u30B3\u30D4\u30FC\u3059\u308B\u304B\u3001\u3053\u306EQR\u30B3\u30FC\u30C9\u3092\u30B9\u30AD\u30E3\u30F3\u3057\u3066\u304F\u3060\u3055\u3044",
   Current: "\u73FE\u5728",
+  "Current domain": "\u73FE\u5728\u306E\u30C9\u30E1\u30A4\u30F3",
   "Currently, multiclause transactions are not supported for smart accounts. Your multiclause transaction will be split into multiple transactions.": "\u73FE\u5728\u3001\u30B9\u30DE\u30FC\u30C8\u30A2\u30AB\u30A6\u30F3\u30C8\u3067\u306F\u8907\u6570\u6761\u9805\u306E\u30C8\u30E9\u30F3\u30B6\u30AF\u30B7\u30E7\u30F3\u306F\u30B5\u30DD\u30FC\u30C8\u3055\u308C\u3066\u3044\u307E\u305B\u3093\u3002\u3042\u306A\u305F\u306E\u8907\u6570\u6761\u9805\u306E\u30C8\u30E9\u30F3\u30B6\u30AF\u30B7\u30E7\u30F3\u306F\u8907\u6570\u306E\u30C8\u30E9\u30F3\u30B6\u30AF\u30B7\u30E7\u30F3\u306B\u5206\u5272\u3055\u308C\u307E\u3059\u3002",
   "Customize Account": "\u30A2\u30AB\u30A6\u30F3\u30C8\u306E\u30AB\u30B9\u30BF\u30DE\u30A4\u30BA",
   "Customize account": "\u30A2\u30AB\u30A6\u30F3\u30C8\u3092\u30AB\u30B9\u30BF\u30DE\u30A4\u30BA",
@@ -11567,6 +11908,7 @@ var ja_default = {
   Passkey: "\u30D1\u30B9\u30AD\u30FC",
   "Phone Number": "\u96FB\u8A71\u756A\u53F7",
   "Please approve the request in the connection request window...": "\u63A5\u7D9A\u30EA\u30AF\u30A8\u30B9\u30C8\u30A6\u30A3\u30F3\u30C9\u30A6\u3067\u30EA\u30AF\u30A8\u30B9\u30C8\u3092\u627F\u8A8D\u3057\u3066\u304F\u3060\u3055\u3044...",
+  "Please be sure to keep this wallet safe and backed up.": "\u3053\u306E\u30A6\u30A9\u30EC\u30C3\u30C8\u3092\u5B89\u5168\u306B\u4FDD\u7BA1\u3057\u3001\u30D0\u30C3\u30AF\u30A2\u30C3\u30D7\u3092\u53D6\u308B\u3088\u3046\u306B\u3057\u3066\u304F\u3060\u3055\u3044\u3002",
   "Please check {{email}} for an email from privy.io and enter your code below.": "{{email}} \u306B privy.io \u304B\u3089\u306E\u30E1\u30FC\u30EB\u304C\u5C4A\u3044\u3066\u3044\u308B\u3053\u3068\u3092\u78BA\u8A8D\u3057\u3001\u4EE5\u4E0B\u306B\u30B3\u30FC\u30C9\u3092\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044\u3002",
   "Please click 'Try again' to open the login window.": "\u300C\u518D\u8A66\u884C\u300D\u3092\u30AF\u30EA\u30C3\u30AF\u3057\u3066\u30ED\u30B0\u30A4\u30F3\u30A6\u30A3\u30F3\u30C9\u30A6\u3092\u958B\u3044\u3066\u304F\u3060\u3055\u3044\u3002",
   "Please complete the passkey authentication...": "\u30D1\u30B9\u30AD\u30FC\u8A8D\u8A3C\u3092\u5B8C\u4E86\u3057\u3066\u304F\u3060\u3055\u3044...",
@@ -11631,6 +11973,7 @@ var ja_default = {
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} app or extension to manage your wallet and security settings.": "\u3053\u308C\u306F\u3042\u306A\u305F\u306E\u30E1\u30A4\u30F3\u30A6\u30A9\u30EC\u30C3\u30C8\u3068\u30A2\u30A4\u30C7\u30F3\u30C6\u30A3\u30C6\u30A3\u3067\u3059\u3002\u5B89\u5168\u306B\u4FDD\u7BA1\u3057\u3001\u30D0\u30C3\u30AF\u30A2\u30C3\u30D7\u3092\u53D6\u3063\u3066\u304F\u3060\u3055\u3044\u3002\u30A6\u30A9\u30EC\u30C3\u30C8\u3068\u30BB\u30AD\u30E5\u30EA\u30C6\u30A3\u8A2D\u5B9A\u3092\u7BA1\u7406\u3059\u308B\u306B\u306F\u3001{{element}} \u30A2\u30D7\u30EA\u307E\u305F\u306F\u62E1\u5F35\u6A5F\u80FD\u306B\u79FB\u52D5\u3057\u3066\u304F\u3060\u3055\u3044\u3002",
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} website to manage your login methods and security settings.": "\u3053\u308C\u304C\u3042\u306A\u305F\u306E\u4E3B\u8981\u306A\u30A6\u30A9\u30EC\u30C3\u30C8\u3068ID\u3067\u3059\u3002\u5FC5\u305A\u5B89\u5168\u306B\u4FDD\u7BA1\u3057\u3001\u30D0\u30C3\u30AF\u30A2\u30C3\u30D7\u3057\u3066\u304F\u3060\u3055\u3044\u3002\u30ED\u30B0\u30A4\u30F3\u65B9\u6CD5\u3068\u30BB\u30AD\u30E5\u30EA\u30C6\u30A3\u8A2D\u5B9A\u3092\u7BA1\u7406\u3059\u308B\u305F\u3081\u306B{{element}}\u306E\u30A6\u30A7\u30D6\u30B5\u30A4\u30C8\u306B\u79FB\u52D5\u3057\u3066\u304F\u3060\u3055\u3044\u3002",
   "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} website to manage your wallet and security settings.": "\u3053\u308C\u304C\u3042\u306A\u305F\u306E\u30E1\u30A4\u30F3\u30A6\u30A9\u30EC\u30C3\u30C8\u3068\u30A2\u30A4\u30C7\u30F3\u30C6\u30A3\u30C6\u30A3\u3067\u3059\u3002\u5B89\u5168\u306B\u4FDD\u7BA1\u3057\u3001\u30D0\u30C3\u30AF\u30A2\u30C3\u30D7\u3092\u53D6\u3063\u3066\u304F\u3060\u3055\u3044\u3002\u30A6\u30A9\u30EC\u30C3\u30C8\u3068\u30BB\u30AD\u30E5\u30EA\u30C6\u30A3\u8A2D\u5B9A\u3092\u7BA1\u7406\u3059\u308B\u306B\u306F{{element}}\u30A6\u30A7\u30D6\u30B5\u30A4\u30C8\u306B\u30A2\u30AF\u30BB\u30B9\u3057\u3066\u304F\u3060\u3055\u3044\u3002",
+  "This is your main wallet, created by {{element}} and secured by Privy.": "\u3053\u308C\u306F\u3001{{element}}\u306B\u3088\u3063\u3066\u4F5C\u6210\u3055\u308C\u3001Privy\u306B\u3088\u3063\u3066\u4FDD\u8B77\u3055\u308C\u305F\u3042\u306A\u305F\u306E\u30E1\u30A4\u30F3\u30A6\u30A9\u30EC\u30C3\u30C8\u3067\u3059\u3002",
   "This is your main wallet, created by {{element}} and secured by Privy. This wallet is the owner of your smart account, which is used as your identity and as a gateway for your blockchain interactions. Please be sure to keep it safe and backed up.": "{{element}}\u306B\u3088\u3063\u3066\u4F5C\u6210\u3055\u308C\u3001Privy\u306B\u3088\u3063\u3066\u4FDD\u8B77\u3055\u308C\u305F\u30E1\u30A4\u30F3\u30A6\u30A9\u30EC\u30C3\u30C8\u3067\u3059\u3002\u3053\u306E\u30A6\u30A9\u30EC\u30C3\u30C8\u306F\u3001\u30A2\u30A4\u30C7\u30F3\u30C6\u30A3\u30C6\u30A3\u3068\u3057\u3066\u4F7F\u7528\u3055\u308C\u308B\u30B9\u30DE\u30FC\u30C8\u30A2\u30AB\u30A6\u30F3\u30C8\u306E\u6240\u6709\u8005\u3067\u3042\u308A\u3001\u30D6\u30ED\u30C3\u30AF\u30C1\u30A7\u30FC\u30F3\u3068\u306E\u3084\u308A\u53D6\u308A\u306E\u30B2\u30FC\u30C8\u30A6\u30A7\u30A4\u3068\u3057\u3066\u6A5F\u80FD\u3057\u307E\u3059\u3002\u5B89\u5168\u306B\u4FDD\u7BA1\u3057\u3001\u30D0\u30C3\u30AF\u30A2\u30C3\u30D7\u3092\u78BA\u5B9F\u306B\u53D6\u3063\u3066\u304F\u3060\u3055\u3044\u3002",
   "This may take a few seconds. You can close this window and check the status later.": "\u6570\u79D2\u304B\u304B\u308B\u3053\u3068\u304C\u3042\u308A\u307E\u3059\u3002\u3053\u306E\u30A6\u30A3\u30F3\u30C9\u30A6\u3092\u9589\u3058\u3066\u5F8C\u3067\u30B9\u30C6\u30FC\u30BF\u30B9\u3092\u78BA\u8A8D\u3059\u308B\u3053\u3068\u304C\u3067\u304D\u307E\u3059\u3002",
   "This wallet is the owner of your smart account, which is used as your identity and as a gateway for your blockchain interactions.": "\u3053\u306E\u30A6\u30A9\u30EC\u30C3\u30C8\u306F\u3001\u30A2\u30A4\u30C7\u30F3\u30C6\u30A3\u30C6\u30A3\u3068\u3057\u3066\u4F7F\u7528\u3055\u308C\u308B\u30B9\u30DE\u30FC\u30C8\u30A2\u30AB\u30A6\u30F3\u30C8\u306E\u6240\u6709\u8005\u3067\u3042\u308A\u3001\u30D6\u30ED\u30C3\u30AF\u30C1\u30A7\u30FC\u30F3\u3068\u306E\u3084\u308A\u53D6\u308A\u306E\u30B2\u30FC\u30C8\u30A6\u30A7\u30A4\u3068\u3057\u3066\u6A5F\u80FD\u3057\u307E\u3059\u3002",
@@ -11785,7 +12128,7 @@ var FAQContent = ({ onGoBack }) => {
           fontWeight: "500",
           textAlign: "center",
           color: isDark ? "#dfdfdd" : "#4d4d4d",
-          children: t("Info")
+          children: t("Help")
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsx(ModalBackButton, { onClick: onGoBack }),
@@ -11871,7 +12214,6 @@ var ConnectionDetailsContent = ({ onGoBack }) => {
   const { getConnectionCache } = useCrossAppConnectionCache();
   const { privy, darkMode: isDark } = useVeChainKitConfig();
   const { connection } = useWallet();
-  const { source } = dappKitReact.useWallet();
   const { data: appInfo } = useFetchAppInfo(privy?.appId ?? "");
   const connectionCache = getConnectionCache();
   return /* @__PURE__ */ jsxRuntime.jsxs(ScrollToTopWrapper, { children: [
@@ -11899,23 +12241,7 @@ var ConnectionDetailsContent = ({ onGoBack }) => {
     /* @__PURE__ */ jsxRuntime.jsxs(react.ModalBody, { w: "full", children: [
       connection.isConnectedWithCrossApp && connectionCache && /* @__PURE__ */ jsxRuntime.jsx(CrossAppConnectionCard, { connectionCache }),
       connection.isConnectedWithSocialLogin && /* @__PURE__ */ jsxRuntime.jsx(PrivyConnectionCard, {}),
-      connection.isConnectedWithDappKit && /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { align: "stretch", textAlign: "center", mt: 5, children: [
-        /* @__PURE__ */ jsxRuntime.jsx(DappKitConnectionCard, {}),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          react.Text,
-          {
-            fontSize: "sm",
-            opacity: 0.5,
-            textAlign: "center",
-            children: t(
-              "This is your main wallet and identity. Please be sure to keep it safe and backed up. Go to {{element}} app or extension to manage your security settings.",
-              {
-                element: source
-              }
-            )
-          }
-        )
-      ] }),
+      connection.isConnectedWithDappKit && /* @__PURE__ */ jsxRuntime.jsx(react.VStack, { align: "stretch", textAlign: "center", mt: 5, children: /* @__PURE__ */ jsxRuntime.jsx(DappKitConnectionCard, {}) }),
       (connection.isConnectedWithSocialLogin || connection.isConnectedWithCrossApp) && /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { spacing: 4, mt: 5, children: [
         /* @__PURE__ */ jsxRuntime.jsx(react.Divider, {}),
         /* @__PURE__ */ jsxRuntime.jsxs(
@@ -12016,10 +12342,10 @@ var ConfirmUnlink = ({
 var PrivyLinkedAccounts = ({ onBack }) => {
   const { t } = reactI18next.useTranslation();
   const { darkMode: isDark } = useVeChainKitConfig();
-  const [unlinkingAccount, setUnlinkingAccount] = React9.useState(null);
-  const [showLinkOptions, setShowLinkOptions] = React9.useState(false);
-  const [showFullText, setShowFullText] = React9.useState(false);
-  const [isLoadingUnlink, setIsLoadingUnlink] = React9.useState(false);
+  const [unlinkingAccount, setUnlinkingAccount] = React8.useState(null);
+  const [showLinkOptions, setShowLinkOptions] = React8.useState(false);
+  const [showFullText, setShowFullText] = React8.useState(false);
+  const [isLoadingUnlink, setIsLoadingUnlink] = React8.useState(false);
   const {
     user,
     linkEmail,
@@ -12187,22 +12513,7 @@ var PrivyLinkedAccounts = ({ onBack }) => {
         ),
         /* @__PURE__ */ jsxRuntime.jsx(react.ModalCloseButton, {})
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(react.ModalBody, { children: /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { spacing: 3, align: "stretch", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ActionButton,
-          {
-            title: t("Handle Passkey Login"),
-            description: t(
-              "Enable one click login by adding a passkey to your account."
-            ),
-            onClick: () => {
-              linkPasskey();
-            },
-            leftIcon: io.IoIosFingerPrint,
-            rightIcon: void 0,
-            isDisabled: !privy?.allowPasskeyLinking
-          }
-        ),
+      /* @__PURE__ */ jsxRuntime.jsx(react.ModalBody, { w: "full", children: /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { spacing: 3, align: "stretch", w: "full", children: [
         canLinkGoogle && /* @__PURE__ */ jsxRuntime.jsx(
           ActionButton,
           {
@@ -12579,9 +12890,9 @@ var NotificationsContent = ({ setCurrentContent }) => {
     clearAllNotifications,
     markAsRead
   } = useNotifications();
-  const [isArchiveView, setIsArchiveView] = React9.useState(false);
-  const [notifications, setNotifications] = React9.useState(getNotifications());
-  const [archivedNotifications, setArchivedNotifications] = React9.useState(
+  const [isArchiveView, setIsArchiveView] = React8.useState(false);
+  const [notifications, setNotifications] = React8.useState(getNotifications());
+  const [archivedNotifications, setArchivedNotifications] = React8.useState(
     getArchivedNotifications()
   );
   const handleClearAll = () => {
@@ -12610,9 +12921,14 @@ var NotificationsContent = ({ setCurrentContent }) => {
     if (b.id === "multiclause") return 1;
     return b.timestamp - a.timestamp;
   });
-  return /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs(ScrollToTopWrapper, { children: [
     /* @__PURE__ */ jsxRuntime.jsxs(StickyHeaderContainer, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ModalBackButton, { onClick: () => setCurrentContent("main") }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        ModalBackButton,
+        {
+          onClick: () => setCurrentContent("settings")
+        }
+      ),
       /* @__PURE__ */ jsxRuntime.jsx(
         react.ModalHeader,
         {
@@ -12625,7 +12941,7 @@ var NotificationsContent = ({ setCurrentContent }) => {
       ),
       /* @__PURE__ */ jsxRuntime.jsx(react.ModalCloseButton, {})
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs(react.Container, { maxW: "container.lg", h: "350px", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(react.Container, { maxW: "container.lg", h: ["auto", "540px"], children: [
       /* @__PURE__ */ jsxRuntime.jsx(react.ModalBody, { w: "full", children: /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { spacing: 4, align: "stretch", w: "full", children: [
         /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { justify: "space-between", children: [
           /* @__PURE__ */ jsxRuntime.jsx(
@@ -12830,7 +13146,7 @@ var DEFAULT_APPS = [
 var ExploreEcosystemContent = ({ setCurrentContent }) => {
   const { t } = reactI18next.useTranslation();
   const { darkMode: isDark, network } = useVeChainKitConfig();
-  const [searchQuery, setSearchQuery] = React9.useState("");
+  const [searchQuery, setSearchQuery] = React8.useState("");
   const { data: currentRoundId } = useCurrentAllocationsRoundId();
   const { data: vbdApps } = useMostVotedAppsInRound(
     currentRoundId ? (parseInt(currentRoundId) - 1).toString() : "1"
@@ -12852,7 +13168,7 @@ var ExploreEcosystemContent = ({ setCurrentContent }) => {
           fontWeight: "500",
           textAlign: "center",
           color: isDark ? "#dfdfdd" : "#4d4d4d",
-          children: t("VeChain Ecosystem")
+          children: t("Apps")
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsx(ModalBackButton, { onClick: () => setCurrentContent("main") }),
@@ -13058,8 +13374,8 @@ var AccountModal = ({
 }) => {
   useNotificationAlerts();
   const { account } = useWallet();
-  const [currentContent, setCurrentContent] = React9.useState(initialContent);
-  React9.useEffect(() => {
+  const [currentContent, setCurrentContent] = React8.useState(initialContent);
+  React8.useEffect(() => {
     if (isOpen && initialContent) {
       setCurrentContent(initialContent);
     }
@@ -13099,7 +13415,7 @@ var AccountModal = ({
         );
       case "settings":
         return /* @__PURE__ */ jsxRuntime.jsx(
-          WalletSettingsContent,
+          SettingsContent,
           {
             setCurrentContent,
             onLogoutSuccess: onClose
@@ -13112,9 +13428,9 @@ var AccountModal = ({
             setCurrentContent
           }
         );
-      case "embedded-wallet":
+      case "access-and-security":
         return /* @__PURE__ */ jsxRuntime.jsx(
-          EmbeddedWalletContent,
+          AccessAndSecurityContent,
           {
             setCurrentContent
           }
@@ -13148,7 +13464,7 @@ var AccountModal = ({
         return /* @__PURE__ */ jsxRuntime.jsx(
           PrivyLinkedAccounts,
           {
-            onBack: () => setCurrentContent("embedded-wallet")
+            onBack: () => setCurrentContent("access-and-security")
           }
         );
       case "ecosystem":
@@ -13165,6 +13481,13 @@ var AccountModal = ({
             setCurrentContent
           }
         );
+      case "embedded-wallet":
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          EmbeddedWalletContent,
+          {
+            setCurrentContent
+          }
+        );
     }
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -13179,9 +13502,8 @@ var AccountModal = ({
   );
 };
 var ConnectModal = ({ isOpen, onClose }) => {
-  const { loginModalUI } = useVeChainKitConfig();
-  const [currentContent, setCurrentContent] = React9.useState("main");
-  React9.useEffect(() => {
+  const [currentContent, setCurrentContent] = React8.useState("main");
+  React8.useEffect(() => {
     if (isOpen) {
       setCurrentContent("main");
     }
@@ -13193,8 +13515,7 @@ var ConnectModal = ({ isOpen, onClose }) => {
           MainContent,
           {
             setCurrentContent,
-            onClose,
-            variant: loginModalUI?.variant
+            onClose
           }
         );
       case "faq":
@@ -13352,13 +13673,10 @@ var ConnectedWallet = ({
   const [isDesktop] = react.useMediaQuery("(min-width: 768px)");
   return /* @__PURE__ */ jsxRuntime.jsx(react.Button, { ...buttonStyle, onClick: onOpen, p: "0px 13px", minH: "45px", children: /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(
-      react.Image,
+      AccountAvatar,
       {
-        src: account?.image ?? chunkEO3CLT4E_cjs.notFoundImage,
-        alt: "wallet",
-        width: 30,
-        height: 30,
-        borderRadius: "50%"
+        wallet: account,
+        props: { width: 30, height: 30 }
       }
     ),
     !isDesktop && /* @__PURE__ */ jsxRuntime.jsx(WalletDisplay, { variant: mobileVariant }),
@@ -13385,7 +13703,7 @@ var WalletButton = ({
       connectModal.onOpen();
     }
   };
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     const embeddedWallet = user?.wallet?.address;
     const asyncCreateWallet = async () => {
       try {
@@ -13479,7 +13797,7 @@ var TransactionToast = ({
     onClose();
     resetStatus();
   };
-  const toastContent = React9.useMemo(() => {
+  const toastContent = React8.useMemo(() => {
     const config = statusConfig[status];
     if (!config) return null;
     return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -13604,9 +13922,9 @@ var LoadingContent = ({
 }) => {
   const { t } = reactI18next.useTranslation();
   const { darkMode: isDark } = useVeChainKitConfig();
-  const [showTimeout, setShowTimeout] = React9__default.default.useState(false);
-  const [showSafariMessage, setShowSafariMessage] = React9__default.default.useState(false);
-  React9__default.default.useEffect(() => {
+  const [showTimeout, setShowTimeout] = React8__default.default.useState(false);
+  const [showSafariMessage, setShowSafariMessage] = React8__default.default.useState(false);
+  React8__default.default.useEffect(() => {
     if (reactDeviceDetect.isSafari) {
       setShowSafariMessage(true);
     }
@@ -13732,8 +14050,8 @@ var ErrorContent = ({
 var EcosystemContent = ({ onClose, appsInfo, isLoading }) => {
   const { t } = reactI18next.useTranslation();
   const { darkMode: isDark } = useVeChainKitConfig();
-  const [loginError, setLoginError] = React9.useState();
-  const [selectedApp, setSelectedApp] = React9.useState();
+  const [loginError, setLoginError] = React8.useState();
+  const [selectedApp, setSelectedApp] = React8.useState();
   const loginLoadingModal = react.useDisclosure();
   const { setConnectionCache } = useCrossAppConnectionCache();
   const { login: loginWithCrossApp } = usePrivyCrossAppSdk();
@@ -13792,8 +14110,8 @@ var EcosystemContent = ({ onClose, appsInfo, isLoading }) => {
             display: "flex",
             gap: 2,
             children: [
-              /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { as: io5.IoPlanet, size: "20px" }),
-              t("Ecosystem Login")
+              /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { as: io.IoMdApps, size: "20px" }),
+              t("Select an app")
             ]
           }
         ),
@@ -13808,9 +14126,7 @@ var EcosystemContent = ({ onClose, appsInfo, isLoading }) => {
             opacity: 0.5,
             mb: 4,
             textAlign: "center",
-            children: t(
-              "Use your existing VeChain wallet from other ecosystem apps to sign in seamlessly."
-            )
+            children: t("Sign in with a wallet from other x2earn apps.")
           }
         ),
         isLoading && /* @__PURE__ */ jsxRuntime.jsx(
@@ -13927,16 +14243,14 @@ var initializeI18n = (i18nInstance) => {
   });
 };
 var DEFAULT_PRIVY_ECOSYSTEM_APP_IDS = [
-  "cm4wxxujb022fyujl7g0thb21",
-  //vechain
   "clz41gcg00e4ay75dmq3uzzgr",
   //cleanify
   "cm153hrup0817axti38avlfyg"
   //greencart
 ];
-var VeChainKitContext = React9.createContext(null);
+var VeChainKitContext = React8.createContext(null);
 var useVeChainKitConfig = () => {
-  const context = React9.useContext(VeChainKitContext);
+  const context = React8.useContext(VeChainKitContext);
   if (!context) {
     throw new Error("useVeChainKitConfig must be used within VeChainKit");
   }
@@ -13948,50 +14262,51 @@ var VeChainKitProvider = ({
   feeDelegation,
   dappKit,
   loginModalUI = {
-    variant: "vechain-and-wallet",
     description: "Choose between social login through VeChain or by connecting your wallet."
   },
+  loginMethods,
   darkMode = false,
   i18n: i18nConfig,
   language = "en",
-  network,
-  privyEcosystemAppIDS = DEFAULT_PRIVY_ECOSYSTEM_APP_IDS
+  network
 }) => {
-  const [isConnectModalOpen, setIsConnectModalOpen] = React9.useState(false);
-  const openConnectModal = React9.useCallback(() => setIsConnectModalOpen(true), []);
-  const closeConnectModal = React9.useCallback(
+  const [isConnectModalOpen, setIsConnectModalOpen] = React8.useState(false);
+  const openConnectModal = React8.useCallback(() => setIsConnectModalOpen(true), []);
+  const closeConnectModal = React8.useCallback(
     () => setIsConnectModalOpen(false),
     []
   );
-  const [isAccountModalOpen, setIsAccountModalOpen] = React9.useState(false);
-  const openAccountModal = React9.useCallback(() => setIsAccountModalOpen(true), []);
-  const closeAccountModal = React9.useCallback(
+  const [isAccountModalOpen, setIsAccountModalOpen] = React8.useState(false);
+  const openAccountModal = React8.useCallback(() => setIsAccountModalOpen(true), []);
+  const closeAccountModal = React8.useCallback(
     () => setIsAccountModalOpen(false),
     []
   );
-  const [isTransactionModalOpen, setIsTransactionModalOpen] = React9.useState(false);
-  const openTransactionModal = React9.useCallback(
+  const [isTransactionModalOpen, setIsTransactionModalOpen] = React8.useState(false);
+  const openTransactionModal = React8.useCallback(
     () => setIsTransactionModalOpen(true),
     []
   );
-  const closeTransactionModal = React9.useCallback(
+  const closeTransactionModal = React8.useCallback(
     () => setIsTransactionModalOpen(false),
     []
   );
-  const [isTransactionToastOpen, setIsTransactionToastOpen] = React9.useState(false);
-  const openTransactionToast = React9.useCallback(
+  const [isTransactionToastOpen, setIsTransactionToastOpen] = React8.useState(false);
+  const openTransactionToast = React8.useCallback(
     () => setIsTransactionToastOpen(true),
     []
   );
-  const closeTransactionToast = React9.useCallback(
+  const closeTransactionToast = React8.useCallback(
     () => setIsTransactionToastOpen(false),
     []
   );
-  const [accountModalContent, setAccountModalContent] = React9.useState("main");
-  const loginMethods = [
-    ...privy?.loginMethods ?? [],
-    ...(privyEcosystemAppIDS ?? []).map((appID) => `privy:${appID}`)
-  ];
+  const [accountModalContent, setAccountModalContent] = React8.useState("main");
+  const allowedEcosystemApps = React8.useMemo(() => {
+    const userEcosystemMethods = loginMethods?.find(
+      (method35) => method35.method === "ecosystem"
+    );
+    return userEcosystemMethods?.allowedApps ?? DEFAULT_PRIVY_ECOSYSTEM_APP_IDS;
+  }, [loginMethods]);
   let privyAppId, privyClientId;
   if (!privy) {
     privyAppId = "clzdb5k0b02b9qvzjm6jpknsc";
@@ -14000,7 +14315,7 @@ var VeChainKitProvider = ({
     privyAppId = privy.appId;
     privyClientId = privy.clientId;
   }
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     initializeI18n(i18n_default);
     if (language) {
       i18n_default.changeLanguage(language);
@@ -14019,20 +14334,20 @@ var VeChainKitProvider = ({
   }, [language, i18nConfig]);
   return /* @__PURE__ */ jsxRuntime.jsxs(EnsureQueryClient, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(reactQueryDevtools.ReactQueryDevtools, { initialIsOpen: false }),
-    /* @__PURE__ */ jsxRuntime.jsx(PrivyCrossAppProvider, { privyEcosystemAppIDS, children: /* @__PURE__ */ jsxRuntime.jsx(
+    /* @__PURE__ */ jsxRuntime.jsx(PrivyCrossAppProvider, { privyEcosystemAppIDS: allowedEcosystemApps, children: /* @__PURE__ */ jsxRuntime.jsx(
       VeChainKitContext.Provider,
       {
         value: {
           privy,
-          privyEcosystemAppIDS,
+          privyEcosystemAppIDS: allowedEcosystemApps,
           feeDelegation,
           dappKit,
           loginModalUI,
+          loginMethods,
           darkMode,
           i18n: i18nConfig,
           language,
           network,
-          privySocialLoginEnabled: privy !== void 0,
           openConnectModal,
           closeConnectModal,
           isConnectModalOpen,
@@ -14055,7 +14370,7 @@ var VeChainKitProvider = ({
             config: {
               loginMethodsAndOrder: {
                 // @ts-ignore
-                primary: loginMethods
+                primary: privy?.loginMethods
               },
               appearance: {
                 theme: darkMode ? "dark" : "light",
@@ -14145,7 +14460,7 @@ var variants = {
       scrollbarWidth: "none",
       overflow: "scroll",
       overflowX: "hidden",
-      maxHeight: "520px",
+      maxHeight: "540px",
       borderRadius: "24px",
       backgroundColor: props.colorMode === "dark" ? "#1f1f1e" : "white"
     },
@@ -14344,7 +14659,7 @@ var VechainKitThemeProvider = ({
   children,
   darkMode = false
 }) => {
-  const theme = React9.useMemo(
+  const theme = React8.useMemo(
     () => ({
       ...VechainKitTheme,
       config: {
@@ -14372,7 +14687,14 @@ Object.defineProperty(exports, "useConnex", {
   enumerable: true,
   get: function () { return dappKitReact.useConnex; }
 });
+Object.defineProperty(exports, "useDappKitWallet", {
+  enumerable: true,
+  get: function () { return dappKitReact.useWallet; }
+});
 exports.APP_SECURITY_LEVELS = APP_SECURITY_LEVELS;
+exports.AccessAndSecurityContent = AccessAndSecurityContent;
+exports.AccessAndSecurityModalProvider = AccessAndSecurityModalProvider;
+exports.AccountAvatar = AccountAvatar;
 exports.AccountCustomizationContent = AccountCustomizationContent;
 exports.AccountCustomizationModalProvider = AccountCustomizationModalProvider;
 exports.AccountDetailsButton = AccountDetailsButton;
@@ -14399,7 +14721,7 @@ exports.EcosystemButton = EcosystemButton;
 exports.EcosystemModal = EcosystemModal;
 exports.EmailLoginButton = EmailLoginButton;
 exports.EmbeddedWalletContent = EmbeddedWalletContent;
-exports.EmbeddedWalletSettingsModalProvider = EmbeddedWalletSettingsModalProvider;
+exports.ExchangeWarningAlert = ExchangeWarningAlert;
 exports.ExploreEcosystemModalProvider = ExploreEcosystemModalProvider;
 exports.FAQContent = FAQContent;
 exports.FAQModalProvider = FAQModalProvider;
@@ -14419,6 +14741,7 @@ exports.PRICE_FEED_IDS = PRICE_FEED_IDS;
 exports.PasskeyLoginButton = PasskeyLoginButton;
 exports.PrivyButton = PrivyButton;
 exports.PrivyWalletProvider = PrivyWalletProvider;
+exports.Profile = Profile;
 exports.QuickActionsSection = QuickActionsSection;
 exports.ReceiveModalProvider = ReceiveModalProvider;
 exports.ReceiveTokenContent = ReceiveTokenContent;
@@ -14429,6 +14752,7 @@ exports.SelectTokenContent = SelectTokenContent;
 exports.SendTokenContent = SendTokenContent;
 exports.SendTokenModalProvider = SendTokenModalProvider;
 exports.SendTokenSummaryContent = SendTokenSummaryContent;
+exports.SettingsContent = SettingsContent;
 exports.SocialLoginButtons = SocialLoginButtons;
 exports.StickyFooterContainer = StickyFooterContainer;
 exports.StickyHeaderContainer = StickyHeaderContainer;
@@ -14446,7 +14770,6 @@ exports.VechainKitThemeProvider = VechainKitThemeProvider;
 exports.VersionFooter = VersionFooter;
 exports.WalletButton = WalletButton;
 exports.WalletModalProvider = WalletModalProvider;
-exports.WalletSettingsContent = WalletSettingsContent;
 exports.buildClaimRewardsTx = buildClaimRewardsTx;
 exports.buildClaimRoundReward = buildClaimRoundReward;
 exports.compressImages = compressImages;
@@ -14571,6 +14894,7 @@ exports.getXAppsQueryKey = getXAppsQueryKey;
 exports.getXAppsSharesQueryKey = getXAppsSharesQueryKey;
 exports.imageCompressionOptions = imageCompressionOptions;
 exports.pollForReceipt = pollForReceipt;
+exports.useAccessAndSecurityModal = useAccessAndSecurityModal;
 exports.useAccountBalance = useAccountBalance;
 exports.useAccountCustomizationModal = useAccountCustomizationModal;
 exports.useAccountLinking = useAccountLinking;
@@ -14597,7 +14921,6 @@ exports.useCurrentAllocationsRound = useCurrentAllocationsRound;
 exports.useCurrentAllocationsRoundId = useCurrentAllocationsRoundId;
 exports.useCurrentBlock = useCurrentBlock;
 exports.useEcosystemShortcuts = useEcosystemShortcuts;
-exports.useEmbeddedWalletSettingsModal = useEmbeddedWalletSettingsModal;
 exports.useEnsRecordExists = useEnsRecordExists;
 exports.useExploreEcosystemModal = useExploreEcosystemModal;
 exports.useFAQModal = useFAQModal;
@@ -14650,6 +14973,7 @@ exports.useIsWhitelisted = useIsWhitelisted;
 exports.useLevelMultiplier = useLevelMultiplier;
 exports.useLevelOfToken = useLevelOfToken;
 exports.useLocalStorage = useLocalStorage;
+exports.useLoginModalContent = useLoginModalContent;
 exports.useLoginWithOAuth = useLoginWithOAuth2;
 exports.useLoginWithPasskey = useLoginWithPasskey;
 exports.useLoginWithVeChain = useLoginWithVeChain;