thirdweb 5.100.2-nightly-88533d9113dc07c97cfaf0162591477c7056e69b-20250522000412 → 5.100.2

package/src/react/web/ui/ConnectWallet/screens/Buy/fiat/Providers.tsx

@@ -1,14 +1,14 @@
-import {
-  type FiatProvider,
-  FiatProviders,
-} from "../../../../../../../pay/utils/commonTypes.js";
+import type { FiatProvider } from "../../../../../../../pay/utils/commonTypes.js";
 import { Container } from "../../../../components/basic.js";
 import { Button } from "../../../../components/buttons.js";
 import { Link } from "../../../../components/text.js";
+import { getProviderLabel } from "../utils.js";
 /**
  * @internal
  */
+
 export function Providers(props: {
+  supportedProviders: FiatProvider[];
   preferredProvider?: FiatProvider;
   onSelect: (provider: FiatProvider) => void;
 }) {
@@ -21,37 +21,34 @@ export function Providers(props: {
         alignItems: "flex-start",
       }}
     >
-      {FiatProviders.map((provider) => {
-        return (
-          <Container
-            key={provider}
-            flex="row"
-            expand
-            style={{
-              justifyContent: "space-between",
-            }}
+      {props.supportedProviders.map((provider) => (
+        <Container
+          key={provider}
+          flex="row"
+          expand
+          style={{
+            justifyContent: "space-between",
+          }}
+        >
+          <Button
+            fullWidth
+            onClick={() => props.onSelect(provider)}
+            variant={"link"}
           >
-            <Button
-              fullWidth
-              onClick={() => props.onSelect(provider)}
-              variant={"link"}
+            <Link
+              color={
+                props.preferredProvider === provider
+                  ? "primaryText"
+                  : "secondaryText"
+              }
+              size="sm"
+              hoverColor="primaryText"
             >
-              <Link
-                color={
-                  props.preferredProvider === provider
-                    ? "primaryText"
-                    : "secondaryText"
-                }
-                size="sm"
-                hoverColor="primaryText"
-              >
-                {provider.charAt(0).toUpperCase() +
-                  provider.slice(1).toLowerCase()}
-              </Link>
-            </Button>
-          </Container>
-        );
-      })}
+              {getProviderLabel(provider)}
+            </Link>
+          </Button>
+        </Container>
+      ))}
     </Container>
   );
 }

package/src/react/web/ui/ConnectWallet/screens/Buy/swap/SwapScreenContent.tsx

@@ -8,7 +8,6 @@ import { NATIVE_TOKEN_ADDRESS } from "../../../../../../../constants/addresses.j
 import { getContract } from "../../../../../../../contract/contract.js";
 import { allowance } from "../../../../../../../extensions/erc20/__generated__/IERC20/read/allowance.js";
 import type { GetBuyWithCryptoQuoteParams } from "../../../../../../../pay/buyWithCrypto/getQuote.js";
-import { formatNumber } from "../../../../../../../utils/formatNumber.js";
 import type { Account } from "../../../../../../../wallets/interfaces/wallet.js";
 import type { PayUIOptions } from "../../../../../../core/hooks/connection/ConnectButtonProps.js";
 import { useWalletBalance } from "../../../../../../core/hooks/others/useWalletBalance.js";
