thirdweb 5.64.0-nightly-e6e994479fb8386b1740de4170f33446f038f2b1-20241024000332 → 5.64.1

package/src/react/web/ui/ConnectWallet/WalletTypeRowButton.tsx

@@ -1,19 +1,15 @@
 import type { ThirdwebClient } from "../../../../client/client.js";
-import {
-  iconSize,
-  radius,
-  spacing,
-} from "../../../core/design-system/index.js";
+import { iconSize, spacing } from "../../../core/design-system/index.js";
 import { Text } from "../../ui/components/text.js";
-import { Img } from "../components/Img.js";
 import { Container } from "../components/basic.js";
 import { Button } from "../components/buttons.js";
+import type { IconFC } from "./icons/types.js";
 
 type WalletTypeRowProps = {
   client: ThirdwebClient;
   onClick: () => void;
   title: string;
-  icon: string;
+  icon: IconFC;
   disabled?: boolean;
 };
 
@@ -33,16 +29,7 @@ export function WalletTypeRowButton(props: WalletTypeRowProps) {
       disabled={props.disabled}
     >
       <Container flex="row" gap="sm" center="y" color="accentText">
-        <Img
-          client={props.client}
-          src={props.icon}
-          width={iconSize.md}
-          height={iconSize.md}
-          loading="eager"
-          style={{
-            borderRadius: radius.md,
-          }}
-        />
+        <props.icon size={iconSize.md} />
         <Text color="primaryText">{props.title}</Text>
       </Container>
     </Button>

package/src/react/web/ui/ConnectWallet/icons/EmailIcon.tsx

@@ -0,0 +1,30 @@
+import type { IconFC } from "./types.js";
+
+/**
+ * @internal
+ */
+export const EmailIcon: IconFC = (props) => {
+  return (
+    <svg
+      width={props.size}
+      height={props.size}
+      viewBox="0 0 16 16"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      role="presentation"
+    >
+      <path
+        d="M13.3335 2.6665H2.66683C1.93045 2.6665 1.3335 3.26346 1.3335 3.99984V11.9998C1.3335 12.7362 1.93045 13.3332 2.66683 13.3332H13.3335C14.0699 13.3332 14.6668 12.7362 14.6668 11.9998V3.99984C14.6668 3.26346 14.0699 2.6665 13.3335 2.6665Z"
+        stroke={props.color ?? "currentColor"}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M14.6668 4.6665L8.68683 8.4665C8.48101 8.59545 8.24304 8.66384 8.00016 8.66384C7.75728 8.66384 7.51931 8.59545 7.3135 8.4665L1.3335 4.6665"
+        stroke={props.color ?? "currentColor"}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+};

package/src/react/web/ui/ConnectWallet/icons/FingerPrintIcon.tsx

@@ -11,63 +11,63 @@ export const FingerPrintIcon: IconFC = (props) => {
     >
       <path
         d="M18.0001 15C17.2045 15 16.4414 15.3161 15.8788 15.8787C15.3162 16.4413 15.0001 17.2044 15.0001 18C15.0001 19.53 14.8501 21.765 14.6101 24"
-        stroke="currentColor"
+        stroke={props.color ?? "currentColor"}
         strokeWidth="3"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
       <path
         d="M21.0002 19.6801C21.0002 23.2501 21.0002 29.2501 19.5002 33.0001"
-        stroke="currentColor"
+        stroke={props.color ?? "currentColor"}
         strokeWidth="3"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
       <path
         d="M25.9348 31.53C26.1148 30.63 26.5798 28.08 26.6848 27"
-        stroke="currentColor"
+        stroke={props.color ?? "currentColor"}
         strokeWidth="3"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
       <path
         d="M2.99976 18C2.99976 14.8518 3.99032 11.7833 5.83112 9.22935C7.67193 6.67536 10.2697 4.76531 13.2563 3.76975C16.243 2.77419 19.4672 2.74359 22.4723 3.6823C25.4773 4.621 28.1108 6.48141 29.9998 9"
-        stroke="currentColor"
+        stroke={props.color ?? "currentColor"}
         strokeWidth="3"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
       <path
         d="M2.99976 24H3.01628"
-        stroke="currentColor"
+        stroke={props.color ?? "currentColor"}
         strokeWidth="3"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
       <path
         d="M32.7 24C33 21 32.8965 15.969 32.7 15"
-        stroke="currentColor"
+        stroke={props.color ?? "currentColor"}
         strokeWidth="3"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
       <path
         d="M7.49976 29.25C8.24976 27 8.99976 22.5 8.99976 18C8.99824 16.9783 9.17071 15.9638 9.50976 15"
-        stroke="currentColor"
+        stroke={props.color ?? "currentColor"}
         strokeWidth="3"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
       <path
         d="M12.9751 33C13.2901 32.01 13.6501 31.02 13.8301 30"
-        stroke="currentColor"
+        stroke={props.color ?? "currentColor"}
         strokeWidth="3"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
       <path
         d="M13.5 10.2C14.8686 9.40988 16.4211 8.99401 18.0014 8.99426C19.5818 8.99452 21.1342 9.41088 22.5025 10.2015C23.8708 10.9921 25.0069 12.129 25.7964 13.498C26.5859 14.867 27.001 16.4197 27 18V21"
-        stroke="currentColor"
+        stroke={props.color ?? "currentColor"}
         strokeWidth="3"
         strokeLinecap="round"
         strokeLinejoin="round"

package/src/react/web/ui/ConnectWallet/icons/GuestIcon.tsx

@@ -0,0 +1,24 @@
+import type { IconFC } from "./types.js";
+
+/**
+ * @internal
+ */
+export const GuestIcon: IconFC = (props) => {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width={props.size}
+      height={props.size}
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke={props.color ?? "currentColor"}
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      role="presentation"
+    >
+      <path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" />
+      <circle cx="12" cy="7" r="4" />
+    </svg>
+  );
+};

package/src/react/web/ui/ConnectWallet/icons/OutlineWalletIcon.tsx

@@ -15,14 +15,14 @@ export const OutlineWalletIcon: IconFC = (props) => {
     >
       <path
         d="M19 7V4C19 3.73478 18.8946 3.48043 18.7071 3.29289C18.5196 3.10536 18.2652 3 18 3H5C4.46957 3 3.96086 3.21071 3.58579 3.58579C3.21071 3.96086 3 4.46957 3 5C3 5.53043 3.21071 6.03914 3.58579 6.41421C3.96086 6.78929 4.46957 7 5 7H20C20.2652 7 20.5196 7.10536 20.7071 7.29289C20.8946 7.48043 21 7.73478 21 8V12M21 12H18C17.4696 12 16.9609 12.2107 16.5858 12.5858C16.2107 12.9609 16 13.4696 16 14C16 14.5304 16.2107 15.0391 16.5858 15.4142C16.9609 15.7893 17.4696 16 18 16H21C21.2652 16 21.5196 15.8946 21.7071 15.7071C21.8946 15.5196 22 15.2652 22 15V13C22 12.7348 21.8946 12.4804 21.7071 12.2929C21.5196 12.1054 21.2652 12 21 12Z"
-        stroke="currentColor"
+        stroke={props.color ?? "currentColor"}
         strokeWidth="1.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
       <path
         d="M3 5V19C3 19.5304 3.21071 20.0391 3.58579 20.4142C3.96086 20.7893 4.46957 21 5 21H20C20.2652 21 20.5196 20.8946 20.7071 20.7071C20.8946 20.5196 21 20.2652 21 20V16"
-        stroke="currentColor"
+        stroke={props.color ?? "currentColor"}
         strokeWidth="1.5"
         strokeLinecap="round"
         strokeLinejoin="round"

package/src/react/web/ui/ConnectWallet/icons/PhoneIcon.tsx

@@ -0,0 +1,32 @@
+import type { IconFC } from "./types.js";
+
+/**
+ * @internal
+ */
+export const PhoneIcon: IconFC = (props) => {
+  return (
+    <svg
+      width={props.size}
+      height={props.size}
+      viewBox="0 0 16 16"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      role="presentation"
+    >
+      <g clipPath="url(#clip0_5639_632)">
+        <path
+          d="M14.6669 11.2802V13.2802C14.6677 13.4659 14.6297 13.6497 14.5553 13.8198C14.4809 13.9899 14.3718 14.1426 14.235 14.2681C14.0982 14.3937 13.9367 14.4892 13.7608 14.5487C13.5849 14.6082 13.3985 14.6303 13.2136 14.6136C11.1622 14.3907 9.19161 13.6897 7.46028 12.5669C5.8495 11.5433 4.48384 10.1777 3.46028 8.56689C2.3336 6.8277 1.63244 4.84756 1.41361 2.78689C1.39695 2.60254 1.41886 2.41673 1.47795 2.24131C1.53703 2.06589 1.63199 1.90469 1.75679 1.76797C1.88159 1.63126 2.03348 1.52203 2.20281 1.44724C2.37213 1.37245 2.55517 1.33374 2.74028 1.33356H4.74028C5.06382 1.33038 5.37748 1.44495 5.62279 1.65592C5.8681 1.86689 6.02833 2.15986 6.07361 2.48023C6.15803 3.12027 6.31458 3.74871 6.54028 4.35356C6.62998 4.59218 6.64939 4.8515 6.59622 5.10081C6.54305 5.35012 6.41952 5.57897 6.24028 5.76023L5.39361 6.60689C6.34265 8.27592 7.72458 9.65786 9.39361 10.6069L10.2403 9.76023C10.4215 9.58099 10.6504 9.45746 10.8997 9.40429C11.149 9.35112 11.4083 9.37053 11.6469 9.46023C12.2518 9.68593 12.8802 9.84248 13.5203 9.92689C13.8441 9.97258 14.1399 10.1357 14.3513 10.3852C14.5627 10.6348 14.6751 10.9533 14.6669 11.2802Z"
+          stroke={props.color ?? "currentColor"}
+          strokeWidth="1.33333"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_5639_632">
+          <rect width="16" height="16" fill="white" />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+};

package/src/react/web/ui/ConnectWallet/icons/types.ts

@@ -1 +1 @@
-export type IconFC = React.FC<{ size: string }>;
+export type IconFC = React.FC<{ size: string; color?: string }>;

package/src/react/web/ui/ConnectWallet/screens/LinkedProfilesScreen.tsx

@@ -14,6 +14,9 @@ import { Text } from "../../components/text.js";
 import { Blobbie } from "../Blobbie.js";
 import { MenuButton } from "../MenuButton.js";
 import { AddUserIcon } from "../icons/AddUserIcon.js";
+import { EmailIcon } from "../icons/EmailIcon.js";
+import { FingerPrintIcon } from "../icons/FingerPrintIcon.js";
+import { PhoneIcon } from "../icons/PhoneIcon.js";
 import type { ConnectLocale } from "../locale/types.js";
 import type { WalletDetailsModalScreen } from "./types.js";
 
@@ -84,7 +87,7 @@ export function LinkedProfilesScreen(props: {
                 fontSize: fontSize.sm,
               }}
             >
-              <AddUserIcon size={iconSize.md} />
+              <AddUserIcon size={iconSize.lg} />
               <Text color="primaryText">
                 {props.locale.manageWallet.linkProfile}
               </Text>
@@ -147,6 +150,12 @@ function LinkedProfile({
         >
           <Blobbie address={profile.details.address} size={32} />
         </Container>
+      ) : profile.type === "passkey" ? (
+        <FingerPrintIcon size={iconSize.lg} />
+      ) : profile.type === "email" ? (
+        <EmailIcon size={iconSize.lg} />
+      ) : profile.type === "phone" ? (
+        <PhoneIcon size={iconSize.lg} />
       ) : (
         <Img
           src={getSocialIcon(profile.type)}

package/src/react/web/ui/components/WalletImage.tsx

@@ -4,7 +4,9 @@ import type { ThirdwebClient } from "../../../../client/client.js";
 import { webLocalStorage } from "../../../../utils/storage/webStorage.js";
 import { getWalletInfo } from "../../../../wallets/__generated__/getWalletInfo.js";
 import { getInstalledWalletProviders } from "../../../../wallets/injected/mipdStore.js";
+import type { AuthOption } from "../../../../wallets/types.js";
 import type { WalletId } from "../../../../wallets/wallet-types.js";
+import { useCustomTheme } from "../../../core/design-system/CustomThemeProvider.js";
 import { radius } from "../../../core/design-system/index.js";
 import { useActiveWallet } from "../../../core/hooks/wallets/useActiveWallet.js";
 import { getLastAuthProvider } from "../../../core/utils/storage.js";
@@ -13,8 +15,15 @@ import {
   genericWalletIcon,
   getSocialIcon,
 } from "../../../core/utils/walletIcon.js";
+import { EmailIcon } from "../ConnectWallet/icons/EmailIcon.js";
+import { FingerPrintIcon } from "../ConnectWallet/icons/FingerPrintIcon.js";
+import { GuestIcon } from "../ConnectWallet/icons/GuestIcon.js";
+import { OutlineWalletIcon } from "../ConnectWallet/icons/OutlineWalletIcon.js";
+import { PhoneIcon } from "../ConnectWallet/icons/PhoneIcon.js";
 import { Img } from "./Img.js";
 
+type WalletImageState = { uri: string; authProvider?: AuthOption };
+
 /**
  * @internal
  */
@@ -24,7 +33,8 @@ export function WalletImage(props: {
   client: ThirdwebClient;
   style?: React.CSSProperties;
 }) {
-  const [image, setImage] = useState<string | undefined>(undefined);
+  const theme = useCustomTheme();
+  const [image, setImage] = useState<WalletImageState | undefined>(undefined);
   const activeWallet = useActiveWallet();
   useEffect(() => {
     async function fetchImage() {
@@ -33,7 +43,7 @@ export function WalletImage(props: {
       // show the admin EOA icon for smart
       const storage = webLocalStorage;
       const activeEOAId = props.id;
-      let image: string | undefined;
+      let image: WalletImageState | undefined;
 
       if (
         activeEOAId === "inApp" &&
@@ -43,17 +53,22 @@ export function WalletImage(props: {
         // when showing an active wallet icon - check last auth provider and override the IAW icon
         const lastAuthProvider = await getLastAuthProvider(storage);
         image = lastAuthProvider
-          ? getSocialIcon(lastAuthProvider)
-          : genericWalletIcon;
+          ? {
+              uri: getSocialIcon(lastAuthProvider),
+              authProvider: lastAuthProvider as AuthOption,
+            }
+          : { uri: "", authProvider: "wallet" };
       } else {
         const mipdImage = getInstalledWalletProviders().find(
           (x) => x.info.rdns === activeEOAId,
         )?.info.icon;
 
         if (mipdImage) {
-          image = mipdImage;
+          image = { uri: mipdImage };
         } else {
-          image = await getWalletInfo(activeEOAId, true);
+          image = {
+            uri: await getWalletInfo(activeEOAId, true),
+          };
         }
       }
 
@@ -62,10 +77,34 @@ export function WalletImage(props: {
     fetchImage();
   }, [props.id, activeWallet]);
 
-  if (image) {
+  if (image?.authProvider === "email") {
+    return <EmailIcon size={props.size} color={theme.colors.accentText} />;
+  }
+
+  if (image?.authProvider === "phone") {
+    return <PhoneIcon size={props.size} color={theme.colors.accentText} />;
+  }
+
+  if (image?.authProvider === "passkey") {
+    return (
+      <FingerPrintIcon size={props.size} color={theme.colors.accentText} />
+    );
+  }
+
+  if (image?.authProvider === "wallet") {
+    return (
+      <OutlineWalletIcon size={props.size} color={theme.colors.accentText} />
+    );
+  }
+
+  if (image?.authProvider === "guest") {
+    return <GuestIcon size={props.size} color={theme.colors.accentText} />;
+  }
+
+  if (image?.uri) {
     return (
       <Img
-        src={image}
+        src={image.uri}
         width={props.size}
         height={props.size}
         loading="eager"
@@ -101,17 +140,5 @@ function WalletImageQuery(props: {
     );
   }
 
-  return (
-    <Img
-      client={props.client}
-      src={walletImage.isLoading ? undefined : walletImage.data}
-      fallbackImage={genericWalletIcon}
-      width={props.size}
-      height={props.size}
-      loading="eager"
-      style={{
-        borderRadius: radius.md,
-      }}
-    />
-  );
+  return <OutlineWalletIcon size={props.size} />;
 }

package/src/react/web/wallets/ecosystem/EcosystemWalletConnectUI.tsx

@@ -129,6 +129,7 @@ function EcosystemWalletConnectUI(props: {
         done={done}
         onBack={goBackToMain || (() => setSelectionData({}))}
         locale={props.connectLocale}
+        isLinking={state.walletLogin.linking}
       />
     );
   }

package/src/react/web/wallets/in-app/InAppWalletConnectUI.tsx

@@ -116,6 +116,7 @@ function InAppWalletConnectUI(props: {
         done={done}
         onBack={goBackToMain || (() => setSelectionData({}))}
         locale={props.connectLocale}
+        isLinking={state.walletLogin.linking}
       />
     );
   }

package/src/react/web/wallets/in-app/WalletAuth.tsx

@@ -28,6 +28,7 @@ export function WalletAuth(props: {
   inAppLocale: InAppWalletLocale;
   onBack: () => void;
   walletConnect: { projectId?: string } | undefined;
+  isLinking: boolean;
   meta?: {
     title?: string;
     titleIconUrl?: string;
@@ -61,16 +62,25 @@ export function WalletAuth(props: {
     setStatus("loading");
     walletToConnect.current = walletToLink;
     try {
-      await linkProfile({
-        client: props.client,
-        strategy: "wallet",
-        wallet: walletToLink,
-        chain: wallet.getChain() || defineChain(1),
-        ecosystem,
-      }).catch((e) => {
-        setError(e.message);
-        throw e;
-      });
+      if (props.isLinking) {
+        await linkProfile({
+          client: props.client,
+          strategy: "wallet",
+          wallet: walletToLink,
+          chain: wallet.getChain() || defineChain(1),
+          ecosystem,
+        }).catch((e) => {
+          setError(e.message);
+          throw e;
+        });
+      } else {
+        await wallet.connect({
+          client: props.client,
+          strategy: "wallet",
+          wallet: walletToLink,
+          chain: walletToLink.getChain() || defineChain(1),
+        });
+      }
       addConnectedWallet(walletToLink);
       done();
     } catch {
@@ -121,7 +131,12 @@ export function WalletAuth(props: {
         size={props.size}
         meta={props.meta || {}}
         walletConnect={props.walletConnect}
-        modalHeader={{ title: props.inAppLocale.linkWallet, onBack: back }}
+        modalHeader={{
+          title: props.isLinking
+            ? props.inAppLocale.linkWallet
+            : props.inAppLocale.signInWithWallet,
+          onBack: back,
+        }}
         walletIdsToHide={["inApp"]}
         disableSelectionDataReset={true}
       />
@@ -131,7 +146,14 @@ export function WalletAuth(props: {
   return (
     <Container animate="fadein" fullHeight flex="column">
       <Container p="lg">
-        <ModalHeader title={props.inAppLocale.linkWallet} onBack={back} />
+        <ModalHeader
+          title={
+            props.isLinking
+              ? props.inAppLocale.linkWallet
+              : props.inAppLocale.signInWithWallet
+          }
+          onBack={back}
+        />
       </Container>
 
       <Container

package/src/react/web/wallets/shared/ConnectWalletSocialOptions.tsx

@@ -24,15 +24,14 @@ import {
   spacing,
 } from "../../../core/design-system/index.js";
 import { setLastAuthProvider } from "../../../core/utils/storage.js";
-import {
-  emailIcon,
-  getSocialIcon,
-  passkeyIcon,
-  phoneIcon,
-  socialIcons,
-} from "../../../core/utils/walletIcon.js";
+import { socialIcons } from "../../../core/utils/walletIcon.js";
 import { useSetSelectionData } from "../../providers/wallet-ui-states-provider.js";
 import { WalletTypeRowButton } from "../../ui/ConnectWallet/WalletTypeRowButton.js";
+import { EmailIcon } from "../../ui/ConnectWallet/icons/EmailIcon.js";
+import { FingerPrintIcon } from "../../ui/ConnectWallet/icons/FingerPrintIcon.js";
+import { GuestIcon } from "../../ui/ConnectWallet/icons/GuestIcon.js";
+import { OutlineWalletIcon } from "../../ui/ConnectWallet/icons/OutlineWalletIcon.js";
+import { PhoneIcon } from "../../ui/ConnectWallet/icons/PhoneIcon.js";
 import { Img } from "../../ui/components/Img.js";
 import { Spacer } from "../../ui/components/Spacer.js";
 import { TextDivider } from "../../ui/components/TextDivider.js";
@@ -57,7 +56,9 @@ export type ConnectWalletSelectUIState =
         connectionPromise: Promise<Account | Profile[]>;
       };
       passkeyLogin?: boolean;
-      walletLogin?: boolean;
+      walletLogin?: {
+        linking: boolean;
+      };
     };
 
 const defaultAuthOptions: AuthOption[] = [
@@ -186,6 +187,7 @@ export const ConnectWalletSocialOptions = (
 
   const passKeyEnabled = authOptions.includes("passkey");
   const guestEnabled = authOptions.includes("guest");
+  const siweEnabled = authOptions.includes("wallet");
 
   const placeholder =
     inputMode === "email" ? locale.emailPlaceholder : locale.phonePlaceholder;
@@ -306,7 +308,9 @@ export const ConnectWalletSocialOptions = (
 
   function handleWalletLogin() {
     setData({
-      walletLogin: true,
+      walletLogin: {
+        linking: props.isLinking || false,
+      },
     });
     props.select();
   }
@@ -408,7 +412,7 @@ export const ConnectWalletSocialOptions = (
         ) : (
           <WalletTypeRowButton
             client={props.client}
-            icon={emailIcon}
+            icon={EmailIcon}
             onClick={() => {
               setManualInputMode("email");
             }}
@@ -446,7 +450,7 @@ export const ConnectWalletSocialOptions = (
         ) : (
           <WalletTypeRowButton
             client={props.client}
-            icon={phoneIcon}
+            icon={PhoneIcon}
             onClick={() => {
               setManualInputMode("phone");
             }}
@@ -458,7 +462,7 @@ export const ConnectWalletSocialOptions = (
       {passKeyEnabled && (
         <WalletTypeRowButton
           client={props.client}
-          icon={passkeyIcon}
+          icon={FingerPrintIcon}
           onClick={() => {
             handlePassKeyLogin();
           }}
@@ -467,11 +471,23 @@ export const ConnectWalletSocialOptions = (
         />
       )}
 
+      {/* SIWE login */}
+      {siweEnabled && (
+        <WalletTypeRowButton
+          client={props.client}
+          icon={OutlineWalletIcon}
+          onClick={() => {
+            handleWalletLogin();
+          }}
+          title={locale.signInWithWallet}
+        />
+      )}
+
       {/* Guest login */}
       {guestEnabled && (
         <WalletTypeRowButton
           client={props.client}
-          icon={getSocialIcon("guest")}
+          icon={GuestIcon}
           onClick={() => {
             handleGuestLogin();
           }}
@@ -483,7 +499,7 @@ export const ConnectWalletSocialOptions = (
       {props.isLinking && (
         <WalletTypeRowButton
           client={props.client}
-          icon={getSocialIcon("")}
+          icon={OutlineWalletIcon}
           onClick={() => {
             handleWalletLogin();
           }}

package/src/react/web/wallets/shared/locale/de.ts

@@ -58,4 +58,5 @@ export default {
   passkey: "Passkey",
   linkWallet: "Verknüpfen Sie eine Brieftasche",
   loginAsGuest: "Melden Sie sich als Gast an",
+  signInWithWallet: "Mit Wallet anmelden",
 } satisfies InAppWalletLocale;

package/src/react/web/wallets/shared/locale/en.ts

@@ -55,6 +55,7 @@ export default {
   signInWithPhone: "Sign in with phone number",
   phoneRequired: "Phone number is required",
   passkey: "Passkey",
+  signInWithWallet: "Sign in with Wallet",
   linkWallet: "Link a Wallet",
   loginAsGuest: "Continue as guest",
 } satisfies InAppWalletLocale;

package/src/react/web/wallets/shared/locale/es.ts

@@ -57,4 +57,5 @@ export default {
   passkey: "Clave de acceso",
   linkWallet: "Vincular una billetera",
   loginAsGuest: "Inicia sesión como invitado",
+  signInWithWallet: "Iniciar sesión con billetera",
 } satisfies InAppWalletLocale;

package/src/react/web/wallets/shared/locale/fr.ts

@@ -58,4 +58,5 @@ export default {
   passkey: "Passkey",
   linkWallet: "Lier un portefeuille",
   loginAsGuest: "Connectez-vous en tant qu'invité",
+  signInWithWallet: "Se connecter avec portefeuille",
 } satisfies InAppWalletLocale;

package/src/react/web/wallets/shared/locale/ja.ts

@@ -56,4 +56,5 @@ export default {
   passkey: "パスキー",
   linkWallet: "ウォレットをリンクする",
   loginAsGuest: "ゲストとしてログイン",
+  signInWithWallet: "ウォレットでログイン",
 } satisfies InAppWalletLocale;

package/src/react/web/wallets/shared/locale/kr.ts

@@ -54,4 +54,5 @@ export default {
   passkey: "비밀번호",
   linkWallet: "지갑 연결",
   loginAsGuest: "게스트로 로그인",
+  signInWithWallet: "지갑으로 로그인",
 } satisfies InAppWalletLocale;

package/src/react/web/wallets/shared/locale/tl.ts

@@ -57,4 +57,5 @@ export default {
   passkey: "Passkey",
   linkWallet: "Mag-link ng Wallet",
   loginAsGuest: "Mag-login bilang bisita",
+  signInWithWallet: "Mag-login gamit ang Wallet",
 } satisfies InAppWalletLocale;

package/src/react/web/wallets/shared/locale/types.ts

@@ -41,6 +41,7 @@ export type InAppWalletLocale = {
   signInWithApple: string;
   signInWithFacebook: string;
   signInWithGoogle: string;
+  signInWithWallet: string;
   socialLoginScreen: {
     failed: string;
     instruction: string;

package/src/react/web/wallets/shared/locale/vi.ts

@@ -57,4 +57,5 @@ export default {
   passkey: "Passkey",
   linkWallet: "Link a Wallet",
   loginAsGuest: "Đăng nhập với tư cách khách",
+  signInWithWallet: "Đăng nhập bằng Wallet",
 } satisfies InAppWalletLocale;

package/src/version.ts

@@ -1 +1 @@
-export const version = "5.64.0-nightly-e6e994479fb8386b1740de4170f33446f038f2b1-20241024000332";
+export const version = "5.64.1";