thirdweb 5.105.49-nightly-04862de9e4e11724720fa40a0ed4713ff2bfdad5-20250917000323 → 5.106.1

package/dist/types/wallets/manager/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/wallets/manager/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAEnD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAK7D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qCAAqC,CAAC;AAExE,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAG/D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAGnD,MAAM,MAAM,gBAAgB,GACxB,WAAW,GACX,cAAc,GACd,YAAY,GACZ,SAAS,CAAC;AAMd,MAAM,MAAM,iBAAiB,GAAG,UAAU,CAAC,OAAO,uBAAuB,CAAC,CAAC;AAC3E,MAAM,MAAM,qBAAqB,GAAG;IAClC,MAAM,EAAE,cAAc,CAAC;IACvB,kBAAkB,CAAC,EAAE,kBAAkB,CAAC;IACxC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;CACtC,CAAC;AAEF;;;;;;;;;GASG;AACH,wBAAgB,uBAAuB,CAAC,OAAO,EAAE,YAAY;;;;;;;iCA6CvB,MAAM;sBA6EX,MAAM,YAAY,qBAAqB;;2BA2HxC,KAAK,EAAE;+BAzKH,MAAM;+BAO9B,MAAM,YACJ,qBAAqB;;oCA7BM,MAAM;oCAmHA,MAAM;qCAuCL,KAAK;EAyEpD;AAED;;;GAGG;AACH,wBAAsB,2BAA2B,CAC/C,OAAO,EAAE,YAAY,GACpB,OAAO,CAAC,MAAM,EAAE,GAAG,IAAI,CAAC,CAU1B;AAED;;GAEG;AACH,wBAAsB,uBAAuB,CAC3C,OAAO,EAAE,YAAY,GACpB,OAAO,CAAC,QAAQ,GAAG,IAAI,CAAC,CAS1B;AAED;;GAEG;AACH,wBAAsB,qBAAqB,CACzC,OAAO,EAAE,YAAY,GACpB,OAAO,CAAC,KAAK,GAAG,IAAI,CAAC,CASvB;AAED;;GAEG;AACH,eAAO,MAAM,2BAA2B,GACtC,WAAW,MAAM,EACjB,QAAQ,cAAc,EACtB,SAAS,kBAAkB,EAC3B,oBAAoB,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,6BAyB7C,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/wallets/manager/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAEnD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAK7D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qCAAqC,CAAC;AAExE,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAG/D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAGnD,MAAM,MAAM,gBAAgB,GACxB,WAAW,GACX,cAAc,GACd,YAAY,GACZ,SAAS,CAAC;AAMd,MAAM,MAAM,iBAAiB,GAAG,UAAU,CAAC,OAAO,uBAAuB,CAAC,CAAC;AAC3E,MAAM,MAAM,qBAAqB,GAAG;IAClC,MAAM,EAAE,cAAc,CAAC;IACvB,kBAAkB,CAAC,EAAE,kBAAkB,CAAC;IACxC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;CACtC,CAAC;AAEF;;;;;;;;;GASG;AACH,wBAAgB,uBAAuB,CAAC,OAAO,EAAE,YAAY;;;;;;;iCA6CvB,MAAM;sBA6EX,MAAM,YAAY,qBAAqB;;2BA0HxC,KAAK,EAAE;+BAxKH,MAAM;+BAO9B,MAAM,YACJ,qBAAqB;;oCA7BM,MAAM;oCAmHA,MAAM;qCAsCL,KAAK;EAyEpD;AAED;;;GAGG;AACH,wBAAsB,2BAA2B,CAC/C,OAAO,EAAE,YAAY,GACpB,OAAO,CAAC,MAAM,EAAE,GAAG,IAAI,CAAC,CAU1B;AAED;;GAEG;AACH,wBAAsB,uBAAuB,CAC3C,OAAO,EAAE,YAAY,GACpB,OAAO,CAAC,QAAQ,GAAG,IAAI,CAAC,CAS1B;AAED;;GAEG;AACH,wBAAsB,qBAAqB,CACzC,OAAO,EAAE,YAAY,GACpB,OAAO,CAAC,KAAK,GAAG,IAAI,CAAC,CASvB;AAED;;GAEG;AACH,eAAO,MAAM,2BAA2B,GACtC,WAAW,MAAM,EACjB,QAAQ,cAAc,EACtB,SAAS,kBAAkB,EAC3B,oBAAoB,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,6BAyB7C,CAAC"}