@@ -55,6 +54,7 @@ export function SwapScreenContent(props: {
   setTokenAmount: (amount: string) => void;
   setHasEditedAmount: (hasEdited: boolean) => void;
   disableTokenSelection: boolean;
+  paymentLinkId: undefined | string;
 }) {
   const {
     setScreen,
@@ -121,6 +121,7 @@ export function SwapScreenContent(props: {
           toAmount: tokenAmount,
           client,
           purchaseData: payOptions.purchaseData,
+          paymentLinkId: props.paymentLinkId,
         }
       : undefined;
 
@@ -286,28 +287,14 @@ export function SwapScreenContent(props: {
         {/* Error message */}
         {errorMsg && (
           <div>
-            {errorMsg.data?.minimumAmountEth ? (
+            <div>
               <Text color="danger" size="xs" center multiline>
-                Minimum amount is{" "}
-                {formatNumber(Number(errorMsg.data.minimumAmountEth), 6)}{" "}
-                <TokenSymbol
-                  token={toToken}
-                  chain={toChain}
-                  size="sm"
-                  inline
-                  color="danger"
-                />
+                {errorMsg.title}
               </Text>
-            ) : (
-              <div>
-                <Text color="danger" size="xs" center multiline>
-                  {errorMsg.title}
-                </Text>
-                <Text size="xs" center multiline>
-                  {errorMsg.message}
-                </Text>
-              </div>
-            )}
+              <Text size="xs" center multiline>
+                {errorMsg.message}
+              </Text>
+            </div>
           </div>
         )}
 
@@ -324,23 +311,7 @@ export function SwapScreenContent(props: {
       </Container>
 
       {/* Button */}
-      {errorMsg?.data?.minimumAmountEth ? (
-        <Button
-          variant="accent"
-          fullWidth
-          onClick={() => {
-            props.setTokenAmount(
-              formatNumber(
-                Number(errorMsg.data?.minimumAmountEth),
-                6,
-              ).toString(),
-            );
-            props.setHasEditedAmount(true);
-          }}
-        >
-          Set Minimum
-        </Button>
-      ) : isNotEnoughBalance || errorMsg ? (
+      {isNotEnoughBalance || errorMsg ? (
         <Button
           variant="accent"
           fullWidth

package/src/react/web/ui/ConnectWallet/screens/Buy/swap/TransferConfirmationScreen.tsx

@@ -52,6 +52,7 @@ type TransferConfirmationScreenProps = {
   transactionMode?: boolean;
   payOptions?: PayUIOptions;
   onSuccess: ((status: BuyWithCryptoStatus) => void) | undefined;
+  paymentLinkId: undefined | string;
 };
 
 export function TransferConfirmationScreen(
@@ -70,6 +71,7 @@ export function TransferConfirmationScreen(
     transactionMode,
     setTransactionHash,
     payOptions,
+    paymentLinkId,
   } = props;
   const [step, setStep] = useState<"approve" | "transfer" | "execute">(
     "transfer",
@@ -105,6 +107,7 @@ export function TransferConfirmationScreen(
           payOptions?.mode === "direct_payment"
             ? payOptions.paymentInfo.feePayer
             : undefined,
+        paymentLinkId: paymentLinkId,
       });
       return transferResponse;
     },

package/src/react/web/ui/ConnectWallet/screens/Buy/swap/TransferFlow.tsx

@@ -23,6 +23,7 @@ type TransferFlowProps = {
   tokenAmount: string;
   transactionMode?: boolean;
   payOptions?: PayUIOptions;
+  paymentLinkId: undefined | string;
 };
 
 export function TransferFlow(props: TransferFlowProps) {

package/src/react/web/ui/ConnectWallet/screens/Buy/swap/useSwapSupportedChains.ts

@@ -36,7 +36,7 @@ async function fetchBuySupportedDestinations({
         originTokenAddress,
         maxSteps: 1,
         sortBy: "popularity",
-        limit: 1000000,
+        limit: 1_000_000,
       });
       const tokens = new Set<string>();
       const chains = new Set<number>();

package/src/react/web/ui/ConnectWallet/screens/Buy/utils.ts

@@ -1,3 +1,12 @@
 export function getBuyTokenAmountFontSize(value: string) {
   return value.length > 10 ? "26px" : value.length > 6 ? "34px" : "50px";
 }
+
+/**
+ *
+ * @param str accepts any string but expects a fully upppercased string / type FiatProvider
+ * @returns Fiat provider label to be rendered used within presentation logic
+ */
+export function getProviderLabel(str: string) {
+  return str.charAt(0).toUpperCase() + str.slice(1).toLowerCase();
+}

package/src/react/web/ui/PayEmbed.tsx

@@ -144,6 +144,11 @@ export type PayEmbedProps = {
   style?: React.CSSProperties;
 
   className?: string;
+
+  /**
+   * @hidden
+   */
+  paymentLinkId?: string;
 };
 
 /**
@@ -365,6 +370,7 @@ export function PayEmbed(props: PayEmbedProps) {
             client={props.client}
             connectLocale={localeQuery.data}
             hiddenWallets={props.hiddenWallets}
+            paymentLinkId={props.paymentLinkId}
             payOptions={
               props.payOptions || {
                 mode: "fund_wallet",

package/src/react/web/utils/errors.ts

@@ -1,17 +1,21 @@
-type ApiError = {
+import { ApiError } from "../../../bridge/types/Errors.js";
+
+type UiError = {
   code: string;
   title: string;
   message: string;
-  data?: {
-    minimumAmountUSDCents?: string;
-    requestedAmountUSDCents?: string;
-    minimumAmountWei?: string;
-    minimumAmountEth?: string;
-  };
 };
 
 // biome-ignore lint/suspicious/noExplicitAny: <explanation>
-export function getErrorMessage(err: any): ApiError {
+export function getErrorMessage(err: any): UiError {
+  if (err instanceof ApiError) {
+    return {
+      code: err.code,
+      title: "Failed to Find Quote",
+      message: getErrorMessageFromBridgeApiError(err),
+    };
+  }
+
   if (typeof err.error === "object" && err.error.code) {
     if (err.error.code === "MINIMUM_PURCHASE_AMOUNT") {
       return {
@@ -29,6 +33,18 @@ export function getErrorMessage(err: any): ApiError {
     code: "UNABLE_TO_GET_PRICE_QUOTE",
     title: "Failed to Find Quote",
     message:
+      err.message ||
       "We couldn't get a quote for this token pair. Select another token or pay with card.",
   };
 }
+
+function getErrorMessageFromBridgeApiError(err: ApiError) {
+  let msg = err.message;
+  if (msg.includes("Details")) {
+    msg = msg.substring(0, msg.indexOf("Details"));
+  }
+  if (msg.includes("{")) {
+    msg = msg.substring(0, msg.indexOf("{"));
+  }
+  return msg;
+}

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

@@ -21,19 +21,26 @@ export function getCountrySelector(countryIsoCode: SupportedSmsCountry) {
 export function CountrySelector({
   countryCode,
   setCountryCode,
+  allowedCountryCodes,
 }: {
   countryCode: string;
   setCountryCode: React.Dispatch<React.SetStateAction<string>>;
+  allowedCountryCodes?: SupportedSmsCountry[];
 }) {
   const selectRef = useRef<HTMLSelectElement>(null);
 
-  const supportedCountriesForSms = supportedSmsCountries ?? [
-    {
-      countryIsoCode: "US",
-      countryName: "United States",
-      phoneNumberCode: 1,
-    },
-  ];
+  const supportedCountriesForSms =
+    allowedCountryCodes && allowedCountryCodes.length > 0
+      ? supportedSmsCountries.filter((c) =>
+          allowedCountryCodes.includes(c.countryIsoCode as SupportedSmsCountry),
+        )
+      : (supportedSmsCountries ?? [
+          {
+            countryIsoCode: "US",
+            countryName: "United States",
+            phoneNumberCode: 1,
+          },
+        ]);
 
   return (
     <>

package/src/react/web/wallets/in-app/InputSelectionUI.test.tsx

@@ -42,4 +42,27 @@ describe("InputSelectionUI", () => {
 
     expect(screen.getByRole("combobox")).toHaveValue("US +1");
   });
+
+  it("should filter countries based on allowedSmsCountryCodes", () => {
+    const mockGetCountrySelector = vi.mocked(getCountrySelector);
+    mockGetCountrySelector.mockReturnValue("IN +91");
+
+    render(
+      <InputSelectionUI
+        onSelect={vi.fn()}
+        placeholder=""
+        name=""
+        type=""
+        submitButtonText=""
+        format="phone"
+        allowedSmsCountryCodes={["IN", "BR"]}
+      />,
+    );
+
+    const options = screen.getAllByRole("option");
+    const optionTexts = options.map((o) => o.textContent);
+    expect(optionTexts.some((t) => t?.includes("India"))).toBe(true);
+    expect(optionTexts.some((t) => t?.includes("Brazil"))).toBe(true);
+    expect(optionTexts.some((t) => t?.includes("United States"))).toBe(false);
+  });
 });

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

@@ -24,11 +24,16 @@ export function InputSelectionUI(props: {
   format?: "phone";
   disabled?: boolean;
   defaultSmsCountryCode?: SupportedSmsCountry;
+  allowedSmsCountryCodes?: SupportedSmsCountry[];
 }) {
   const [countryCodeInfo, setCountryCodeInfo] = useState(
     props.defaultSmsCountryCode
       ? getCountrySelector(props.defaultSmsCountryCode)
-      : "US +1",
+      : props.allowedSmsCountryCodes &&
+          props.allowedSmsCountryCodes.length > 0 &&
+          props.allowedSmsCountryCodes[0]
+        ? getCountrySelector(props.allowedSmsCountryCodes[0])
+        : "US +1",
   );
   const [input, setInput] = useState("");
   const [error, setError] = useState<string | undefined>();
@@ -69,6 +74,7 @@ export function InputSelectionUI(props: {
           <CountrySelector
             countryCode={countryCodeInfo}
             setCountryCode={setCountryCodeInfo}
+            allowedCountryCodes={props.allowedSmsCountryCodes}
           />
         )}
         <Input

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

@@ -451,6 +451,9 @@ export const ConnectWalletSocialOptions = (
             defaultSmsCountryCode={
               wallet.getConfig()?.auth?.defaultSmsCountryCode
             }
+            allowedSmsCountryCodes={
+              wallet.getConfig()?.auth?.allowedSmsCountryCodes
+            }
           />
         ) : (
           <WalletTypeRowButton

package/src/utils/bytecode/resolveImplementation.ts

@@ -18,7 +18,7 @@ const ZERO_BYTES32 =
  * @returns A promise that resolves to an object containing the implementation address and bytecode.
  * @example
  * ```ts
- * import { resolveImplementation } from "thirdweb";
+ * import { resolveImplementation } from "thirdweb/utils";
  * const implementation = await resolveImplementation(contract);
  * ```
  * @contract

package/src/utils/ens/avatar.ts

@@ -74,7 +74,7 @@ async function isImageUri(options: ParseAvatarOptions): Promise<boolean> {
       return false;
     }
     // fail in NodeJS, since the error is not cors but any other network issue
-    if (Object.hasOwn(globalThis, "Image")) {
+    if (!Object.hasOwn(globalThis, "Image")) {
       return false;
     }
     // in case of cors, use image api to validate if given url is an actual image

package/src/version.ts

@@ -1 +1 @@
-export const version = "5.100.2-nightly-88533d9113dc07c97cfaf0162591477c7056e69b-20250522000412";
+export const version = "5.100.2";

package/src/wallets/ecosystem/types.ts

@@ -19,6 +19,11 @@ export type EcosystemWalletCreationOptions = {
      * The default country code to use for SMS authentication
      */
     defaultSmsCountryCode?: SupportedSmsCountry;
+
+    /**
+     * The list of allowed country codes to display in the country selector
+     */
+    allowedSmsCountryCodes?: SupportedSmsCountry[];
   };
   /**
    * The partnerId of the ecosystem wallet to connect to

package/src/wallets/in-app/core/interfaces/connector.ts

@@ -1,5 +1,6 @@
 import type { SocialAuthOption } from "../../../../wallets/types.js";
 import type { Account } from "../../../interfaces/wallet.js";
+import type { ClientScopedStorage } from "../authentication/client-scoped-storage.js";
 import type {
   AuthArgsType,
   AuthLoginReturnType,
@@ -38,4 +39,5 @@ export interface InAppConnector {
   linkProfile(args: AuthArgsType): Promise<Profile[]>;
   unlinkProfile(args: Profile): Promise<Profile[]>;
   getProfiles(): Promise<Profile[]>;
+  storage: ClientScopedStorage;
 }

package/src/wallets/in-app/core/wallet/in-app-core.ts

@@ -55,9 +55,11 @@ export function createInAppWallet(args: {
   let adminAccount: Account | undefined = undefined; // Admin account if smartAccountOptions were provided with connection
   let chain: Chain | undefined = undefined;
   let client: ThirdwebClient | undefined;
+  let authToken: string | null = null;
 
   return {
     id: walletId,
+    getAuthToken: () => authToken,
     subscribe: emitter.subscribe,
     getChain() {
       if (!chain) {
@@ -114,6 +116,12 @@ export function createInAppWallet(args: {
       account = connectedAccount;
       adminAccount = _adminAccount;
       chain = connectedChain;
+      try {
+        authToken = await connector.storage.getAuthCookie();
+      } catch (error) {
+        console.error("Failed to retrieve auth token:", error);
+        authToken = null;
+      }
       trackConnect({
         client: options.client,
         ecosystem,
@@ -168,6 +176,12 @@ export function createInAppWallet(args: {
       account = connectedAccount;
       adminAccount = _adminAccount;
       chain = connectedChain;
+      try {
+        authToken = await connector.storage.getAuthCookie();
+      } catch (error) {
+        console.error("Failed to retrieve auth token:", error);
+        authToken = null;
+      }
       trackConnect({
         client: options.client,
         ecosystem,
@@ -194,6 +208,7 @@ export function createInAppWallet(args: {
       account = undefined;
       adminAccount = undefined;
       chain = undefined;
+      authToken = null;
       emitter.emit("disconnect", undefined);
     },
     switchChain: async (newChain) => {

package/src/wallets/in-app/core/wallet/types.ts

@@ -83,6 +83,11 @@ export type InAppWalletCreationOptions =
          * The default country code to use for SMS authentication
          */
         defaultSmsCountryCode?: SupportedSmsCountry;
+
+        /**
+         * The list of allowed country codes to display in the country selector
+         */
+        allowedSmsCountryCodes?: SupportedSmsCountry[];
       };
       /**
        * Metadata to display in the Connect Modal

package/src/wallets/in-app/native/native-connector.ts

@@ -29,7 +29,7 @@ type NativeConnectorOptions = {
 export class InAppNativeConnector implements InAppConnector {
   private client: ThirdwebClient;
   private ecosystem?: Ecosystem;
-  private storage: ClientScopedStorage;
+  public storage: ClientScopedStorage;
   private passkeyDomain?: string;
   private wallet?: IWebWallet;
 

package/src/wallets/in-app/web/lib/web-connector.ts

@@ -50,7 +50,7 @@ export class InAppWebConnector implements InAppConnector {
   private client: ThirdwebClient;
   private ecosystem?: Ecosystem;
   private querier: InAppWalletIframeCommunicator<AuthQuerierTypes>;
-  private storage: ClientScopedStorage;
+  public storage: ClientScopedStorage;
 
   private wallet?: IWebWallet;
   /**

package/src/wallets/interfaces/wallet.ts

@@ -151,8 +151,18 @@ export type Wallet<TWalletId extends WalletId = WalletId> = {
    * This is useful for smart wallets to get the underlying personal account
    */
   getAdminAccount?: () => Account | undefined;
-};
 
+  /**
+   * Get the authentication token for the wallet.
+   *
+   * This method is not available for on all wallets. This method will be `undefined` if the wallet does not support it.
+   * @example
+   * ```ts
+   * const authToken = await wallet.getAuthToken();
+   * ```
+   */
+  getAuthToken?: () => string | null;
+};
 /**
  * Account interface
  *