@vechain/vechain-kit 1.5.5 → 1.5.7

package/dist/index.cjs

@@ -3293,7 +3293,7 @@ var useSendTransaction = ({
         });
       }
       let transaction = vendor.sign("tx", clauses2);
-      if (feeDelegation.delegateAllTransactions) {
+      if (feeDelegation?.delegateAllTransactions) {
         transaction = transaction.delegate(feeDelegation.delegatorUrl);
       }
       if (signerAccountAddress) {
@@ -3976,7 +3976,7 @@ var useWallet = () => {
       source: connectionSource,
       isInAppBrowser: (window.vechain && window.vechain.isInAppBrowser) ?? false,
       nodeUrl,
-      delegatorUrl: feeDelegation.delegatorUrl,
+      delegatorUrl: feeDelegation?.delegatorUrl,
       chainId,
       network: network.type
     },
@@ -4983,7 +4983,7 @@ var AddressDisplay = ({
 // package.json
 var package_default = {
   name: "@vechain/vechain-kit",
-  version: "1.5.5",
+  version: "1.5.7",
   private: false,
   homepage: "https://github.com/vechain/vechain-kit",
   repository: "github:vechain/vechain-kit",
@@ -5458,7 +5458,8 @@ var TransactionButtonAndStatus = ({
   txReceipt,
   isSubmitForm = false,
   buttonText,
-  isDisabled = false
+  isDisabled = false,
+  style
 }) => {
   const { t } = reactI18next.useTranslation();
   const { darkMode: isDark } = useVeChainKitConfig();
@@ -5467,6 +5468,10 @@ var TransactionButtonAndStatus = ({
     if (!transactionError) return null;
     return transactionError.reason || t("Something went wrong. Please try again.");
   }, [transactionError, t]);
+  const buttonBg = React10.useMemo(() => {
+    if (style?.accentColor) return `${style.accentColor} !important`;
+    return void 0;
+  }, [style?.accentColor]);
   return /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { width: "full", spacing: 4, children: [
     errorMessage && /* @__PURE__ */ jsxRuntime.jsx(react.Text, { color: "#da5a5a", textAlign: "center", width: "full", children: errorMessage }),
     /* @__PURE__ */ jsxRuntime.jsx(
@@ -5474,6 +5479,7 @@ var TransactionButtonAndStatus = ({
       {
         px: 4,
         variant: "vechainKitPrimary",
+        bg: buttonBg,
         onClick: onConfirm,
         type: isSubmitForm ? "submit" : "button",
         isLoading: isSubmitting,
@@ -5887,7 +5893,7 @@ var DappKitButton = ({ isDark, gridColumn = 2 }) => {
       isDark,
       onClick: openDappKitModal,
       icon: io5.IoWalletOutline,
-      text: gridColumn >= 2 ? t("Connect Wallet") : void 0,
+      text: gridColumn >= 2 ? t("Connect wallet") : void 0,
       rightIcon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { as: io.IoIosArrowForward })
     }
   ) });
@@ -6077,110 +6083,9 @@ var MainContent = ({ setCurrentContent, onClose }) => {
     /* @__PURE__ */ jsxRuntime.jsx(react.ModalFooter, { pt: 0, pb: "5px", children: /* @__PURE__ */ jsxRuntime.jsx(VersionFooter, {}) })
   ] });
 };
-var useFeatureAnnouncement = () => {
-  const [isVisible, setIsVisible] = React10.useState(true);
-  const CACHE_KEY = "vechain_kit_feature_announcement_closed";
-  React10.useEffect(() => {
-    const isClosed = localStorage.getItem(CACHE_KEY);
-    if (isClosed) {
-      setIsVisible(false);
-    }
-  }, []);
-  const closeAnnouncement = () => {
-    localStorage.setItem(CACHE_KEY, "true");
-    setIsVisible(false);
-  };
-  return {
-    isVisible,
-    closeAnnouncement
-  };
-};
-var FeatureAnnouncementCard = ({
-  setCurrentContent
-}) => {
-  const { t } = reactI18next.useTranslation();
-  const { isVisible, closeAnnouncement } = useFeatureAnnouncement();
-  const titleColor = react.useColorModeValue("gray.800", "whiteAlpha.900");
-  const handleOnClick = () => {
-    setCurrentContent({
-      type: "choose-name",
-      props: {
-        setCurrentContent,
-        onBack: () => setCurrentContent("main"),
-        initialContentSource: "main"
-      }
-    });
-    closeAnnouncement();
-  };
-  if (!isVisible) return null;
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    react.Card,
-    {
-      w: "full",
-      variant: "featureAnnouncement",
-      overflow: "hidden",
-      mb: 4,
-      onClick: handleOnClick,
-      cursor: "pointer",
-      _hover: { opacity: 0.8 },
-      children: /* @__PURE__ */ jsxRuntime.jsx(react.CardBody, { p: 4, children: /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { justify: "space-between", align: "flex-start", spacing: 3, children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { align: "flex-start", spacing: 1, children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { spacing: 2, children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              react.Text,
-              {
-                fontSize: "sm",
-                fontWeight: "400",
-                color: titleColor,
-                children: t("Claim your vet domain!")
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx(react.Tag, { size: "sm", colorScheme: "red", children: t("New") })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "xs", opacity: 0.5, children: t(
-            "Say goodbye to 0x addresses, claim your .veworld.vet subdomain now for free!"
-          ) })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          react.IconButton,
-          {
-            size: "sm",
-            variant: "ghost",
-            colorScheme: "gray",
-            icon: /* @__PURE__ */ jsxRuntime.jsx(io5.IoCloseCircle, {}),
-            onClick: (e) => {
-              e.stopPropagation();
-              closeAnnouncement();
-            },
-            "aria-label": t("Close announcement")
-          }
-        )
-      ] }) })
-    }
-  );
-};
-var ExchangeWarningAlert = () => {
-  const { t } = reactI18next.useTranslation();
-  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, mt: "10px" }),
-    /* @__PURE__ */ jsxRuntime.jsx(react.Text, { w: "full", children: t(
-      "Sending to OceanX or other exchanges may result in loss of funds."
-    ) })
-  ] }) }) });
-};
-var DomainRequiredAlert = () => {
-  const { t } = reactI18next.useTranslation();
-  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, mt: "10px" }),
-    /* @__PURE__ */ jsxRuntime.jsx(react.Text, { w: "full", children: t(
-      "A .vet domain is required to customize your profile. Choose an account name to get started."
-    ) })
-  ] }) }) });
-};
 var AccountMainContent = ({ setCurrentContent, wallet }) => {
   const { t } = reactI18next.useTranslation();
   const { network } = useVeChainKitConfig();
-  const { account } = useWallet();
   return /* @__PURE__ */ jsxRuntime.jsxs(ScrollToTopWrapper, { children: [
     /* @__PURE__ */ jsxRuntime.jsxs(StickyHeaderContainer, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(
@@ -6194,7 +6099,29 @@ var AccountMainContent = ({ setCurrentContent, wallet }) => {
           })
         }
       ),
-      /* @__PURE__ */ jsxRuntime.jsx(react.ModalHeader, { children: t("Wallet") }),
+      /* @__PURE__ */ jsxRuntime.jsx(react.ModalHeader, { children: /* @__PURE__ */ jsxRuntime.jsxs(
+        react.HStack,
+        {
+          w: "full",
+          justifyContent: "center",
+          p: 0,
+          spacing: 2,
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "md", fontWeight: "bold", children: t("Wallet") }),
+            network?.type !== "main" && /* @__PURE__ */ jsxRuntime.jsx(
+              react.Tag,
+              {
+                size: "xs",
+                colorScheme: "orange",
+                fontSize: "2xs",
+                p: 1,
+                textTransform: "uppercase",
+                children: `${network?.type}`
+              }
+            )
+          ]
+        }
+      ) }),
       /* @__PURE__ */ jsxRuntime.jsx(react.ModalCloseButton, {})
     ] }),
     /* @__PURE__ */ jsxRuntime.jsx(react.ModalBody, { w: "full", children: /* @__PURE__ */ jsxRuntime.jsxs(
@@ -6205,12 +6132,6 @@ var AccountMainContent = ({ setCurrentContent, wallet }) => {
         justifyContent: "flex-start",
         spacing: 6,
         children: [
-          !account?.domain && /* @__PURE__ */ jsxRuntime.jsx(
-            FeatureAnnouncementCard,
-            {
-              setCurrentContent
-            }
-          ),
           /* @__PURE__ */ jsxRuntime.jsx(
             AccountSelector,
             {
@@ -6221,26 +6142,6 @@ var AccountMainContent = ({ setCurrentContent, wallet }) => {
               wallet
             }
           ),
-          network?.type !== "main" && /* @__PURE__ */ jsxRuntime.jsx(
-            react.HStack,
-            {
-              w: "full",
-              justifyContent: "flex-start",
-              mt: "-10px",
-              mb: "-10px",
-              children: /* @__PURE__ */ jsxRuntime.jsx(
-                react.Tag,
-                {
-                  size: "xl",
-                  colorScheme: "orange",
-                  fontSize: "xs",
-                  p: 2,
-                  textTransform: "capitalize",
-                  children: `${network?.type} network`
-                }
-              )
-            }
-          ),
           /* @__PURE__ */ jsxRuntime.jsx(
             BalanceSection,
             {
@@ -6382,7 +6283,7 @@ var ActionButton = ({
             flex: 1,
             justifyContent: "flex-start",
             alignItems: "flex-start",
-            children: /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { justify: "flex-start", children: [
+            children: /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { justify: "flex-start", alignItems: "baseline", 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
@@ -6444,7 +6345,7 @@ var AccountSelector = ({
                         props: { width: 7, height: 7 }
                       }
                     ),
-                    /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: size, fontWeight: "500", children: chunkRUIC653T_cjs.humanDomain(wallet?.domain ?? "", 15, 0) || chunkRUIC653T_cjs.humanAddress(wallet?.address ?? "", 6, 4) })
+                    /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: size, fontWeight: "500", children: chunkRUIC653T_cjs.humanDomain(wallet?.domain ?? "", 18, 0) || chunkRUIC653T_cjs.humanAddress(wallet?.address ?? "", 6, 4) })
                   ] }),
                   /* @__PURE__ */ jsxRuntime.jsx(
                     react.Icon,
@@ -6829,7 +6730,8 @@ var QuickActionButton = ({
   icon,
   label,
   onClick,
-  isDisabled
+  isDisabled,
+  showRedDot
 }) => {
   const { t } = reactI18next.useTranslation();
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -6842,18 +6744,41 @@ var QuickActionButton = ({
       isDisabled,
       icon: /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { spacing: 4, children: [
         /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { as: icon, boxSize: 5, opacity: 0.9 }),
-        /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", fontWeight: "600", children: t(label, label) })
+        /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { p: 0, alignItems: "baseline", spacing: 1, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", fontWeight: "600", children: t(label, label) }),
+          showRedDot && /* @__PURE__ */ jsxRuntime.jsx(
+            react.Box,
+            {
+              minWidth: "8px",
+              height: "8px",
+              bg: "red.500",
+              borderRadius: "full",
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center"
+            }
+          )
+        ] })
       ] }),
       onClick
     }
   );
 };
 var QuickActionsSection = ({ mt, setCurrentContent }) => {
-  const { account } = useWallet();
+  const { account, smartAccount, connectedWallet } = useWallet();
   const { totalBalance } = useBalances({
     address: account?.address ?? ""
   });
   const { t } = reactI18next.useTranslation();
+  const { data: upgradeRequired } = useUpgradeRequired(
+    smartAccount?.address ?? "",
+    connectedWallet?.address ?? "",
+    3
+  );
+  const { getNotifications } = useNotifications();
+  const notifications = getNotifications();
+  const hasUnreadNotifications = notifications.some((n) => !n.isRead);
+  const showRedDot = upgradeRequired || hasUnreadNotifications;
   return /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { w: "full", mt, spacing: 4, children: [
     /* @__PURE__ */ jsxRuntime.jsx(react.Heading, { size: "xs", fontWeight: "500", w: "full", opacity: 0.5, children: t("Activities") }),
     /* @__PURE__ */ jsxRuntime.jsx(react.Grid, { templateColumns: "repeat(3, 1fr)", gap: 2, w: "full", children: QUICK_ACTIONS.map((action) => /* @__PURE__ */ jsxRuntime.jsx(
@@ -6862,16 +6787,121 @@ var QuickActionsSection = ({ mt, setCurrentContent }) => {
         icon: action.icon,
         label: action.label,
         onClick: () => action.onClick(setCurrentContent),
-        isDisabled: action.isDisabled?.(totalBalance)
+        isDisabled: action.isDisabled?.(totalBalance),
+        showRedDot: showRedDot && action.label === "Settings"
       },
       action.label
     )) })
   ] });
 };
+var useFeatureAnnouncement = () => {
+  const [isVisible, setIsVisible] = React10.useState(true);
+  const CACHE_KEY = "vechain_kit_feature_announcement_closed";
+  React10.useEffect(() => {
+    const isClosed = localStorage.getItem(CACHE_KEY);
+    if (isClosed) {
+      setIsVisible(false);
+    }
+  }, []);
+  const closeAnnouncement = () => {
+    localStorage.setItem(CACHE_KEY, "true");
+    setIsVisible(false);
+  };
+  return {
+    isVisible,
+    closeAnnouncement
+  };
+};
+var FeatureAnnouncementCard = ({
+  setCurrentContent
+}) => {
+  const { t } = reactI18next.useTranslation();
+  const { isVisible, closeAnnouncement } = useFeatureAnnouncement();
+  const titleColor = react.useColorModeValue("blackAlpha.800", "whiteAlpha.800");
+  const descriptionColor = react.useColorModeValue(
+    "blackAlpha.700",
+    "whiteAlpha.700"
+  );
+  const handleOnClick = () => {
+    setCurrentContent({
+      type: "choose-name",
+      props: {
+        setCurrentContent,
+        onBack: () => setCurrentContent("main"),
+        initialContentSource: "main"
+      }
+    });
+    closeAnnouncement();
+  };
+  if (!isVisible) return null;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    react.Card,
+    {
+      w: "full",
+      variant: "featureAnnouncement",
+      overflow: "hidden",
+      onClick: handleOnClick,
+      cursor: "pointer",
+      _hover: { opacity: 0.8 },
+      children: /* @__PURE__ */ jsxRuntime.jsx(react.CardBody, { p: 4, children: /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { justify: "space-between", align: "flex-start", spacing: 3, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { align: "flex-start", spacing: 1, children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { spacing: 2, children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              react.Text,
+              {
+                fontSize: "sm",
+                fontWeight: "400",
+                color: titleColor,
+                children: t("Claim your vet domain!")
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(react.Tag, { size: "sm", colorScheme: "red", children: t("New") })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "xs", color: descriptionColor, children: t(
+            "Say goodbye to 0x addresses, claim your .veworld.vet subdomain now for free!"
+          ) })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          react.IconButton,
+          {
+            size: "sm",
+            variant: "ghost",
+            colorScheme: "gray",
+            icon: /* @__PURE__ */ jsxRuntime.jsx(io5.IoCloseCircle, {}),
+            onClick: (e) => {
+              e.stopPropagation();
+              closeAnnouncement();
+            },
+            "aria-label": t("Close announcement")
+          }
+        )
+      ] }) })
+    }
+  );
+};
+var ExchangeWarningAlert = () => {
+  const { t } = reactI18next.useTranslation();
+  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, mt: "10px" }),
+    /* @__PURE__ */ jsxRuntime.jsx(react.Text, { w: "full", children: t(
+      "Sending to OceanX or other exchanges may result in loss of funds."
+    ) })
+  ] }) }) });
+};
+var DomainRequiredAlert = () => {
+  const { t } = reactI18next.useTranslation();
+  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, mt: "10px" }),
+    /* @__PURE__ */ jsxRuntime.jsx(react.Text, { w: "full", children: t(
+      "A .vet domain is required to customize your profile. Choose an account name to get started."
+    ) })
+  ] }) }) });
+};
 var AccessAndSecurityContent = ({ setCurrentContent }) => {
   const { t } = reactI18next.useTranslation();
   const { exportWallet } = reactAuth.usePrivy();
   const { showMfaEnrollmentModal } = reactAuth.useMfaEnrollment();
+  const { setWalletRecovery } = reactAuth.useSetWalletRecovery();
   const { connection, smartAccount, connectedWallet } = useWallet();
   const { data: upgradeRequired } = useUpgradeRequired(
     smartAccount?.address ?? "",
@@ -6918,6 +6948,38 @@ var AccessAndSecurityContent = ({ setCurrentContent }) => {
               }
             )
           ] }),
