thirdweb 5.116.1 → 5.116.2-nightly-151127d66825365cb0ed949ae28b9906ee4dfc8d-20251214000442

package/dist/types/react/web/ui/Bridge/swap-widget/swap-ui.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"swap-ui.d.ts","sourceRoot":"","sources":["../../../../../../../src/react/web/ui/Bridge/swap-widget/swap-ui.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sCAAsC,CAAC;AAC5E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAC;AAEtE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,oCAAoC,CAAC;AAGhF,OAAO,EAKL,KAAK,KAAK,EACX,MAAM,yCAAyC,CAAC;AACjD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,4CAA4C,CAAC;AAuBvF,OAAO,KAAK,EACV,gBAAgB,EAChB,iBAAiB,EACjB,wBAAwB,EACxB,cAAc,EACf,MAAM,YAAY,CAAC;AAGpB,KAAK,WAAW,GAAG;IACjB,gBAAgB,EAAE,gBAAgB,GAAG,SAAS,CAAC;IAC/C,MAAM,EAAE,cAAc,CAAC;IACvB,KAAK,EAAE,KAAK,GAAG,OAAO,GAAG,MAAM,CAAC;IAChC,cAAc,EAAE,wBAAwB,GAAG,SAAS,CAAC;IACrD,QAAQ,EAAE,qBAAqB,CAAC;IAChC,oBAAoB,EAAE,OAAO,CAAC;IAC9B,MAAM,EAAE,CAAC,IAAI,EAAE;QACb,MAAM,EAAE,iBAAiB,CAAC;QAC1B,OAAO,EAAE,oBAAoB,CAAC;QAC9B,QAAQ,EAAE,eAAe,CAAC;QAC1B,gBAAgB,EAAE,MAAM,CAAC;QACzB,SAAS,EAAE,eAAe,CAAC;QAC3B,IAAI,EAAE,KAAK,GAAG,MAAM,CAAC;KACtB,KAAK,IAAI,CAAC;IACX,QAAQ,EAAE,cAAc,GAAG,SAAS,CAAC;IACrC,SAAS,EAAE,cAAc,GAAG,SAAS,CAAC;IACtC,WAAW,EAAE,CAAC,KAAK,EAAE,cAAc,GAAG,SAAS,KAAK,IAAI,CAAC;IACzD,YAAY,EAAE,CAAC,KAAK,EAAE,cAAc,GAAG,SAAS,KAAK,IAAI,CAAC;IAC1D,eAAe,EAAE;QACf,IAAI,EAAE,KAAK,GAAG,MAAM,CAAC;QACrB,MAAM,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,kBAAkB,EAAE,CAAC,eAAe,EAAE;QACpC,IAAI,EAAE,KAAK,GAAG,MAAM,CAAC;QACrB,MAAM,EAAE,MAAM,CAAC;KAChB,KAAK,IAAI,CAAC;IACX,YAAY,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,CAAC;CACxC,CAAC;AAyBF;;GAEG;AACH,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,2CAsXxC"}
+{"version":3,"file":"swap-ui.d.ts","sourceRoot":"","sources":["../../../../../../../src/react/web/ui/Bridge/swap-widget/swap-ui.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sCAAsC,CAAC;AAC5E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAC;AAGtE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,oCAAoC,CAAC;AAIhF,OAAO,EAKL,KAAK,KAAK,EACX,MAAM,yCAAyC,CAAC;AACjD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,4CAA4C,CAAC;AAuBvF,OAAO,KAAK,EACV,gBAAgB,EAChB,iBAAiB,EACjB,wBAAwB,EACxB,cAAc,EACf,MAAM,YAAY,CAAC;AAGpB,KAAK,WAAW,GAAG;IACjB,gBAAgB,EAAE,gBAAgB,GAAG,SAAS,CAAC;IAC/C,MAAM,EAAE,cAAc,CAAC;IACvB,KAAK,EAAE,KAAK,GAAG,OAAO,GAAG,MAAM,CAAC;IAChC,cAAc,EAAE,wBAAwB,GAAG,SAAS,CAAC;IACrD,QAAQ,EAAE,qBAAqB,CAAC;IAChC,oBAAoB,EAAE,OAAO,CAAC;IAC9B,MAAM,EAAE,CAAC,IAAI,EAAE;QACb,MAAM,EAAE,iBAAiB,CAAC;QAC1B,OAAO,EAAE,oBAAoB,CAAC;QAC9B,QAAQ,EAAE,eAAe,CAAC;QAC1B,gBAAgB,EAAE,MAAM,CAAC;QACzB,SAAS,EAAE,eAAe,CAAC;QAC3B,IAAI,EAAE,KAAK,GAAG,MAAM,CAAC;KACtB,KAAK,IAAI,CAAC;IACX,QAAQ,EAAE,cAAc,GAAG,SAAS,CAAC;IACrC,SAAS,EAAE,cAAc,GAAG,SAAS,CAAC;IACtC,WAAW,EAAE,CAAC,KAAK,EAAE,cAAc,GAAG,SAAS,KAAK,IAAI,CAAC;IACzD,YAAY,EAAE,CAAC,KAAK,EAAE,cAAc,GAAG,SAAS,KAAK,IAAI,CAAC;IAC1D,eAAe,EAAE;QACf,IAAI,EAAE,KAAK,GAAG,MAAM,CAAC;QACrB,MAAM,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,kBAAkB,EAAE,CAAC,eAAe,EAAE;QACpC,IAAI,EAAE,KAAK,GAAG,MAAM,CAAC;QACrB,MAAM,EAAE,MAAM,CAAC;KAChB,KAAK,IAAI,CAAC;IACX,YAAY,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,CAAC;CACxC,CAAC;AAyBF;;GAEG;AACH,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,2CA8YxC"}

package/dist/types/react/web/ui/Bridge/swap-widget/use-bridge-chains.d.ts

@@ -1,4 +1,3 @@
-import { chains } from "../../../../../bridge/index.js";
 import type { ThirdwebClient } from "../../../../../client/client.js";
-export declare function useBridgeChains(client: ThirdwebClient): import("@tanstack/react-query").UseQueryResult<chains.Result, Error>;
+export declare function useBridgeChains(client: ThirdwebClient): import("@tanstack/react-query").UseQueryResult<import("../../../../../bridge/index.js").Chain[], Error>;
 //# sourceMappingURL=use-bridge-chains.d.ts.map

package/dist/types/react/web/ui/Bridge/swap-widget/use-bridge-chains.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-bridge-chains.d.ts","sourceRoot":"","sources":["../../../../../../../src/react/web/ui/Bridge/swap-widget/use-bridge-chains.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,gCAAgC,CAAC;AACxD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAC;AAEtE,wBAAgB,eAAe,CAAC,MAAM,EAAE,cAAc,wEASrD"}
+{"version":3,"file":"use-bridge-chains.d.ts","sourceRoot":"","sources":["../../../../../../../src/react/web/ui/Bridge/swap-widget/use-bridge-chains.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAC;AAEtE,wBAAgB,eAAe,CAAC,MAAM,EAAE,cAAc,2GA0BrD"}

package/dist/types/react/web/ui/ConnectWallet/WalletEntryButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WalletEntryButton.d.ts","sourceRoot":"","sources":["../../../../../../src/react/web/ui/ConnectWallet/WalletEntryButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAGnE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,0CAA0C,CAAC;AAevE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAEvD;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,aAAa,EAAE,aAAa,CAAC;IAC7B,kBAAkB,EAAE,MAAM,EAAE,GAAG,SAAS,CAAC;IACzC,MAAM,EAAE,cAAc,CAAC;IACvB,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;CAC3B,2CA6DA;AAED,eAAO,MAAM,cAAc;;;qHAwBzB,CAAC"}
+{"version":3,"file":"WalletEntryButton.d.ts","sourceRoot":"","sources":["../../../../../../src/react/web/ui/ConnectWallet/WalletEntryButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAGnE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,0CAA0C,CAAC;AAgBvE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAEvD;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,aAAa,EAAE,aAAa,CAAC;IAC7B,kBAAkB,EAAE,MAAM,EAAE,GAAG,SAAS,CAAC;IACzC,MAAM,EAAE,cAAc,CAAC;IACvB,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;CAC3B,2CA6EA;AAED,eAAO,MAAM,cAAc;;;qHAwBzB,CAAC"}

package/dist/types/react/web/ui/ConnectWallet/icons/EmailIcon.d.ts

@@ -1,6 +1,3 @@
 import type { IconFC } from "./types.js";
-/**
- * @internal
- */
 export declare const EmailIcon: IconFC;
 //# sourceMappingURL=EmailIcon.d.ts.map

package/dist/types/react/web/ui/ConnectWallet/icons/EmailIcon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EmailIcon.d.ts","sourceRoot":"","sources":["../../../../../../../src/react/web/ui/ConnectWallet/icons/EmailIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,YAAY,CAAC;AAEzC;;GAEG;AACH,eAAO,MAAM,SAAS,EAAE,MAwBvB,CAAC"}
+{"version":3,"file":"EmailIcon.d.ts","sourceRoot":"","sources":["../../../../../../../src/react/web/ui/ConnectWallet/icons/EmailIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,YAAY,CAAC;AAEzC,eAAO,MAAM,SAAS,EAAE,MAoBvB,CAAC"}

package/dist/types/react/web/ui/ConnectWallet/icons/WalletDotIcon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WalletDotIcon.d.ts","sourceRoot":"","sources":["../../../../../../../src/react/web/ui/ConnectWallet/icons/WalletDotIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,YAAY,CAAC;AAEzC;;GAEG;AACH,eAAO,MAAM,aAAa,EAAE,MAgB3B,CAAC"}
+{"version":3,"file":"WalletDotIcon.d.ts","sourceRoot":"","sources":["../../../../../../../src/react/web/ui/ConnectWallet/icons/WalletDotIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,YAAY,CAAC;AAEzC;;GAEG;AACH,eAAO,MAAM,aAAa,EAAE,MAiB3B,CAAC"}

package/dist/types/react/web/ui/ConnectWallet/in-app-wallet-icon.d.ts

@@ -0,0 +1,7 @@
+import type { ThirdwebClient } from "../../../../client/client.js";
+import type { Wallet } from "../../../../wallets/interfaces/wallet.js";
+export declare function InAppWalletIcon(props: {
+    client: ThirdwebClient;
+    wallet: Wallet<"inApp">;
+}): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=in-app-wallet-icon.d.ts.map

package/dist/types/react/web/ui/ConnectWallet/in-app-wallet-icon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"in-app-wallet-icon.d.ts","sourceRoot":"","sources":["../../../../../../src/react/web/ui/ConnectWallet/in-app-wallet-icon.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AACnE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,0CAA0C,CAAC;AAgBvE,wBAAgB,eAAe,CAAC,KAAK,EAAE;IACrC,MAAM,EAAE,cAAc,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;CACzB,kDAsIA"}

package/dist/types/react/web/ui/components/Spinner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../../../../../src/react/web/ui/components/Spinner.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,sCAAsC,CAAC;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,sCAAsC,CAAC;AAGhE;;GAEG;AACH,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC;IAC7B,IAAI,EAAE,MAAM,OAAO,QAAQ,CAAC;IAC5B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,KAAK,CAAC,EAAE,MAAM,KAAK,CAAC,QAAQ,CAAC,CAAC;CAC/B,CAsBA,CAAC"}
+{"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../../../../../src/react/web/ui/components/Spinner.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,sCAAsC,CAAC;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,sCAAsC,CAAC;AAGhE;;GAEG;AACH,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC;IAC7B,IAAI,EAAE,MAAM,OAAO,QAAQ,CAAC;IAC5B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,KAAK,CAAC,EAAE,MAAM,KAAK,CAAC,QAAQ,CAAC,CAAC;CAC/B,CA2BA,CAAC"}

package/dist/types/react/web/ui/design-system/elements.d.ts

@@ -6,10 +6,6 @@ export declare const StyledSvg: import("@emotion/styled").CreateStyledComponent<
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 }, import("react").SVGProps<SVGSVGElement>, {}>;
-export declare const StyledCircle: import("@emotion/styled").CreateStyledComponent<{
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
-}, import("react").SVGProps<SVGCircleElement>, {}>;
 export declare const StyledSpan: import("@emotion/styled").CreateStyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;

package/dist/types/react/web/ui/design-system/elements.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"elements.d.ts","sourceRoot":"","sources":["../../../../../../src/react/web/ui/design-system/elements.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,SAAS;;;yGAA6B,CAAC;AACpD,eAAO,MAAM,SAAS;;;+CAA6B,CAAC;AACpD,eAAO,MAAM,YAAY;;;kDAAgC,CAAC;AAC1D,eAAO,MAAM,UAAU;;;2GAA8B,CAAC;AACtD,eAAO,MAAM,YAAY;;;qHAA2B,CAAC;AACrD,eAAO,MAAM,YAAY;;;qHAAgC,CAAC;AAC1D,eAAO,MAAM,WAAW;;;kHAA+B,CAAC;AACxD,eAAO,MAAM,WAAW;;;kHAA+B,CAAC;AACxD,eAAO,MAAM,QAAQ;;;iHAA4B,CAAC;AAClD,eAAO,MAAM,OAAO;;;qHAA2B,CAAC;AAChD,eAAO,MAAM,QAAQ;;;6GAA4B,CAAC;AAClD,eAAO,MAAM,YAAY;;;qHAAgC,CAAC;AAC1D,eAAO,MAAM,YAAY;;;qHAAgC,CAAC"}
+{"version":3,"file":"elements.d.ts","sourceRoot":"","sources":["../../../../../../src/react/web/ui/design-system/elements.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,SAAS;;;yGAA6B,CAAC;AACpD,eAAO,MAAM,SAAS;;;+CAA6B,CAAC;AACpD,eAAO,MAAM,UAAU;;;2GAA8B,CAAC;AACtD,eAAO,MAAM,YAAY;;;qHAA2B,CAAC;AACrD,eAAO,MAAM,YAAY;;;qHAAgC,CAAC;AAC1D,eAAO,MAAM,WAAW;;;kHAA+B,CAAC;AACxD,eAAO,MAAM,WAAW;;;kHAA+B,CAAC;AACxD,eAAO,MAAM,QAAQ;;;iHAA4B,CAAC;AAClD,eAAO,MAAM,OAAO;;;qHAA2B,CAAC;AAChD,eAAO,MAAM,QAAQ;;;6GAA4B,CAAC;AAClD,eAAO,MAAM,YAAY;;;qHAAgC,CAAC;AAC1D,eAAO,MAAM,YAAY;;;qHAAgC,CAAC"}

package/dist/types/react/web/wallets/shared/ConnectWalletSocialOptions.d.ts

@@ -2,7 +2,7 @@ import type { Chain } from "../../../../chains/types.js";
 import type { ThirdwebClient } from "../../../../client/client.js";
 import type { Profile } from "../../../../wallets/in-app/core/authentication/types.js";
 import type { Account, Wallet } from "../../../../wallets/interfaces/wallet.js";
-import { type SocialAuthOption } from "../../../../wallets/types.js";
+import { type AuthOption, type SocialAuthOption } from "../../../../wallets/types.js";
 import type { EcosystemWalletId } from "../../../../wallets/wallet-types.js";
 import type { InAppWalletLocale } from "./locale/types.js";
 export type ConnectWalletSelectUIState = undefined | {
@@ -20,6 +20,7 @@ export type ConnectWalletSelectUIState = undefined | {
         linking: boolean;
     };
 };
+export declare const defaultAuthOptions: AuthOption[];
 type ConnectWalletSocialOptionsProps = {
     select: () => void;
     done: () => void;

package/dist/types/react/web/wallets/shared/ConnectWalletSocialOptions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConnectWalletSocialOptions.d.ts","sourceRoot":"","sources":["../../../../../../src/react/web/wallets/shared/ConnectWalletSocialOptions.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,6BAA6B,CAAC;AACzD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAInE,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,yDAAyD,CAAC;AAGvF,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,0CAA0C,CAAC;AAChF,OAAO,EAEL,KAAK,gBAAgB,EAEtB,MAAM,8BAA8B,CAAC;AACtC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qCAAqC,CAAC;AAwB7E,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAG3D,MAAM,MAAM,0BAA0B,GAClC,SAAS,GACT;IACE,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE;QACZ,IAAI,EAAE,gBAAgB,CAAC;QACvB,iBAAiB,EAAE,OAAO,CAAC,OAAO,GAAG,OAAO,EAAE,CAAC,CAAC;KACjD,CAAC;IACF,UAAU,CAAC,EAAE;QACX,iBAAiB,EAAE,OAAO,CAAC,OAAO,GAAG,OAAO,EAAE,CAAC,CAAC;KACjD,CAAC;IACF,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE;QACZ,OAAO,EAAE,OAAO,CAAC;KAClB,CAAC;CACH,CAAC;AAWN,KAAK,+BAA+B,GAAG;IACrC,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,MAAM,EAAE,iBAAiB,CAAC;IAC1B,MAAM,EAAE,MAAM,CAAC,iBAAiB,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC;IACpD,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,EAAE,KAAK,GAAG,SAAS,CAAC;IACzB,MAAM,EAAE,cAAc,CAAC;IACvB,IAAI,EAAE,SAAS,GAAG,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,0BAA0B,GACrC,OAAO,+BAA+B,4CAubvC,CAAC"}
+{"version":3,"file":"ConnectWalletSocialOptions.d.ts","sourceRoot":"","sources":["../../../../../../src/react/web/wallets/shared/ConnectWalletSocialOptions.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,6BAA6B,CAAC;AACzD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAInE,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,yDAAyD,CAAC;AAGvF,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,0CAA0C,CAAC;AAChF,OAAO,EACL,KAAK,UAAU,EACf,KAAK,gBAAgB,EAEtB,MAAM,8BAA8B,CAAC;AACtC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qCAAqC,CAAC;AAwB7E,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAG3D,MAAM,MAAM,0BAA0B,GAClC,SAAS,GACT;IACE,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE;QACZ,IAAI,EAAE,gBAAgB,CAAC;QACvB,iBAAiB,EAAE,OAAO,CAAC,OAAO,GAAG,OAAO,EAAE,CAAC,CAAC;KACjD,CAAC;IACF,UAAU,CAAC,EAAE;QACX,iBAAiB,EAAE,OAAO,CAAC,OAAO,GAAG,OAAO,EAAE,CAAC,CAAC;KACjD,CAAC;IACF,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE;QACZ,OAAO,EAAE,OAAO,CAAC;KAClB,CAAC;CACH,CAAC;AAEN,eAAO,MAAM,kBAAkB,EAAE,UAAU,EAO1C,CAAC;AAEF,KAAK,+BAA+B,GAAG;IACrC,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,MAAM,EAAE,iBAAiB,CAAC;IAC1B,MAAM,EAAE,MAAM,CAAC,iBAAiB,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC;IACpD,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,EAAE,KAAK,GAAG,SAAS,CAAC;IACzB,MAAM,EAAE,cAAc,CAAC;IACvB,IAAI,EAAE,SAAS,GAAG,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,0BAA0B,GACrC,OAAO,+BAA+B,4CAubvC,CAAC"}

package/dist/types/react/web/wallets/shared/OTPLoginUI.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"OTPLoginUI.d.ts","sourceRoot":"","sources":["../../../../../../src/react/web/wallets/shared/OTPLoginUI.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,6BAA6B,CAAC;AACzD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAOnE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,0CAA0C,CAAC;AAYvE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAY3D;;GAEG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE;IAChC,QAAQ,EAAE;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,GAAG;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;IAChD,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,iBAAiB,CAAC;IAC1B,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,EAAE,cAAc,CAAC;IACvB,KAAK,EAAE,KAAK,GAAG,SAAS,CAAC;IACzB,IAAI,EAAE,SAAS,GAAG,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,kDAiUA"}
+{"version":3,"file":"OTPLoginUI.d.ts","sourceRoot":"","sources":["../../../../../../src/react/web/wallets/shared/OTPLoginUI.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,6BAA6B,CAAC;AACzD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAOnE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,0CAA0C,CAAC;AAYvE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAe3D;;GAEG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE;IAChC,QAAQ,EAAE;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,GAAG;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;IAChD,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,iBAAiB,CAAC;IAC1B,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,EAAE,cAAc,CAAC;IACvB,KAAK,EAAE,KAAK,GAAG,SAAS,CAAC;IACzB,IAAI,EAAE,SAAS,GAAG,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,kDA2UA"}

package/dist/types/stories/ConnectEmbed.stories.d.ts

@@ -8,5 +8,8 @@ export declare function WideModal(): import("react/jsx-runtime").JSX.Element;
 export declare function ClassNameAndStylesAdded(): import("react/jsx-runtime").JSX.Element;
 export declare function WideModalAndClassNameAndStylesAdded(): import("react/jsx-runtime").JSX.Element;
 export declare function AllInAppWalletAuthMethods(): import("react/jsx-runtime").JSX.Element;
+export declare function ConfiguredInAppWalletWideModal(): import("react/jsx-runtime").JSX.Element;
+export declare function GoogleLoginWideModal(): import("react/jsx-runtime").JSX.Element;
+export declare function GithubLoginWideModal(): import("react/jsx-runtime").JSX.Element;
 export declare function EcosystemWallet(): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ConnectEmbed.stories.d.ts.map

package/dist/types/stories/ConnectEmbed.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConnectEmbed.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/ConnectEmbed.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAE7C,OAAO,EAAE,YAAY,EAAE,MAAM,qDAAqD,CAAC;AAKnF,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,YAAY,CAoBnC,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,wBAAgB,UAAU,4CAEzB;AAED,wBAAgB,MAAM,4CAUrB;AAED,wBAAgB,SAAS,4CAExB;AAED,wBAAgB,uBAAuB,4CAUtC;AAED,wBAAgB,mCAAmC,4CAWlD;AAED,wBAAgB,yBAAyB,4CAmCxC;AAED,wBAAgB,eAAe,4CAa9B"}
+{"version":3,"file":"ConnectEmbed.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/ConnectEmbed.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAE7C,OAAO,EAAE,YAAY,EAAE,MAAM,qDAAqD,CAAC;AAMnF,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,YAAY,CAoBnC,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,wBAAgB,UAAU,4CAEzB;AAED,wBAAgB,MAAM,4CAUrB;AAED,wBAAgB,SAAS,4CAExB;AAED,wBAAgB,uBAAuB,4CAUtC;AAED,wBAAgB,mCAAmC,4CAWlD;AAED,wBAAgB,yBAAyB,4CAmCxC;AAED,wBAAgB,8BAA8B,4CAgB7C;AAED,wBAAgB,oBAAoB,4CAgBnC;AAED,wBAAgB,oBAAoB,4CAgBnC;AAED,wBAAgB,eAAe,4CAa9B"}

package/dist/types/stories/in-app-wallet-icon.stories.d.ts

@@ -0,0 +1,10 @@
+import type { Meta } from "@storybook/react";
+import type { AuthOption } from "../wallets/types.js";
+declare const meta: Meta<typeof Variant>;
+export default meta;
+export declare function LightTheme(): import("react/jsx-runtime").JSX.Element;
+export declare function DarkTheme(): import("react/jsx-runtime").JSX.Element;
+declare function Variant(props: {
+    authOptions: AuthOption[];
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=in-app-wallet-icon.stories.d.ts.map

package/dist/types/stories/in-app-wallet-icon.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"in-app-wallet-icon.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/in-app-wallet-icon.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAQ7C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAGtD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,OAAO,CAW9B,CAAC;AACF,eAAe,IAAI,CAAC;AAuGpB,wBAAgB,UAAU,4CAEzB;AAED,wBAAgB,SAAS,4CAExB;AAUD,iBAAS,OAAO,CAAC,KAAK,EAAE;IAAE,WAAW,EAAE,UAAU,EAAE,CAAA;CAAE,2CAWpD"}

package/dist/types/version.d.ts

@@ -1,2 +1,2 @@
-export declare const version = "5.116.1";
+export declare const version = "5.116.2-nightly-151127d66825365cb0ed949ae28b9906ee4dfc8d-20251214000442";
 //# sourceMappingURL=version.d.ts.map

package/dist/types/version.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"version.d.ts","sourceRoot":"","sources":["../../src/version.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO,YAAY,CAAC"}
+{"version":3,"file":"version.d.ts","sourceRoot":"","sources":["../../src/version.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO,4EAA4E,CAAC"}

package/dist/types/wallets/in-app/web/lib/auth/otp.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"otp.d.ts","sourceRoot":"","sources":["../../../../../../../src/wallets/in-app/web/lib/auth/otp.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAC;AAMtE,OAAO,KAAK,EACV,mCAAmC,EACnC,qBAAqB,EACrB,eAAe,EAChB,MAAM,uCAAuC,CAAC;AAC/C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAC;AAE/D;;GAEG;AACH,eAAO,MAAM,OAAO,GAAU,MAAM,eAAe,KAAG,OAAO,CAAC,IAAI,CAyCjE,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,SAAS,GACpB,MAAM,qBAAqB,GAAG;IAC5B,MAAM,EAAE,cAAc,CAAC;IACvB,SAAS,CAAC,EAAE,SAAS,CAAC;CACvB,KACA,OAAO,CAAC,mCAAmC,CA+C7C,CAAC"}
+{"version":3,"file":"otp.d.ts","sourceRoot":"","sources":["../../../../../../../src/wallets/in-app/web/lib/auth/otp.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAC;AAMtE,OAAO,KAAK,EACV,mCAAmC,EACnC,qBAAqB,EACrB,eAAe,EAChB,MAAM,uCAAuC,CAAC;AAC/C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAC;AAE/D;;GAEG;AACH,eAAO,MAAM,OAAO,GAAU,MAAM,eAAe,KAAG,OAAO,CAAC,IAAI,CAmDjE,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,SAAS,GACpB,MAAM,qBAAqB,GAAG;IAC5B,MAAM,EAAE,cAAc,CAAC;IACvB,SAAS,CAAC,EAAE,SAAS,CAAC;CACvB,KACA,OAAO,CAAC,mCAAmC,CA+C7C,CAAC"}

package/package.json

@@ -399,7 +399,7 @@
     }
   },
   "typings": "./dist/types/exports/thirdweb.d.ts",
-  "version": "5.116.1",
+  "version": "5.116.2-nightly-151127d66825365cb0ed949ae28b9906ee4dfc8d-20251214000442",
   "scripts": {
     "bench": "vitest -c ./test/vitest.config.ts bench",
     "bench:compare": "bun run ./benchmarks/run.ts",

package/src/react/web/ui/Bridge/swap-widget/swap-ui.tsx

@@ -6,8 +6,10 @@ import { Buy, Sell } from "../../../../../bridge/index.js";
 import type { prepare as SellPrepare } from "../../../../../bridge/Sell.js";
 import type { TokenWithPrices } from "../../../../../bridge/types/Token.js";
 import type { ThirdwebClient } from "../../../../../client/client.js";
+import { NATIVE_TOKEN_ADDRESS } from "../../../../../constants/addresses.js";
 import { getToken } from "../../../../../pay/convert/get-token.js";
 import type { SupportedFiatCurrency } from "../../../../../pay/convert/type.js";
+import { getAddress } from "../../../../../utils/address.js";
 import { toTokens, toUnits } from "../../../../../utils/units.js";
 import { useCustomTheme } from "../../../../core/design-system/CustomThemeProvider.js";
 import {
@@ -245,6 +247,18 @@ export function SwapUI(props: SwapUIProps) {
               ) {
                 props.setSellToken(undefined);
               }
+
+              // if sell token is not selected, set it as native token of the buy token's chain if buy token is not a native token itself
+              if (
+                !props.sellToken &&
+                token.tokenAddress.toLowerCase() !==
+                  NATIVE_TOKEN_ADDRESS.toLowerCase()
+              ) {
+                props.setSellToken({
+                  tokenAddress: getAddress(NATIVE_TOKEN_ADDRESS),
+                  chainId: token.chainId,
+                });
+              }
             }}
           />
         )}
@@ -270,6 +284,18 @@ export function SwapUI(props: SwapUIProps) {
               ) {
                 props.setBuyToken(undefined);
               }
+
+              // if buy token is not selected, set it as native token of the sell token's chain if sell token is not a native token itself
+              if (
+                !props.buyToken &&
+                token.tokenAddress.toLowerCase() !==
+                  NATIVE_TOKEN_ADDRESS.toLowerCase()
+              ) {
+                props.setBuyToken({
+                  tokenAddress: getAddress(NATIVE_TOKEN_ADDRESS),
+                  chainId: token.chainId,
+                });
+              }
             }}
             activeWalletInfo={props.activeWalletInfo}
           />

package/src/react/web/ui/Bridge/swap-widget/use-bridge-chains.ts

@@ -5,8 +5,25 @@ import type { ThirdwebClient } from "../../../../../client/client.js";
 export function useBridgeChains(client: ThirdwebClient) {
   return useQuery({
     queryKey: ["bridge-chains"],
-    queryFn: () => {
-      return chains({ client });
+    queryFn: async () => {
+      const data = await chains({ client });
+      const dataCopy = [...data];
+      // sort by name, but if name starts with number, put it at the end
+
+      return dataCopy.sort((a, b) => {
+        const aStartsWithNumber = a.name[0]?.match(/^\d/);
+        const bStartsWithNumber = b.name[0]?.match(/^\d/);
+
+        if (aStartsWithNumber && !bStartsWithNumber) {
+          return 1;
+        }
+
+        if (!aStartsWithNumber && bStartsWithNumber) {
+          return -1;
+        }
+
+        return a.name.localeCompare(b.name);
+      });
     },
     refetchOnMount: false,
     refetchOnWindowFocus: false,

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

@@ -17,6 +17,7 @@ import { Skeleton } from "../components/Skeleton.js";
 import { Text } from "../components/text.js";
 import { WalletImage } from "../components/WalletImage.js";
 import { StyledButton } from "../design-system/elements.js";
+import { InAppWalletIcon } from "./in-app-wallet-icon.js";
 import type { ConnectLocale } from "./locale/types.js";
 
 /**
@@ -52,9 +53,20 @@ export function WalletEntryButton(props: {
     wallet && walletId === "inApp"
       ? (wallet.getConfig() as InAppWalletCreationOptions)?.metadata
       : undefined;
-  const nameOverride = customMeta?.name || walletName;
+  let nameOverride = customMeta?.name || walletName;
   const iconOverride = customMeta?.icon;
 
+  // change "Social Login" to name of the login method if only 1 method is enabled
+  if (wallet.id === "inApp") {
+    const config = wallet.getConfig() as InAppWalletCreationOptions;
+    if (config?.auth?.options.length === 1) {
+      const name = config.auth?.options[0];
+      if (name) {
+        nameOverride = uppercaseFirstLetter({ text: name });
+      }
+    }
+  }
+
   return (
     <WalletButtonEl
       className={props.className}
@@ -64,12 +76,17 @@ export function WalletEntryButton(props: {
     >
       {iconOverride ? (
         <Img
-          alt={nameOverride}
+          alt=""
           client={props.client}
           height={`${iconSize.xl}`}
           src={iconOverride}
           width={`${iconSize.xl}`}
         />
+      ) : wallet.id === "inApp" ? (
+        <InAppWalletIcon
+          client={props.client}
+          wallet={wallet as Wallet<"inApp">}
+        />
       ) : (
         <WalletImage client={props.client} id={walletId} size={iconSize.xl} />
       )}
@@ -119,3 +136,7 @@ export const WalletButtonEl = /* @__PURE__ */ StyledButton((_) => {
     width: "100%",
   };
 });
+
+function uppercaseFirstLetter(props: { text: string }) {
+  return props.text.charAt(0).toUpperCase() + props.text.slice(1);
+}

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

@@ -1,30 +1,23 @@
 import type { IconFC } from "./types.js";
 
-/**
- * @internal
- */
 export const EmailIcon: IconFC = (props) => {
   return (
     <svg
-      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      width={props.size}
       height={props.size}
+      viewBox="0 0 24 24"
       role="presentation"
-      viewBox="0 0 16 16"
-      width={props.size}
-      xmlns="http://www.w3.org/2000/svg"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      className="lucide lucide-mail-icon lucide-mail"
+      style={{ color: props.color }}
     >
-      <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"
-      />
+      <path d="m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7" />
+      <rect x="2" y="4" width="20" height="16" rx="2" />
     </svg>
   );
 };

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

@@ -11,6 +11,7 @@ export const WalletDotIcon: IconFC = (props) => {
       viewBox="0 0 18 18"
       width={props.size}
       height={props.size}
+      style={{ color: props.color }}
       role="presentation"
     >
       <path

package/src/react/web/ui/ConnectWallet/in-app-wallet-icon.tsx

@@ -0,0 +1,195 @@
+"use client";
+import type { ThirdwebClient } from "../../../../client/client.js";
+import type { Wallet } from "../../../../wallets/interfaces/wallet.js";
+import type { AuthOption } from "../../../../wallets/types.js";
+import { useCustomTheme } from "../../../core/design-system/CustomThemeProvider.js";
+import {
+  iconSize,
+  radius,
+  spacing,
+} from "../../../core/design-system/index.js";
+import { socialIcons } from "../../../core/utils/walletIcon.js";
+import { defaultAuthOptions } from "../../wallets/shared/ConnectWalletSocialOptions.js";
+import { Img } from "../components/Img.js";
+import { EmailIcon } from "./icons/EmailIcon.js";
+import { FingerPrintIcon } from "./icons/FingerPrintIcon.js";
+import { GuestIcon } from "./icons/GuestIcon.js";
+import { PhoneIcon } from "./icons/PhoneIcon.js";
+
+export function InAppWalletIcon(props: {
+  client: ThirdwebClient;
+  wallet: Wallet<"inApp">;
+}) {
+  const enabledAuthMethods = (
+    props.wallet.getConfig()?.auth?.options || defaultAuthOptions
+  )
+    .slice() // clone
+    .sort((a, b) => {
+      if (a in socialIcons && !(b in socialIcons)) {
+        return -1;
+      }
+      if (!(a in socialIcons) && b in socialIcons) {
+        return 1;
+      }
+      return 0;
+    });
+
+  const theme = useCustomTheme();
+
+  const firstMethod = enabledAuthMethods[0];
+  const secondMethod = enabledAuthMethods[1];
+  const thirdMethod = enabledAuthMethods[2];
+  const fourthMethod = enabledAuthMethods[3];
+
+  const offset = "4px";
+  const offset2 = "6px";
+  const smallIconSize = "20";
+  const extraIconSize = "12";
+
+  if (firstMethod && secondMethod) {
+    return (
+      <div
+        style={{
+          width: `${iconSize.xl}px`,
+          height: `${iconSize.xl}px`,
+          position: "relative",
+          gap: spacing["3xs"],
+          border: `1px solid ${theme.colors.borderColor}`,
+          borderRadius: radius.md,
+          backgroundColor: theme.colors.tertiaryBg,
+        }}
+      >
+        <div
+          style={{
+            position: "absolute",
+            top: offset,
+            left: offset,
+            display: "flex",
+          }}
+        >
+          <AuthOptionIcon
+            authOption={firstMethod}
+            client={props.client}
+            size={smallIconSize}
+          />
+        </div>
+
+        <div
+          style={{
+            position: "absolute",
+            bottom: offset,
+            right: offset,
+            display: "flex",
+          }}
+        >
+          <AuthOptionIcon
+            authOption={secondMethod}
+            client={props.client}
+            size={smallIconSize}
+          />
+        </div>
+
+        <div>
+          {thirdMethod && (
+            <div
+              style={{
+                position: "absolute",
+                top: offset2,
+                right: offset2,
+                display: "flex",
+              }}
+            >
+              <AuthOptionIcon
+                authOption={thirdMethod}
+                client={props.client}
+                size={extraIconSize}
+              />
+            </div>
+          )}
+
+          {fourthMethod && (
+            <div
+              style={{
+                position: "absolute",
+                bottom: offset2,
+                left: offset2,
+                display: "flex",
+              }}
+            >
+              <AuthOptionIcon
+                authOption={fourthMethod}
+                client={props.client}
+                size={extraIconSize}
+              />
+            </div>
+          )}
+        </div>
+      </div>
+    );
+  }
+
+  if (firstMethod) {
+    return (
+      <div
+        style={{
+          width: `${iconSize.xl}px`,
+          height: `${iconSize.xl}px`,
+          display: "flex",
+          justifyContent: "center",
+          alignItems: "center",
+          border: `1px solid ${theme.colors.borderColor}`,
+          borderRadius: radius.md,
+          backgroundColor: theme.colors.tertiaryBg,
+        }}
+      >
+        <AuthOptionIcon
+          authOption={firstMethod}
+          client={props.client}
+          key={firstMethod}
+          size={iconSize.lg}
+        />
+      </div>
+    );
+  }
+
+  return null;
+}
+
+function AuthOptionIcon(props: {
+  authOption: AuthOption;
+  client: ThirdwebClient;
+  size: string;
+}) {
+  const theme = useCustomTheme();
+  if (props.authOption in socialIcons) {
+    const icon = socialIcons[props.authOption as keyof typeof socialIcons];
+    return (
+      <Img
+        src={icon}
+        width={props.size}
+        height={props.size}
+        client={props.client}
+      />
+    );
+  }
+
+  if (props.authOption === "phone") {
+    return <PhoneIcon size={props.size} color={theme.colors.secondaryText} />;
+  }
+
+  if (props.authOption === "email") {
+    return <EmailIcon size={props.size} color={theme.colors.secondaryText} />;
+  }
+
+  if (props.authOption === "passkey") {
+    return (
+      <FingerPrintIcon size={props.size} color={theme.colors.secondaryText} />
+    );
+  }
+
+  if (props.authOption === "guest") {
+    return <GuestIcon size={props.size} color={theme.colors.secondaryText} />;
+  }
+
+  return null;
+}

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

@@ -3,7 +3,7 @@ import { keyframes } from "@emotion/react";
 import { useCustomTheme } from "../../../core/design-system/CustomThemeProvider.js";
 import type { Theme } from "../../../core/design-system/index.js";
 import { iconSize } from "../../../core/design-system/index.js";
-import { StyledCircle, StyledSvg } from "../design-system/elements.js";
+import { StyledSvg } from "../design-system/elements.js";
 
 /**
  * @internal
@@ -24,20 +24,25 @@ export const Spinner: React.FC<{
       viewBox="0 0 50 50"
       className="tw-spinner"
     >
-      <Circle
+      <circle
         cx="25"
         cy="25"
         fill="none"
         r="20"
+        style={{
+          strokeLinecap: "round",
+          animation: `tw-spinner-circle-dash 1.5s ease-in-out infinite`,
+        }}
         stroke={props.color ? theme.colors[props.color] : "currentColor"}
         strokeWidth={Number(iconSize[props.size]) > 64 ? "2" : "4"}
       />
+      <style>{dashAnimation}</style>
     </Svg>
   );
 };
-
 // animations
-const dashAnimation = keyframes`
+const dashAnimation = `
+@keyframes tw-spinner-circle-dash {
   0% {
     stroke-dasharray: 1, 150;
     stroke-dashoffset: 0;
@@ -63,8 +68,3 @@ const Svg = /* @__PURE__ */ StyledSvg({
   height: "1em",
   width: "1em",
 });
-
-const Circle = /* @__PURE__ */ StyledCircle({
-  animation: `${dashAnimation} 1.5s ease-in-out infinite`,
-  strokeLinecap: "round",
-});

package/src/react/web/ui/design-system/elements.ts

@@ -2,7 +2,6 @@ import styled from "@emotion/styled";
 
 export const StyledDiv = /* @__PURE__ */ styled.div;
 export const StyledSvg = /* @__PURE__ */ styled.svg;
-export const StyledCircle = /* @__PURE__ */ styled.circle;
 export const StyledSpan = /* @__PURE__ */ styled.span;
 export const StyledAnchor = /* @__PURE__ */ styled.a;
 export const StyledButton = /* @__PURE__ */ styled.button;

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

@@ -61,7 +61,7 @@ export type ConnectWalletSelectUIState =
       };
     };
 
-const defaultAuthOptions: AuthOption[] = [
+export const defaultAuthOptions: AuthOption[] = [
   "email",
   "phone",
   "google",