package/dist/types/wallets/smart/lib/bundler.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"bundler.d.ts","sourceRoot":"","sources":["../../../../../src/wallets/smart/lib/bundler.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAKhE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,kFAAkF,CAAC;AAC7H,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,uDAAuD,CAAC;AACjG,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,6CAA6C,CAAC;AACvF,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,+CAA+C,CAAC;AAC7F,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AAExE,OAAO,EAAE,KAAK,GAAG,EAAe,MAAM,gCAAgC,CAAC;AAIvE,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAE1D,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,gBAAgB,EAErB,KAAK,cAAc,EACnB,KAAK,iBAAiB,EACtB,KAAK,kBAAkB,EACvB,KAAK,oBAAoB,EACzB,KAAK,gBAAgB,EACrB,KAAK,gBAAgB,EACtB,MAAM,aAAa,CAAC;AAUrB;;;;;;;;;;;;;;GAcG;AACH,wBAAsB,YAAY,CAAC,IAAI,EAAE;IACvC,MAAM,EAAE,gBAAgB,GAAG,gBAAgB,CAAC;IAC5C,OAAO,EAAE,cAAc,CAAC;CACzB,GAAG,OAAO,CAAC,GAAG,CAAC,CASf;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAsB,iBAAiB,CACrC,IAAI,EAAE;IACJ,MAAM,EAAE,gBAAgB,GAAG,gBAAgB,CAAC;IAC5C,OAAO,EAAE,cAAc,CAAC;CACzB,EACD,cAAc,CAAC,EAAE;IACf,CAAC,CAAC,EAAE,MAAM,GAAG;QACX,SAAS,EAAE;YACT,CAAC,CAAC,EAAE,MAAM,GAAG,KAAK,MAAM,EAAE,CAAC;SAC5B,CAAC;KACH,CAAC;CACH,GACA,OAAO,CAAC,gBAAgB,CAAC,CA6B3B;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAsB,qBAAqB,CAAC,IAAI,EAAE;IAChD,YAAY,EAAE,mBAAmB,EAAE,CAAC;IACpC,YAAY,EAAE,OAAO,CAAC;IACtB,MAAM,EAAE,cAAc,CAAC;IACvB,kBAAkB,EAAE,kBAAkB,CAAC;CACxC;;;GA8DA;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAsB,gBAAgB,CAAC,IAAI,EAAE;IAC3C,OAAO,EAAE,cAAc,CAAC;CACzB,GAAG,OAAO,CAAC,cAAc,CAAC,CAW1B;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAsB,gBAAgB,CACpC,IAAI,EAAE,cAAc,GAAG;IACrB,UAAU,EAAE,GAAG,CAAC;CACjB,GACA,OAAO,CAAC,kBAAkB,GAAG,SAAS,CAAC,CA6BzC;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAsB,mBAAmB,CACvC,IAAI,EAAE,cAAc,GAAG;IACrB,UAAU,EAAE,GAAG,CAAC;CACjB,GACA,OAAO,CAAC,oBAAoB,GAAG,SAAS,CAAC,CAU3C;AAED;;GAEG;AACH,wBAAsB,kBAAkB,CAAC,IAAI,EAAE;IAC7C,OAAO,EAAE,cAAc,CAAC;IACxB,WAAW,EAAE,uBAAuB,CAAC;CACtC,GAAG,OAAO,CAAC,iBAAiB,CAAC,CAW7B;AAED;;GAEG;AACH,wBAAsB,oBAAoB,CAAC,IAAI,EAAE;IAC/C,UAAU,EAAE,KAAK,MAAM,EAAE,CAAC;IAC1B,YAAY,EAAE,oBAAoB,CAAC,cAAc,CAAC,CAAC;IACnD,SAAS,EAAE,KAAK,MAAM,EAAE,CAAC;IACzB,aAAa,EAAE,mBAAmB,GAAG,SAAS,CAAC;IAC/C,OAAO,EAAE,cAAc,CAAC;CACzB,GAAG,OAAO,CAAC;IAAE,aAAa,EAAE,MAAM,CAAA;CAAE,CAAC,CAerC;AAED;;GAEG;AACH,wBAAsB,wBAAwB,CAAC,IAAI,EAAE;IACnD,aAAa,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,cAAc,CAAC;CACzB,GAAG,OAAO,CAAC;IAAE,eAAe,EAAE,GAAG,CAAA;CAAE,CAAC,CASpC;AAED,wBAAsB,sBAAsB,CAAC,IAAI,EAAE;IACjD,OAAO,EAAE,cAAc,CAAC;IACxB,WAAW,EAAE,uBAAuB,CAAC;IACrC,iBAAiB,EAAE,GAAG,CAAC;CACxB,GAAG,OAAO,CAAC;IAAE,eAAe,EAAE,GAAG,CAAA;CAAE,CAAC,CAepC"}
+{"version":3,"file":"bundler.d.ts","sourceRoot":"","sources":["../../../../../src/wallets/smart/lib/bundler.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -388,7 +388,7 @@
     }
   },
   "typings": "./dist/types/exports/thirdweb.d.ts",