+          upgradeRequired && /* @__PURE__ */ jsxRuntime.jsx(
+            ActionButton,
+            {
+              title: t("Upgrade Smart Account to V3"),
+              description: t(
+                "A new version is available for your account"
+              ),
+              onClick: () => {
+                setCurrentContent({
+                  type: "upgrade-smart-account",
+                  props: {
+                    setCurrentContent,
+                    initialContent: "access-and-security"
+                  }
+                });
+              },
+              leftIcon: io5.IoCogSharp,
+              extraContent: /* @__PURE__ */ jsxRuntime.jsx(
+                react.Box,
+                {
+                  minWidth: "8px",
+                  height: "8px",
+                  bg: "red.500",
+                  borderRadius: "full",
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "center",
+                  ml: 2
+                }
+              )
+            }
+          ),
           /* @__PURE__ */ jsxRuntime.jsx(
             ActionButton,
             {
@@ -6963,23 +7025,15 @@ var AccessAndSecurityContent = ({ setCurrentContent }) => {
               leftIcon: hi2.HiOutlineShieldCheck
             }
           ),
-          upgradeRequired && /* @__PURE__ */ jsxRuntime.jsx(
+          /* @__PURE__ */ jsxRuntime.jsx(
             ActionButton,
             {
-              title: t("Upgrade Smart Account to V3"),
-              description: t(
-                "A new version is available for your account"
-              ),
+              title: t("Manage Recovery"),
               onClick: () => {
-                setCurrentContent({
-                  type: "upgrade-smart-account",
-                  props: {
-                    setCurrentContent,
-                    initialContent: "access-and-security"
-                  }
-                });
+                setWalletRecovery();
               },
-              leftIcon: hi2.HiOutlineShieldCheck
+              isDisabled: !connection.isConnectedWithSocialLogin,
+              leftIcon: md.MdOutlineSettingsBackupRestore
             }
           )
         ]
@@ -7225,13 +7279,18 @@ var SettingsContent = ({
   const contentRef = React10.useRef(null);
   const { t } = reactI18next.useTranslation();
   const { privy } = useVeChainKitConfig();
-  const { connection, disconnect, account } = useWallet();
+  const { connection, disconnect, account, smartAccount, connectedWallet } = 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);
+  const { data: upgradeRequired } = useUpgradeRequired(
+    smartAccount?.address ?? "",
+    connectedWallet?.address ?? "",
+    3
+  );
   React10.useEffect(() => {
     if (contentRef.current) {
       contentRef.current.scrollTop = 0;
@@ -7292,7 +7351,19 @@ var SettingsContent = ({
             setCurrentContent("access-and-security");
           },
           leftIcon: io5.IoShieldOutline,
-          rightIcon: md.MdOutlineNavigateNext
+          rightIcon: md.MdOutlineNavigateNext,
+          extraContent: upgradeRequired && /* @__PURE__ */ jsxRuntime.jsx(
+            react.Box,
+            {
+              minWidth: "8px",
+              height: "8px",
+              bg: "red.500",
+              borderRadius: "full",
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center"
+            }
+          )
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsx(
@@ -7330,17 +7401,13 @@ var SettingsContent = ({
           extraContent: hasUnreadNotifications && /* @__PURE__ */ jsxRuntime.jsx(
             react.Box,
             {
-              minWidth: "16px",
-              height: "16px",
+              minWidth: "8px",
+              height: "8px",
               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 })
+              justifyContent: "center"
             }
           )
         }
@@ -8297,6 +8364,10 @@ var SendTokenSummaryContent = ({
     return selectedToken.symbol === "VET" ? transferVETReceipt : transferERC20Receipt;
   };
   const handleSend = async () => {
+    if (upgradeRequired) {
+      openUpgradeSmartAccountModal();
+      return;
+    }
     try {
       if (selectedToken.symbol === "VET") {
         await transferVET();
@@ -8309,11 +8380,6 @@ var SendTokenSummaryContent = ({
   };
   const isTxWaitingConfirmation = transferERC20WaitingForWalletConfirmation || transferVETWaitingForWalletConfirmation;
   const isSubmitting = isTxWaitingConfirmation || transferERC20Pending || transferVETPending;
-  React10.useEffect(() => {
-    if (upgradeRequired) {
-      openUpgradeSmartAccountModal();
-    }
-  }, [upgradeRequired, openUpgradeSmartAccountModal]);
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsxs(StickyHeaderContainer, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(react.ModalHeader, { children: "Send" }),
@@ -8412,7 +8478,7 @@ var SendTokenSummaryContent = ({
         transactionPendingText: t("Sending..."),
         txReceipt: getTxReceipt(),
         buttonText: t("Confirm"),
-        isDisabled: isSubmitting || upgradeRequired
+        isDisabled: isSubmitting
       }
     ) })
   ] });
@@ -8878,17 +8944,16 @@ var ChooseNameSummaryContent = ({
     }
   });
   const handleConfirm = async () => {
+    if (upgradeRequired) {
+      openUpgradeSmartAccountModal();
+      return;
+    }
     try {
       await sendTransaction();
     } catch (error) {
       console.error("Transaction failed:", error);
     }
   };
-  React10.useEffect(() => {
-    if (upgradeRequired) {
-      openUpgradeSmartAccountModal();
-    }
-  }, [upgradeRequired, openUpgradeSmartAccountModal]);
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsxs(StickyHeaderContainer, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(react.ModalHeader, { children: t("Confirm Name") }),
@@ -8922,7 +8987,7 @@ var ChooseNameSummaryContent = ({
         transactionPendingText: t("Claiming name..."),
         txReceipt,
         buttonText: t("Confirm"),
-        isDisabled: isTransactionPending || upgradeRequired
+        isDisabled: isTransactionPending
       }
     ) })
   ] });
@@ -9174,6 +9239,7 @@ var en_default = {
   "Confirm transaction": "Confirm transaction",
   "Connect Wallet": "Connect Wallet",
   "Connect an external wallet for easier access": "Connect an external wallet for easier access",
+  "Connect wallet": "Connect wallet",
   "Connect your Apple account for easier access": "Connect your Apple account for easier access",
   "Connect your Discord account for easier access": "Connect your Discord account for easier access",
   "Connect your Farcaster account for easier access": "Connect your Farcaster account for easier access",
@@ -9306,6 +9372,7 @@ var en_default = {
   Mainnet: "Mainnet",
   "Manage Custom Tokens": "Manage Custom Tokens",
   "Manage MFA": "Manage MFA",
+  "Manage Recovery": "Manage Recovery",
   "Manage multi-factor authentication settings for your wallet.": "Manage multi-factor authentication settings for your wallet.",
   "Manage on VeBetterDAO": "Manage on VeBetterDAO",
   "Manage passkey login": "Manage passkey login",
@@ -9654,6 +9721,7 @@ var de_default = {
   "Confirm transaction": "Transaktion best\xE4tigen",
   "Connect Wallet": "Wallet verbinden",
   "Connect an external wallet for easier access": "Verbinden Sie eine externe Wallet f\xFCr einfacheren Zugang",
+  "Connect wallet": "Wallet verbinden",
   "Connect your Apple account for easier access": "Verbinden Sie Ihr Apple-Konto f\xFCr einfacheren Zugriff",
   "Connect your Discord account for easier access": "Verbinden Sie Ihr Discord-Konto f\xFCr einen einfacheren Zugriff",
   "Connect your Farcaster account for easier access": "Verbinden Sie Ihr Farcaster-Konto f\xFCr einfacheren Zugriff",
@@ -9786,6 +9854,7 @@ var de_default = {
   Mainnet: "Mainnet",
   "Manage Custom Tokens": "Benutzerdefinierte Token verwalten",
   "Manage MFA": "MFA verwalten",
+  "Manage Recovery": "Wiederherstellung verwalten",
   "Manage multi-factor authentication settings for your wallet.": "Verwalten Sie die Einstellungen zur Multi-Faktor-Authentifizierung f\xFCr Ihr Wallet.",
   "Manage on VeBetterDAO": "Verwalten auf VeBetterDAO",
   "Manage passkey login": "Passkey-Anmeldung verwalten",
@@ -10134,6 +10203,7 @@ var it_default = {
   "Confirm transaction": "Conferma transazione",
   "Connect Wallet": "Collega Portafoglio",
   "Connect an external wallet for easier access": "Collega un portafoglio esterno per un accesso pi\xF9 semplice",
+  "Connect wallet": "Connetti portafoglio",
   "Connect your Apple account for easier access": "Collega il tuo account Apple per un accesso pi\xF9 facile",
   "Connect your Discord account for easier access": "Collega il tuo account Discord per accedere pi\xF9 facilmente",
   "Connect your Farcaster account for easier access": "Collega il tuo account Farcaster per un accesso pi\xF9 facile",
@@ -10266,6 +10336,7 @@ var it_default = {
   Mainnet: "Mainnet",
   "Manage Custom Tokens": "Gestisci Token Personalizzati",
   "Manage MFA": "Gestisci MFA",
+  "Manage Recovery": "Gestisci Recupero",
   "Manage multi-factor authentication settings for your wallet.": "Gestisci le impostazioni di autenticazione a pi\xF9 fattori per il tuo portafoglio.",
   "Manage on VeBetterDAO": "Gestisci su VeBetterDAO",
   "Manage passkey login": "Gestisci login con chiave di accesso",
@@ -10614,6 +10685,7 @@ var fr_default = {
   "Confirm transaction": "Confirmer la transaction",
   "Connect Wallet": "Connecter le portefeuille",
   "Connect an external wallet for easier access": "Connectez un portefeuille externe pour un acc\xE8s plus facile",
+  "Connect wallet": "Connecter le portefeuille",
   "Connect your Apple account for easier access": "Connectez votre compte Apple pour un acc\xE8s plus facile",
   "Connect your Discord account for easier access": "Connectez votre compte Discord pour un acc\xE8s plus facile",
   "Connect your Farcaster account for easier access": "Connectez votre compte Farcaster pour un acc\xE8s plus facile",
@@ -10746,6 +10818,7 @@ var fr_default = {
   Mainnet: "Mainnet",
   "Manage Custom Tokens": "G\xE9rer les jetons personnalis\xE9s",
   "Manage MFA": "G\xE9rer la MFA",
+  "Manage Recovery": "G\xE9rer la r\xE9cup\xE9ration",
   "Manage multi-factor authentication settings for your wallet.": "G\xE9rez les param\xE8tres d'authentification \xE0 plusieurs facteurs pour votre portefeuille.",
   "Manage on VeBetterDAO": "G\xE9rer sur VeBetterDAO",
   "Manage passkey login": "G\xE9rer la connexion par cl\xE9 de passe",
@@ -11094,6 +11167,7 @@ var es_default = {
   "Confirm transaction": "Confirmar transacci\xF3n",
   "Connect Wallet": "Conectar Monedero",
   "Connect an external wallet for easier access": "Conectar una billetera externa para un acceso m\xE1s f\xE1cil",
+  "Connect wallet": "Conectar billetera",
   "Connect your Apple account for easier access": "Conecta tu cuenta de Apple para un acceso m\xE1s f\xE1cil",
   "Connect your Discord account for easier access": "Conecta tu cuenta de Discord para un acceso m\xE1s f\xE1cil",
   "Connect your Farcaster account for easier access": "Conecta tu cuenta de Farcaster para un acceso m\xE1s f\xE1cil",
@@ -11226,6 +11300,7 @@ var es_default = {
   Mainnet: "Red principal",
   "Manage Custom Tokens": "Gestionar tokens personalizados",
   "Manage MFA": "Gestionar MFA",
+  "Manage Recovery": "Gestionar la Recuperaci\xF3n",
   "Manage multi-factor authentication settings for your wallet.": "Gestionar configuraciones de autenticaci\xF3n multifactor para tu billetera.",
   "Manage on VeBetterDAO": "Gestionar en VeBetterDAO",
   "Manage passkey login": "Administrar inicio de sesi\xF3n con llave de acceso",
@@ -11574,6 +11649,7 @@ var zh_default = {
   "Confirm transaction": "\u786E\u8BA4\u4EA4\u6613",
   "Connect Wallet": "\u8FDE\u63A5\u94B1\u5305",
   "Connect an external wallet for easier access": "\u8FDE\u63A5\u5916\u90E8\u94B1\u5305\u4EE5\u4FBF\u66F4\u8F7B\u677E\u8BBF\u95EE",
+  "Connect wallet": "\u8FDE\u63A5\u94B1\u5305",
   "Connect your Apple account for easier access": "\u8FDE\u63A5\u60A8\u7684 Apple \u8D26\u6237\u4EE5\u4FBF\u66F4\u8F7B\u677E\u5730\u8BBF\u95EE",
   "Connect your Discord account for easier access": "\u8FDE\u63A5\u60A8\u7684 Discord \u5E10\u53F7\u4EE5\u66F4\u8F7B\u677E\u5730\u8BBF\u95EE",
   "Connect your Farcaster account for easier access": "\u8FDE\u63A5\u60A8\u7684 Farcaster \u8D26\u6237\u4EE5\u4FBF\u66F4\u8F7B\u677E\u5730\u8BBF\u95EE",
@@ -11706,6 +11782,7 @@ var zh_default = {
   Mainnet: "\u4E3B\u7F51",
   "Manage Custom Tokens": "\u7BA1\u7406\u81EA\u5B9A\u4E49\u4EE3\u5E01",
   "Manage MFA": "\u7BA1\u7406\u591A\u56E0\u7D20\u8BA4\u8BC1",
+  "Manage Recovery": "\u7BA1\u7406\u6062\u590D",
   "Manage multi-factor authentication settings for your wallet.": "\u7BA1\u7406\u60A8\u94B1\u5305\u7684\u591A\u56E0\u7D20\u8BA4\u8BC1\u8BBE\u7F6E\u3002",
   "Manage on VeBetterDAO": "\u5728VeBetterDAO\u4E0A\u7BA1\u7406",
   "Manage passkey login": "\u7BA1\u7406\u5BC6\u7801\u767B\u5F55",
@@ -12054,6 +12131,7 @@ var ja_default = {
   "Confirm transaction": "\u53D6\u5F15\u3092\u78BA\u8A8D",
   "Connect Wallet": "\u30A6\u30A9\u30EC\u30C3\u30C8\u3092\u63A5\u7D9A",
   "Connect an external wallet for easier access": "\u5916\u90E8\u30A6\u30A9\u30EC\u30C3\u30C8\u3092\u63A5\u7D9A\u3057\u3066\u7C21\u5358\u306B\u30A2\u30AF\u30BB\u30B9",
+  "Connect wallet": "\u30A6\u30A9\u30EC\u30C3\u30C8\u3092\u63A5\u7D9A",
   "Connect your Apple account for easier access": "Apple\u30A2\u30AB\u30A6\u30F3\u30C8\u3092\u63A5\u7D9A\u3057\u3066\u7C21\u5358\u306B\u30A2\u30AF\u30BB\u30B9",
   "Connect your Discord account for easier access": "\u7C21\u5358\u306A\u30A2\u30AF\u30BB\u30B9\u306E\u305F\u3081\u306B\u3042\u306A\u305F\u306EDiscord\u30A2\u30AB\u30A6\u30F3\u30C8\u3092\u63A5\u7D9A\u3057\u3066\u304F\u3060\u3055\u3044",
   "Connect your Farcaster account for easier access": "Farcaster\u30A2\u30AB\u30A6\u30F3\u30C8\u3092\u63A5\u7D9A\u3057\u3066\u7C21\u5358\u306B\u30A2\u30AF\u30BB\u30B9",
@@ -12186,6 +12264,7 @@ var ja_default = {
   Mainnet: "\u30E1\u30A4\u30F3\u30CD\u30C3\u30C8",
   "Manage Custom Tokens": "\u30AB\u30B9\u30BF\u30E0\u30C8\u30FC\u30AF\u30F3\u306E\u7BA1\u7406",
   "Manage MFA": "MFA\u3092\u7BA1\u7406\u3059\u308B",
+  "Manage Recovery": "\u30EA\u30AB\u30D0\u30EA\u30FC\u306E\u7BA1\u7406",
   "Manage multi-factor authentication settings for your wallet.": "\u30A6\u30A9\u30EC\u30C3\u30C8\u306E\u591A\u8981\u7D20\u8A8D\u8A3C\u8A2D\u5B9A\u3092\u7BA1\u7406\u3059\u308B\u3002",
   "Manage on VeBetterDAO": "VeBetterDAO\u3067\u7BA1\u7406",
   "Manage passkey login": "\u30D1\u30B9\u30AD\u30FC\u306E\u30ED\u30B0\u30A4\u30F3\u3092\u7BA1\u7406",
@@ -13077,13 +13156,17 @@ var CustomizationSummaryContent = ({
             "Your changes have been saved successfully."
           ),
           onDone: () => {
-            setCurrentContent("settings");
+            setCurrentContent("profile");
           }
         }
       });
     }
   });
   const onSubmit = async (data) => {
+    if (upgradeRequired) {
+      openUpgradeSmartAccountModal();
+      return;
+    }
     try {
       const domain2 = account?.domain ?? "";
       const CHANGES_TO_TEXT_RECORDS = {
@@ -13122,11 +13205,6 @@ var CustomizationSummaryContent = ({
       /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "md", children: value })
     ] });
   };
-  React10.useEffect(() => {
-    if (upgradeRequired) {
-      openUpgradeSmartAccountModal();
-    }
-  }, [upgradeRequired, openUpgradeSmartAccountModal]);
   return /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { as: "form", onSubmit: handleSubmit(onSubmit), children: [
     /* @__PURE__ */ jsxRuntime.jsxs(StickyHeaderContainer, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(react.ModalHeader, { children: t("Confirm Changes") }),
@@ -13167,7 +13245,7 @@ var CustomizationSummaryContent = ({
         transactionPendingText: t("Saving changes..."),
         txReceipt,
         buttonText: t("Confirm"),
-        isDisabled: isTransactionPending || upgradeRequired
+        isDisabled: isTransactionPending
       }
     ) })
   ] });
@@ -13184,26 +13262,34 @@ var ProfileContent = ({
       /* @__PURE__ */ jsxRuntime.jsx(ModalBackButton, { onClick: () => setCurrentContent("main") }),
       /* @__PURE__ */ jsxRuntime.jsx(react.ModalCloseButton, {})
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(react.ModalBody, { w: "full", children: /* @__PURE__ */ jsxRuntime.jsx(
-      ProfileCard,
-      {
-        onEditClick: () => setCurrentContent("account-customization"),
-        address: account?.address ?? "",
-        showHeader: false,
-        onLogout: () => {
-          setCurrentContent?.({
-            type: "disconnect-confirm",
-            props: {
-              onDisconnect: () => {
-                disconnect();
-                onLogoutSuccess?.();
-              },
-              onBack: () => setCurrentContent?.("profile")
-            }
-          });
+    /* @__PURE__ */ jsxRuntime.jsx(react.ModalBody, { w: "full", children: /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { w: "full", spacing: 2, children: [
+      !account?.domain && /* @__PURE__ */ jsxRuntime.jsx(
+        FeatureAnnouncementCard,
+        {
+          setCurrentContent
         }
-      }
-    ) }),
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        ProfileCard,
+        {
+          onEditClick: () => setCurrentContent("account-customization"),
+          address: account?.address ?? "",
+          showHeader: false,
+          onLogout: () => {
+            setCurrentContent?.({
+              type: "disconnect-confirm",
+              props: {
+                onDisconnect: () => {
+                  disconnect();
+                  onLogoutSuccess?.();
+                },
+                onBack: () => setCurrentContent?.("profile")
+              }
+            });
+          }
+        }
+      )
+    ] }) }),
     /* @__PURE__ */ jsxRuntime.jsx(react.ModalFooter, { pt: 0 })
   ] });
 };
@@ -13273,12 +13359,71 @@ var UpgradeSmartAccountContent = ({
       ),
       /* @__PURE__ */ jsxRuntime.jsx(react.ModalCloseButton, {})
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(react.ModalBody, { children: /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { spacing: 6, align: "stretch", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(react.ModalBody, { children: /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { spacing: 10, align: "stretch", children: [
       /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", textAlign: "center", children: upgradeRequired ? t(
         "Your smart account needs to be upgraded to the latest version (v3)."
       ) : t(
         "Your smart account is already upgraded to this version."
       ) }),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        react.HStack,
+        {
+          align: "center",
+          justifyContent: "space-evenly",
+          rounded: "md",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { position: "relative", display: "inline-block", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(react.Circle, { size: "60px", bg: "gray.200", children: /* @__PURE__ */ jsxRuntime.jsx(
+                react.Image,
+                {
+                  borderRadius: "full",
+                  src: smartAccount?.image,
+                  alt: t("Profile Picture"),
+                  w: "100%",
+                  h: "100%",
+                  objectFit: "cover"
+                }
+              ) }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                react.Heading,
+                {
+                  position: "absolute",
+                  top: "-5",
+                  right: "-5",
+                  color: "#D23F63",
+                  fontSize: "28px",
+                  children: `v1`
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { as: fa.FaArrowRight, color: "#3DBA67" }),
+            /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { position: "relative", display: "inline-block", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(react.Circle, { size: "60px", bg: "gray.200", children: /* @__PURE__ */ jsxRuntime.jsx(
+                react.Image,
+                {
+                  borderRadius: "full",
+                  src: smartAccount?.image,
+                  alt: t("Profile Picture"),
+                  w: "100%",
+                  h: "100%",
+                  objectFit: "cover"
+                }
+              ) }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                react.Heading,
+                {
+                  position: "absolute",
+                  top: "-5",
+                  right: "-5",
+                  color: "#3DBA67",
+                  fontSize: "28px",
+                  children: `v3`
+                }
+              )
+            ] })
+          ]
+        }
+      ),
       /* @__PURE__ */ jsxRuntime.jsxs(react.Alert, { status: "info", borderRadius: "md", children: [
         /* @__PURE__ */ jsxRuntime.jsx(react.AlertIcon, {}),
         /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { children: [
@@ -13304,23 +13449,6 @@ var UpgradeSmartAccountContent = ({
             ] })
           ] }) })
         ] })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs(react.Alert, { status: "warning", borderRadius: "md", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(react.AlertIcon, { as: io5.IoWarningOutline }),
-        /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(react.AlertTitle, { fontSize: "sm", children: t("Important") }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            react.AlertDescription,
-            {
-              fontSize: "xs",
-              lineHeight: "17px",
-              display: "block",
-              children: t(
-                "This upgrade is necessary to continue interacting with VeChain blockchain. Please complete it now."
-              )
-            }
-          )
-        ] })
       ] })
     ] }) }),
     /* @__PURE__ */ jsxRuntime.jsx(react.ModalFooter, { justifyContent: "center", children: /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { spacing: 3, w: "full", children: [
@@ -14537,7 +14665,7 @@ var DEFAULT_APPS = [
     name: "VeChain Kit",
     description: "A all-in-one library for building VeChain applications.",
     external_url: "https://vechainkit.vechain.org/",
-    logo: "https://i.ibb.co/ncysMF9/vechain-kit-logo-transparent.png",
+    logo: "https://vechain.org/wp-content/uploads/2025/02/VeChain_Icon_Quartz_300ppi.png",
     banner: "",
     screenshots: [],
     social_urls: [],
@@ -14840,7 +14968,7 @@ var TransactionModalContent = ({
         };
       case "error":
         return {
-          title: uiConfig?.title ?? t("Something went wrong"),
+          title: t("Something went wrong"),
           icon: uiConfig?.errorIcon ?? /* @__PURE__ */ jsxRuntime.jsx(
             react.Icon,
             {
@@ -14853,7 +14981,7 @@ var TransactionModalContent = ({
         };
       case "success":
         return {
-          title: uiConfig?.title ?? t("Transaction completed!"),
+          title: t("Transaction successful!"),
           icon: uiConfig?.successIcon ?? /* @__PURE__ */ jsxRuntime.jsx(
             react.Icon,
             {
@@ -15021,7 +15149,7 @@ var SuccessfulOperationContent = ({
   showSocialButtons = false
 }) => {
   const { t } = reactI18next.useTranslation();
-  const { network } = useVeChainKitConfig();
+  const { network, darkMode } = useVeChainKitConfig();
   const explorerUrl = chunkRUIC653T_cjs.getConfig(network.type).explorerUrl;
   const socialDescription = `${explorerUrl}/${txId}`;
   return /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { children: [
@@ -15035,7 +15163,7 @@ var SuccessfulOperationContent = ({
         {
           as: io.IoIosCheckmarkCircleOutline,
           fontSize: "100px",
-          color: "#22c55e"
+          color: darkMode ? "#00ff45de" : "#10ba3e"
         }
       ),
       description && /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", textAlign: "center", children: description }),
@@ -16163,7 +16291,7 @@ var SuccessfulOperationContent2 = ({
   showSocialButtons = false
 }) => {
   const { t } = reactI18next.useTranslation();
-  const { network } = useVeChainKitConfig();
+  const { network, darkMode } = useVeChainKitConfig();
   const explorerUrl = chunkRUIC653T_cjs.getConfig(network.type).explorerUrl;
   const socialDescription = `${explorerUrl}/${txId}`;
   return /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { children: [
@@ -16188,7 +16316,7 @@ var SuccessfulOperationContent2 = ({
             {
               as: io.IoIosCheckmarkCircleOutline,
               fontSize: "100px",
-              color: "#00ff45de"
+              color: darkMode ? "#00ff45de" : "#10ba3e"
             }
           )
         }
@@ -16242,7 +16370,8 @@ var SuccessfulOperationContent2 = ({
 };
 var UpgradeSmartAccountContent2 = ({
   setCurrentContent,
-  handleClose
+  handleClose,
+  style
 }) => {
   const { t } = reactI18next.useTranslation();
   const { smartAccount, connectedWallet } = useWallet();
@@ -16293,10 +16422,69 @@ var UpgradeSmartAccountContent2 = ({
       /* @__PURE__ */ jsxRuntime.jsx(react.ModalHeader, { children: t("Account upgrade required") }),
       /* @__PURE__ */ jsxRuntime.jsx(react.ModalCloseButton, {})
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(react.ModalBody, { children: /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { spacing: 6, align: "stretch", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(react.ModalBody, { children: /* @__PURE__ */ jsxRuntime.jsxs(react.VStack, { spacing: 10, align: "stretch", justifyContent: "center", children: [
       /* @__PURE__ */ jsxRuntime.jsx(react.Text, { fontSize: "sm", textAlign: "center", children: t(
         "To continue interacting with VeChain blockchain and complete your operation, your smart account needs to be upgraded to the latest version (v3)."
       ) }),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        react.HStack,
+        {
+          align: "center",
+          justifyContent: "space-evenly",
+          rounded: "md",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { position: "relative", display: "inline-block", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(react.Circle, { size: "60px", bg: "gray.200", children: /* @__PURE__ */ jsxRuntime.jsx(
+                react.Image,
+                {
+                  src: smartAccount?.image,
+                  alt: t("Profile Picture"),
+                  w: "100%",
+                  h: "100%",
+                  borderRadius: "full",
+                  objectFit: "cover"
+                }
+              ) }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                react.Heading,
+                {
+                  position: "absolute",
+                  top: "-5",
+                  right: "-5",
+                  color: "#D23F63",
+                  fontSize: "28px",
+                  children: `v1`
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { as: fa.FaArrowRight, color: "#3DBA67" }),
+            /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { position: "relative", display: "inline-block", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(react.Circle, { size: "60px", bg: "gray.200", children: /* @__PURE__ */ jsxRuntime.jsx(
+                react.Image,
+                {
+                  src: smartAccount?.image,
+                  alt: t("Profile Picture"),
+                  w: "100%",
+                  h: "100%",
+                  borderRadius: "full",
+                  objectFit: "cover"
+                }
+              ) }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                react.Heading,
+                {
+                  position: "absolute",
+                  top: "-5",
+                  right: "-5",
+                  color: "#3DBA67",
+                  fontSize: "28px",
+                  children: `v3`
+                }
+              )
+            ] })
+          ]
+        }
+      ),
       /* @__PURE__ */ jsxRuntime.jsxs(react.Alert, { status: "info", borderRadius: "md", children: [
         /* @__PURE__ */ jsxRuntime.jsx(react.AlertIcon, {}),
         /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { children: [
@@ -16322,28 +16510,12 @@ var UpgradeSmartAccountContent2 = ({
             ] })
           ] }) })
         ] })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs(react.Alert, { status: "warning", borderRadius: "md", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(react.AlertIcon, { as: io5.IoWarningOutline }),
-        /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(react.AlertTitle, { fontSize: "sm", children: t("Important") }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            react.AlertDescription,
-            {
-              fontSize: "xs",
-              lineHeight: "17px",
-              display: "block",
-              children: t(
-                "This upgrade is necessary to continue interacting with VeChain blockchain. Please complete it now."
-              )
-            }
-          )
-        ] })
       ] })
     ] }) }),
     /* @__PURE__ */ jsxRuntime.jsx(react.ModalFooter, { justifyContent: "center", children: /* @__PURE__ */ jsxRuntime.jsx(react.VStack, { spacing: 3, w: "full", children: /* @__PURE__ */ jsxRuntime.jsx(
       TransactionButtonAndStatus,
       {
+        style,
         buttonText: upgradeRequired ? t("Upgrade account") : t("Account already upgraded"),
         onConfirm: handleUpgrade,
         isTxWaitingConfirmation: isWaitingForWalletConfirmation,
@@ -16356,7 +16528,7 @@ var UpgradeSmartAccountContent2 = ({
     ) }) })
   ] });
 };
-var UpgradeSmartAccountModal = ({ isOpen, onClose }) => {
+var UpgradeSmartAccountModal = ({ isOpen, onClose, style }) => {
   const [currentContent, setCurrentContent] = React10.useState(
     "upgrade-smart-account"
   );
@@ -16376,7 +16548,8 @@ var UpgradeSmartAccountModal = ({ isOpen, onClose }) => {
         UpgradeSmartAccountContent2,
         {
           setCurrentContent,
-          handleClose: onClose
+          handleClose: onClose,
+          style
         }
       );
     }
@@ -16388,6 +16561,7 @@ var UpgradeSmartAccountModal = ({ isOpen, onClose }) => {
       onClose,
       allowExternalFocus: true,
       blockScrollOnMount: true,
+      size: style?.modalSize,
       children: renderContent()
     }
   );
@@ -16416,10 +16590,13 @@ var ModalProvider = ({ children }) => {
     []
   );
   const [isAccountModalOpen, setIsAccountModalOpen] = React10.useState(false);
-  const openAccountModal = React10.useCallback(() => {
-    setAccountModalContent("main");
-    setIsAccountModalOpen(true);
-  }, []);
+  const openAccountModal = React10.useCallback(
+    (content) => {
+      setAccountModalContent(content ?? "main");
+      setIsAccountModalOpen(true);
+    },
+    []
+  );
   const closeAccountModal = React10.useCallback(
     () => setIsAccountModalOpen(false),
     []
@@ -16443,8 +16620,12 @@ var ModalProvider = ({ children }) => {
     []
   );
   const [isUpgradeSmartAccountModalOpen, setIsUpgradeSmartAccountModalOpen] = React10.useState(false);
+  const [upgradeSmartAccountModalStyle, setUpgradeSmartAccountModalStyle] = React10.useState(void 0);
   const openUpgradeSmartAccountModal = React10.useCallback(
-    () => setIsUpgradeSmartAccountModalOpen(true),
+    (style) => {
+      setUpgradeSmartAccountModalStyle(style);
+      setIsUpgradeSmartAccountModalOpen(true);
+    },
     []
   );
   const closeUpgradeSmartAccountModal = React10.useCallback(
@@ -16495,7 +16676,8 @@ var ModalProvider = ({ children }) => {
           UpgradeSmartAccountModal,
           {
             isOpen: isUpgradeSmartAccountModalOpen,
-            onClose: closeUpgradeSmartAccountModal
+            onClose: closeUpgradeSmartAccountModal,
+            style: upgradeSmartAccountModalStyle
           }
         )
       ]
@@ -16517,7 +16699,7 @@ var useAccountModal = () => {
     closeAccountModal: close,
     isAccountModalOpen: isOpen
   } = useModal();
-  return { open, close, isOpen };
+  return { open: () => open(), close, isOpen };
 };
 var AccountModalProvider = ({ children }) => /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
 var useTransactionModal = () => {
@@ -16579,7 +16761,7 @@ var useChooseNameModal = () => {
     setAccountModalContent
   } = useModal();
   const open = () => {
-    setAccountModalContent({
+    openAccountModal({
       type: "choose-name",
       props: {
         setCurrentContent: setAccountModalContent,
@@ -16587,7 +16769,6 @@ var useChooseNameModal = () => {
         initialContentSource: "main"
       }
     });
-    openAccountModal();
   };
   const close = () => {
     closeAccountModal();
@@ -16609,13 +16790,12 @@ var useSendTokenModal = () => {
     setAccountModalContent
   } = useModal();
   const open = () => {
-    setAccountModalContent({
+    openAccountModal({
       type: "send-token",
       props: {
         setCurrentContent: setAccountModalContent
       }
     });
-    openAccountModal();
   };
   const close = () => {
     closeAccountModal();
@@ -16630,15 +16810,9 @@ var SendTokenModalProvider = ({
   children
 }) => /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
 var useAccessAndSecurityModal = () => {
-  const {
-    openAccountModal,
-    closeAccountModal,
-    isAccountModalOpen,
-    setAccountModalContent
-  } = useModal();
+  const { openAccountModal, closeAccountModal, isAccountModalOpen } = useModal();
   const open = () => {
-    setAccountModalContent("access-and-security");
-    openAccountModal();
+    openAccountModal("access-and-security");
   };
   const close = () => {
     closeAccountModal();
@@ -16653,15 +16827,9 @@ var AccessAndSecurityModalProvider = ({
   children
 }) => /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
 var useExploreEcosystemModal = () => {
-  const {
-    openAccountModal,
-    closeAccountModal,
-    isAccountModalOpen,
-    setAccountModalContent
-  } = useModal();
+  const { openAccountModal, closeAccountModal, isAccountModalOpen } = useModal();
   const open = () => {
-    setAccountModalContent("ecosystem");
-    openAccountModal();
+    openAccountModal("ecosystem");
   };
   const close = () => {
     closeAccountModal();
@@ -16676,15 +16844,9 @@ var ExploreEcosystemModalProvider = ({
   children
 }) => /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
 var useNotificationsModal = () => {
-  const {
-    openAccountModal,
-    closeAccountModal,
-    isAccountModalOpen,
-    setAccountModalContent
-  } = useModal();
+  const { openAccountModal, closeAccountModal, isAccountModalOpen } = useModal();
   const open = () => {
-    setAccountModalContent("notifications");
-    openAccountModal();
+    openAccountModal("notifications");
   };
   const close = () => {
     closeAccountModal();
@@ -16706,11 +16868,10 @@ var useFAQModal = () => {
     setAccountModalContent
   } = useModal();
   const open = () => {
-    setAccountModalContent({
+    openAccountModal({
       type: "faq",
       props: { onGoBack: () => setAccountModalContent("main") }
     });
-    openAccountModal();
   };
   const close = () => {
     closeAccountModal();
@@ -16723,15 +16884,9 @@ var useFAQModal = () => {
 };
 var FAQModalProvider = ({ children }) => /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
 var useAccountCustomizationModal = () => {
-  const {
-    openAccountModal,
-    closeAccountModal,
-    isAccountModalOpen,
-    setAccountModalContent
-  } = useModal();
+  const { openAccountModal, closeAccountModal, isAccountModalOpen } = useModal();
   const open = () => {
-    setAccountModalContent("account-customization");
-    openAccountModal();
+    openAccountModal("account-customization");
   };
   const close = () => {
     closeAccountModal();
@@ -16746,15 +16901,9 @@ var AccountCustomizationModalProvider = ({
   children
 }) => /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
 var useReceiveModal = () => {
-  const {
-    openAccountModal,
-    closeAccountModal,
-    isAccountModalOpen,
-    setAccountModalContent
-  } = useModal();
+  const { openAccountModal, closeAccountModal, isAccountModalOpen } = useModal();
   const open = () => {
-    setAccountModalContent("receive-token");
-    openAccountModal();
+    openAccountModal("receive-token");
   };
   const close = () => {
     closeAccountModal();
@@ -16835,17 +16984,32 @@ var useLoginModalContent = () => {
     ...baseConfig
   };
 };
-var useUpgradeSmartAccountModal = () => {
+var useUpgradeSmartAccountModal = (style) => {
   const {
     openUpgradeSmartAccountModal: open,
     closeUpgradeSmartAccountModal: close,
     isUpgradeSmartAccountModalOpen: isOpen
   } = useModal();
-  return { open, close, isOpen };
+  return { open: () => open(style), close, isOpen };
 };
 var UpgradeSmartAccountModalProvider = ({
   children
 }) => /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
+var useProfileModal = () => {
+  const { openAccountModal, closeAccountModal, isAccountModalOpen } = useModal();
+  const open = () => {
+    openAccountModal("profile");
+  };
+  const close = () => {
+    closeAccountModal();
+  };
+  return {
+    open,
+    close,
+    isOpen: isAccountModalOpen
+  };
+};
+var ProfileModalProvider = ({ children }) => /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
 var ERC20Interface4 = chunk5GZ7N47F_cjs.ERC20__factory.createInterface();
 var useTransferERC20 = ({
   fromAddress,
@@ -17303,8 +17467,8 @@ var PrivyWalletProvider = ({
         value: valueArray,
         data: dataArray,
         validAfter: 0,
-        validBefore: Math.floor(Date.now() / 1e3) + 60,
-        // e.g. 1 minute from now
+        validBefore: Math.floor(Date.now() / 1e3) + 300,
+        // e.g. 5 minutes from now
         nonce: ethers.ethers.hexlify(ethers.ethers.randomBytes(32))
       }
     };
@@ -17626,11 +17790,20 @@ var useVeChainKitConfig = () => {
 };
 var validateConfig = (props) => {
   const errors = [];
-  if (!props.feeDelegation) {
-    errors.push("feeDelegation configuration is required");
-  } else {
-    if (!props.feeDelegation.delegatorUrl) {
-      errors.push("feeDelegation.delegatorUrl is required");
+  const requiresFeeDelegation = props.privy !== void 0 || props.loginMethods?.some(
+    (method35) => method35.method === "vechain" || method35.method === "ecosystem"
+  );
+  if (requiresFeeDelegation) {
+    if (!props.feeDelegation) {
+      errors.push(
+        "feeDelegation configuration is required when using Privy or vechain login method"
+      );
+    } else {
+      if (!props.feeDelegation || !props.feeDelegation.delegatorUrl) {
+        errors.push(
+          "feeDelegation.delegatorUrl is required when using Privy or vechain login method"
+        );
+      }
     }
   }
   if (!props.network) {
@@ -17745,7 +17918,7 @@ var VeChainKitProvider = (props) => {
               },
               appearance: {
                 theme: darkMode ? "dark" : "light",
-                accentColor: darkMode ? "#3182CE" : "#2B6CB0",
+                accentColor: privy?.appearance.accentColor ?? (darkMode ? "#3182CE" : "#2B6CB0"),
                 loginMessage: privy?.appearance.loginMessage,
                 logo: privy?.appearance.logo
               },
@@ -17796,8 +17969,8 @@ var VeChainKitProvider = (props) => {
                   PrivyWalletProvider,
                   {
                     nodeUrl: network.nodeUrl ?? chunkRUIC653T_cjs.getConfig(network.type).nodeUrl,
-                    delegatorUrl: feeDelegation.delegatorUrl,
-                    delegateAllTransactions: feeDelegation.delegateAllTransactions,
+                    delegatorUrl: feeDelegation?.delegatorUrl ?? "",
+                    delegateAllTransactions: feeDelegation?.delegateAllTransactions ?? false,
                     children: /* @__PURE__ */ jsxRuntime.jsx(ModalProvider, { children })
                   }
                 )
@@ -17875,10 +18048,9 @@ var variants2 = {
   }),
   featureAnnouncement: (props) => definePartsStyle2({
     body: {
-      backgroundColor: props.colorMode === "dark" ? "whiteAlpha.100" : "blackAlpha.50",
+      backgroundColor: props.colorMode === "dark" ? "#ffffff0a" : "blackAlpha.50",
       borderRadius: "12px",
-      border: props.colorMode === "dark" ? "1px solid #2d2d2d" : "1px solid #eaeaea",
-      color: props.colorMode === "dark" ? "whiteAlpha.900" : "gray.800"
+      color: props.colorMode === "dark" ? "#ffffff12" : "blackAlpha.200"
     },
     container: {
       borderRadius: "12px",
@@ -18129,6 +18301,10 @@ Object.defineProperty(exports, "usePrivy", {
   enumerable: true,
   get: function () { return reactAuth.usePrivy; }
 });
+Object.defineProperty(exports, "useSetWalletRecovery", {
+  enumerable: true,
+  get: function () { return reactAuth.useSetWalletRecovery; }
+});
 Object.defineProperty(exports, "DAppKitWalletButton", {
   enumerable: true,
   get: function () { return dappKitReact.WalletButton; }
@@ -18205,6 +18381,7 @@ exports.PrivyButton = PrivyButton;
 exports.PrivyWalletProvider = PrivyWalletProvider;
 exports.ProfileCard = ProfileCard;
 exports.ProfileContent = ProfileContent;
+exports.ProfileModalProvider = ProfileModalProvider;
 exports.QuickActionsSection = QuickActionsSection;
 exports.ReceiveModalProvider = ReceiveModalProvider;
 exports.ReceiveTokenContent = ReceiveTokenContent;
@@ -18492,6 +18669,7 @@ exports.useParticipatedInGovernance = useParticipatedInGovernance;
 exports.useParticipationScoreThreshold = useParticipationScoreThreshold;
 exports.usePassportChecks = usePassportChecks;
 exports.usePrivyWalletProvider = usePrivyWalletProvider;
+exports.useProfileModal = useProfileModal;
 exports.useReceiveModal = useReceiveModal;
 exports.useRefreshBalances = useRefreshBalances;
 exports.useRefreshMetadata = useRefreshMetadata;