-  "version": "5.105.49-nightly-04862de9e4e11724720fa40a0ed4713ff2bfdad5-20250917000323",
+  "version": "5.106.1",
   "scripts": {
     "bench": "vitest -c ./test/vitest.config.ts bench",
     "bench:compare": "bun run ./benchmarks/run.ts",
@@ -416,6 +416,7 @@
     "test:ui": "NODE_OPTIONS=--max-old-space-size=8192 vitest dev -c ./test/vitest.config.ts --coverage --ui",
     "test:watch": "vitest -c ./test/vitest.config.ts dev",
     "typedoc": "node scripts/typedoc.mjs && node scripts/parse.mjs",
+    "typecheck": "tsc --project ./tsconfig.build.json --module nodenext --moduleResolution nodenext --noEmit",
     "update-version": "node scripts/version.mjs"
   }
 }

package/src/bridge/types/Chain.ts

@@ -38,3 +38,5 @@ export interface Chain {
     decimals: number;
   };
 }
+
+export type BridgeChain = Chain;

package/src/exports/react.ts

@@ -141,6 +141,10 @@ export {
   CheckoutWidget,
   type CheckoutWidgetProps,
 } from "../react/web/ui/Bridge/CheckoutWidget.js";
+export {
+  SwapWidget,
+  type SwapWidgetProps,
+} from "../react/web/ui/Bridge/swap-widget/SwapWidget.js";
 export {
   TransactionWidget,
   type TransactionWidgetProps,

package/src/pay/convert/type.ts

@@ -1,48 +1,31 @@
-const CURRENCIES = [
-  "USD",
-  "EUR",
-  "GBP",
-  "JPY",
-  "KRW",
-  "CNY",
-  "INR",
-  "NOK",
-  "SEK",
-  "CHF",
-  "AUD",
-  "CAD",
-  "NZD",
-  "MXN",
-  "BRL",
-  "CLP",
-  "CZK",
-  "DKK",
-  "HKD",
-  "HUF",
-  "IDR",
-  "ILS",
-  "ISK",
-] as const;
+const currencySymbol = {
+  USD: "$",
+  EUR: "€",
+  GBP: "£",
+  JPY: "¥",
+  KRW: "₩",
+  CNY: "¥",
+  INR: "₹",
+  NOK: "kr",
+  SEK: "kr",
+  CHF: "CHF",
+  AUD: "$",
+  CAD: "$",
+  NZD: "$",
+  MXN: "$",
+  BRL: "R$",
+  CLP: "$",
+  CZK: "Kč",
+  DKK: "kr",
+  HKD: "$",
+  HUF: "Ft",
+  IDR: "Rp",
+  ILS: "₪",
+  ISK: "kr",
+} as const;
 
-export type SupportedFiatCurrency = (typeof CURRENCIES)[number] | (string & {});
+export type SupportedFiatCurrency = keyof typeof currencySymbol;
 
 export function getFiatSymbol(showBalanceInFiat: SupportedFiatCurrency) {
-  switch (showBalanceInFiat) {
-    case "USD":
-      return "$";
-    case "CAD":
-      return "$";
-    case "GBP":
-      return "£";
-    case "EUR":
-      return "€";
-    case "JPY":
-      return "¥";
-    case "AUD":
-      return "$";
-    case "NZD":
-      return "$";
-    default:
-      return "$";
-  }
+  return currencySymbol[showBalanceInFiat] || "$";
 }

package/src/react/core/design-system/index.ts

@@ -136,7 +136,7 @@ function createThemeObj(type: "dark" | "light", colors: ThemeColors): Theme {
       selectedTextColor: colors.base1,
 
       separatorLine: colors.base4,
-      skeletonBg: colors.base3,
+      skeletonBg: colors.base4,
       success: colors.success,
       tertiaryBg: colors.base2,
 
@@ -177,6 +177,7 @@ export const spacing = {
   "4xs": "2px",
   lg: "24px",
   md: "16px",
+  "md+": "20px",
   sm: "12px",
   xl: "32px",
   xs: "8px",
@@ -191,6 +192,7 @@ export const radius = {
   xl: "20px",
   xs: "4px",
   xxl: "32px",
+  full: "9999px",
 };
 
 export const iconSize = {

package/src/react/core/hooks/usePaymentMethods.ts

@@ -124,7 +124,10 @@ export function usePaymentMethods(options: {
             ),
           )
         : sufficientBalanceQuotes;
-      return finalQuotes;
+      return finalQuotes.map((x) => ({
+        ...x,
+        action: "buy",
+      }));
     },
     queryKey: [
       "payment-methods",

package/src/react/core/hooks/wallets/useAutoConnect.ts

@@ -14,7 +14,6 @@ export function useAutoConnectCore(
   storage: AsyncStorage,
   props: AutoConnectProps & { wallets: Wallet[] },
   createWalletFn: (id: WalletId) => Wallet,
-  getInstalledWallets?: () => Wallet[],
 ) {
   const manager = useConnectionManagerCtx("useAutoConnect");
   const { connect } = useConnect({
@@ -28,7 +27,6 @@ export function useAutoConnectCore(
       autoConnectCore({
         connectOverride: connect,
         createWalletFn,
-        getInstalledWallets,
         manager,
         props,
         setLastAuthProvider,

package/src/react/core/machines/paymentMachine.ts

@@ -22,6 +22,7 @@ type PaymentMode = "fund_wallet" | "direct_payment" | "transaction";
 export type PaymentMethod =
   | {
       type: "wallet";
+      action: "buy" | "sell";
       payerWallet: Wallet;
       originToken: TokenWithPrices;
       balance: bigint;

package/src/react/web/hooks/wallets/useAutoConnect.ts

@@ -2,7 +2,6 @@ import { webLocalStorage } from "../../../../utils/storage/webStorage.js";
 import type { AutoConnectProps } from "../../../../wallets/connection/types.js";
 import { createWallet } from "../../../../wallets/create-wallet.js";
 import { getDefaultWallets } from "../../../../wallets/defaultWallets.js";
-import { getInstalledWalletProviders } from "../../../../wallets/injected/mipdStore.js";
 import { useAutoConnectCore } from "../../../core/hooks/wallets/useAutoConnect.js";
 
 /**
@@ -34,15 +33,5 @@ export function useAutoConnect(props: AutoConnectProps) {
       wallets,
     },
     createWallet,
-    () => {
-      const specifiedWalletIds = new Set(wallets.map((x) => x.id));
-
-      // pass the wallets that are not already specified but are installed by the user
-      const installedWallets = getInstalledWalletProviders()
-        .filter((x) => !specifiedWalletIds.has(x.info.rdns))
-        .map((x) => createWallet(x.info.rdns));
-
-      return installedWallets;
-    },
   );
 }

package/src/react/web/ui/Bridge/BridgeOrchestrator.tsx

@@ -180,14 +180,13 @@ export function BridgeOrchestrator({
   const [state, send] = usePaymentMachine(adapters, uiOptions.mode);
 
   // Handle buy completion
-  const handleBuyComplete = useCallback(() => {
+  const handleDoneOrContinueClick = useCallback(() => {
     if (uiOptions.mode === "transaction") {
       send({ type: "CONTINUE_TO_TRANSACTION" });
     } else {
-      onComplete?.();
       send({ type: "RESET" });
     }
-  }, [onComplete, send, uiOptions.mode]);
+  }, [send, uiOptions.mode]);
 
   // Handle post-buy transaction completion
   const handlePostBuyTransactionComplete = useCallback(() => {
@@ -230,8 +229,11 @@ export function BridgeOrchestrator({
   const handleExecutionComplete = useCallback(
     (completedStatuses: CompletedStatusResult[]) => {
       send({ completedStatuses, type: "EXECUTION_COMPLETE" });
+      if (uiOptions.mode !== "transaction") {
+        onComplete?.();
+      }
     },
-    [send],
+    [send, onComplete, uiOptions.mode],
   );
 
   // Handle retry
@@ -390,7 +392,7 @@ export function BridgeOrchestrator({
           <SuccessScreen
             client={client}
             completedStatuses={state.context.completedStatuses}
-            onDone={handleBuyComplete}
+            onDone={handleDoneOrContinueClick}
             preparedQuote={state.context.quote}
             uiOptions={uiOptions}
             windowAdapter={webWindowAdapter}

package/src/react/web/ui/Bridge/BuyWidget.tsx

@@ -128,7 +128,7 @@ export type BuyWidgetProps = {
   amount: string;
 
   /**
-   * The title to display in the widget.
+   * The title to display in the widget. If `title` is explicity set to an empty string, the title will not be displayed.
    */
   title?: string;
 

package/src/react/web/ui/Bridge/DirectPayment.tsx

@@ -100,7 +100,7 @@ export function DirectPayment({
           size="xl"
           token={uiOptions.paymentInfo.token}
           tokenAmount={uiOptions.paymentInfo.amount}
-          weight={700}
+          weight={600}
         />
         <Container flex="row" gap="3xs">
           <Text
@@ -190,7 +190,7 @@ export function DirectPayment({
             <PoweredByThirdweb />
           </div>
         ) : null}
-        <Spacer y="lg" />
+        <Spacer y="md" />
       </Container>
     </WithHeader>
   );

package/src/react/web/ui/Bridge/ErrorBanner.tsx

@@ -51,7 +51,7 @@ export function ErrorBanner({
   });
 
   return (
-    <Container flex="column" fullHeight gap="md" p="lg">
+    <Container flex="column" fullHeight gap="md" p="md">
       {/* Error Icon and Message */}
       <Container flex="row" gap="md" style={{ alignItems: "flex-start" }}>
         <Container

package/src/react/web/ui/Bridge/FundWallet.tsx

@@ -150,7 +150,7 @@ export function FundWallet({
           style={{
             backgroundColor: theme.colors.tertiaryBg,
             border: `1px solid ${theme.colors.borderColor}`,
-            borderRadius: radius.md,
+            borderRadius: radius.lg,
             flexWrap: "nowrap",
           }}
         >
@@ -251,11 +251,11 @@ export function FundWallet({
         {/* Quick Amount Buttons */}
         {presetOptions && (
           <>
-            <Spacer y="md" />
+            <Spacer y="sm" />
             <Container
               center="x"
               flex="row"
-              gap="xs"
+              gap="sm"
               style={{
                 justifyContent: "space-evenly",
               }}
@@ -268,6 +268,7 @@ export function FundWallet({
                     backgroundColor: theme.colors.tertiaryBg,
                     flex: 1,
                     fontSize: fontSize.sm,
+                    borderRadius: radius.lg,
                     padding: `${spacing.sm} ${spacing.md}`,
                   }}
                   variant="outline"
@@ -279,7 +280,7 @@ export function FundWallet({
           </>
         )}
 
-        <Spacer y="md" />
+        <Spacer y="sm" />
 
         <Container
           center="y"
@@ -291,7 +292,7 @@ export function FundWallet({
           style={{
             backgroundColor: theme.colors.tertiaryBg,
             border: `1px solid ${theme.colors.borderColor}`,
-            borderRadius: radius.md,
+            borderRadius: radius.lg,
           }}
         >
           {receiver ? (
@@ -336,7 +337,7 @@ export function FundWallet({
           }}
           style={{
             fontSize: fontSize.md,
-            padding: `${spacing.sm} ${spacing.md}`,
+            borderRadius: radius.lg,
           }}
           variant="primary"
         >
@@ -359,10 +360,10 @@ export function FundWallet({
       {showThirdwebBranding ? (
         <div>
           <Spacer y="md" />
-          <PoweredByThirdweb />
+          <PoweredByThirdweb link="https://playground.thirdweb.com/payments/fund-wallet" />
         </div>
       ) : null}
-      <Spacer y="lg" />
+      <Spacer y="md" />
     </WithHeader>
   );
 }

package/src/react/web/ui/Bridge/QuoteLoader.tsx

@@ -163,7 +163,7 @@ export function QuoteLoader({
       <Spinner color="secondaryText" size="xl" />
       <Spacer y="md" />
       <Text center color="primaryText" size="lg" style={{ fontWeight: 600 }}>
-        Finding the best route...
+        Finding the best route
       </Text>
       <Spacer y="sm" />
       <Text center color="secondaryText" size="sm">
@@ -229,7 +229,10 @@ function getBridgeParams(args: {
       }
 
       return {
-        amount: toUnits(amount, destinationToken.decimals),
+        amount:
+          paymentMethod.action === "buy"
+            ? toUnits(amount, destinationToken.decimals)
+            : toUnits(amount, paymentMethod.originToken.decimals),
         client,
         destinationChainId: destinationToken.chainId,
         destinationTokenAddress: destinationToken.address,
@@ -241,7 +244,7 @@ function getBridgeParams(args: {
         receiver,
         sender:
           sender || paymentMethod.payerWallet.getAccount()?.address || receiver,
-        type: "buy",
+        type: paymentMethod.action,
       };
   }
 }

package/src/react/web/ui/Bridge/StepRunner.tsx

@@ -25,6 +25,7 @@ import { Spinner } from "../components/Spinner.js";
 import { Text } from "../components/text.js";
 
 interface StepRunnerProps {
+  title?: string;
   request: BridgePrepareRequest;
 
   /**
@@ -64,6 +65,7 @@ interface StepRunnerProps {
 }
 
 export function StepRunner({
+  title,
   request,
   wallet,
   client,
@@ -247,8 +249,8 @@ export function StepRunner({
   };
 
   return (
-    <Container flex="column" fullHeight p="lg">
-      <ModalHeader onBack={onBack} title="Processing Payment" />
+    <Container flex="column" fullHeight px="md" pb="md" pt="md+">
+      <ModalHeader onBack={onBack} title={title || "Processing Payment"} />
 
       <Spacer y="xl" />
 
@@ -374,7 +376,7 @@ export function StepRunner({
         </Container>
 
         <Spacer y="md" />
-        <Text center color="secondaryText" size="xs">
+        <Text center color="secondaryText" size="xs" multiline>
           Keep this window open until all
           <br /> transactions are complete.
         </Text>

package/src/react/web/ui/Bridge/TransactionPayment.tsx

@@ -194,7 +194,7 @@ export function TransactionPayment({
         }}
       >
         {/* USD Value */}
-        <Text color="primaryText" size="xl" weight={700}>
+        <Text color="primaryText" size="xl" weight={600}>
           {transactionDataQuery.data?.usdValueDisplay ||
             transactionDataQuery.data?.txCostDisplay}
         </Text>
@@ -431,7 +431,7 @@ export function TransactionPayment({
           <PoweredByThirdweb />
         </div>
       ) : null}
-      <Spacer y="lg" />
+      <Spacer y="md" />
     </WithHeader>
   );
 }

package/src/react/web/ui/Bridge/UnsupportedTokenScreen.tsx

@@ -64,7 +64,7 @@ export function UnsupportedTokenScreen(props: UnsupportedTokenScreenProps) {
           size="sm"
           style={{ lineHeight: 1.5, maxWidth: "280px" }}
         >
-          The Universal Bridge does not support testnets at this time.
+          Bridge does not support testnets at this time.
         </Text>
       </Container>
     );
@@ -94,7 +94,7 @@ export function UnsupportedTokenScreen(props: UnsupportedTokenScreenProps) {
         size="sm"
         style={{ lineHeight: 1.5, maxWidth: "280px" }}
       >
-        This token or chain is not supported by the Universal Bridge.
+        This token or chain is not supported by the Bridge
       </Text>
     </Container>
   );

package/src/react/web/ui/Bridge/common/TokenAndChain.tsx

@@ -60,7 +60,7 @@ export function TokenAndChain({
               height:
                 size === "lg" || size === "xl" ? iconSize.sm : iconSize.xs,
               position: "absolute",
-              right: "-6px",
+              right: "-2px",
               width: size === "lg" || size === "xl" ? iconSize.sm : iconSize.xs,
             }}
           >
@@ -73,7 +73,7 @@ export function TokenAndChain({
         )}
       </Container>
 
-      <Container flex="column" gap="3xs" style={{ minWidth: 0 }}>
+      <Container flex="column" gap="4xs" style={{ minWidth: 0 }}>
         <Text
           color="primaryText"
           size={size === "xl" ? "lg" : "sm"}
@@ -83,6 +83,7 @@ export function TokenAndChain({
             whiteSpace: "nowrap",
           }}
           weight={600}
+          trackingTight
         >
           {token.name}
         </Text>

package/src/react/web/ui/Bridge/common/WithHeader.tsx

@@ -19,6 +19,8 @@ export function WithHeader({
   client: ThirdwebClient;
 }) {
   const theme = useCustomTheme();
+  const showTitle = uiOptions.metadata?.title !== "";
+
   return (
     <Container flex="column">
       {/* image */}
@@ -36,25 +38,33 @@ export function WithHeader({
           }}
         />
       )}
-      <Container flex="column" px="lg">
-        <Spacer y="lg" />
 
-        {/* title */}
-        <Text color="primaryText" size="lg" weight={700}>
-          {uiOptions.metadata?.title || defaultTitle}
-        </Text>
+      <Container flex="column" px="md">
+        <Spacer y="md+" />
 
-        {/* Description */}
-        {uiOptions.metadata?.description && (
+        {(showTitle || uiOptions.metadata?.description) && (
           <>
-            <Spacer y="xs" />
-            <Text color="secondaryText" size="sm">
-              {uiOptions.metadata?.description}
-            </Text>
+            {/* title */}
+            {showTitle && (
+              <Text color="primaryText" size="lg" weight={600}>
+                {uiOptions.metadata?.title || defaultTitle}
+              </Text>
+            )}
+
+            {/* Description */}
+            {uiOptions.metadata?.description && (
+              <>
+                <Spacer y="xxs" />
+                <Text color="secondaryText" size="sm" multiline>
+                  {uiOptions.metadata?.description}
+                </Text>
+              </>
+            )}
+
+            <Spacer y="md" />
           </>
         )}
 
-        <Spacer y="lg" />
         {children}
       </Container>
     </Container>

package/src/react/web/ui/Bridge/payment-details/PaymentDetails.tsx

@@ -21,6 +21,9 @@ import type { UIOptions } from "../BridgeOrchestrator.js";
 import { PaymentOverview } from "./PaymentOverview.js";
 
 export interface PaymentDetailsProps {
+  title?: string;
+  confirmButtonLabel?: string;
+
   /**
    * The UI mode to use
    */
@@ -55,6 +58,8 @@ export interface PaymentDetailsProps {
 }
 
 export function PaymentDetails({
+  title,
+  confirmButtonLabel,
   uiOptions,
   client,
   paymentMethod,
@@ -185,6 +190,43 @@ export function PaymentDetails({
               : undefined,
         };
       }
+
+      case "sell": {
+        const method =
+          paymentMethod.type === "wallet" ? paymentMethod : undefined;
+        if (!method) {
+          // can never happen
+          onError(new Error("Invalid payment method"));
+          return {
+            destinationAmount: "0",
+            destinationToken: undefined,
+            estimatedTime: 0,
+            originAmount: "0",
+            originToken: undefined,
+          };
+        }
+
+        return {
+          destinationAmount: formatTokenAmount(
+            preparedQuote.destinationAmount,
+            preparedQuote.steps[preparedQuote.steps.length - 1]
+              ?.destinationToken?.decimals ?? 18,
+          ),
+          destinationToken:
+            preparedQuote.steps[preparedQuote.steps.length - 1]
+              ?.destinationToken,
+          estimatedTime: preparedQuote.estimatedExecutionTimeMs,
+          originAmount: formatTokenAmount(
+            preparedQuote.originAmount,
+            method.originToken.decimals,
+          ),
+          originToken:
+            paymentMethod.type === "wallet"
+              ? paymentMethod.originToken
+              : undefined,
+        };
+      }
+
       case "onramp": {
         const method =
           paymentMethod.type === "fiat" ? paymentMethod : undefined;
@@ -215,7 +257,7 @@ export function PaymentDetails({
       }
       default: {
         throw new Error(
-          `Unsupported bridge prepare type: ${preparedQuote.type}`,
+          `Unsupported bridge prepare type: ${(preparedQuote as unknown as { type: string }).type}`,
         );
       }
     }
@@ -224,10 +266,10 @@ export function PaymentDetails({
   const displayData = getDisplayData();
 
   return (
-    <Container flex="column" fullHeight p="lg">
-      <ModalHeader onBack={onBack} title="Payment Details" />
+    <Container flex="column" fullHeight px="md" pb="md" pt="md+">
+      <ModalHeader onBack={onBack} title={title || "Payment Details"} />
 
-      <Spacer y="xl" />
+      <Spacer y="lg" />
 
       <Container flex="column">
         {/* Quote Summary */}
@@ -390,7 +432,7 @@ export function PaymentDetails({
         {/* Action Buttons */}
         <Container flex="column" gap="sm">
           <Button fullWidth onClick={handleConfirm} variant="accent">
-            Confirm Payment
+            {confirmButtonLabel || "Confirm Payment"}
           </Button>
         </Container>
       </Container>