Version Packages (#2996)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

legacy_packages/auth/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @thirdweb-dev/auth
 
+## 4.1.78
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @thirdweb-dev/wallets@2.5.20
+
 ## 4.1.77
 
 ### Patch Changes

legacy_packages/auth/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thirdweb-dev/auth",
-  "version": "4.1.77",
+  "version": "4.1.78",
   "main": "dist/thirdweb-dev-auth.cjs.js",
   "module": "dist/thirdweb-dev-auth.esm.js",
   "browser": {

legacy_packages/cli/CHANGELOG.md

@@ -1,5 +1,14 @@
 # thirdweb
 
+## 0.13.86
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @thirdweb-dev/sdk@4.0.80
+  - @thirdweb-dev/wallets@2.5.20
+  - @thirdweb-dev/auth@4.1.78
+
 ## 0.13.85
 
 ### Patch Changes

legacy_packages/cli/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@thirdweb-dev/cli",
   "main": "dist/cli/index.js",
-  "version": "0.13.85",
+  "version": "0.13.86",
   "repository": "https://github.com/thirdweb-dev/js/tree/main/legacy_packages/cli",
   "author": "thirdweb eng <[email protected]>",
   "license": "Apache-2.0",

legacy_packages/react-core/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @thirdweb-dev/react-core
 
+## 4.6.19
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @thirdweb-dev/sdk@4.0.80
+  - @thirdweb-dev/wallets@2.5.20
+  - @thirdweb-dev/auth@4.1.78
+
 ## 4.6.18
 
 ### Patch Changes

legacy_packages/react-core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thirdweb-dev/react-core",
-  "version": "4.6.18",
+  "version": "4.6.19",
   "repository": "https://github.com/thirdweb-dev/js/tree/main/legacy_packages/react-core",
   "author": "thirdweb eng <[email protected]>",
   "license": "Apache-2.0",

legacy_packages/react/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @thirdweb-dev/react
 
+## 4.6.19
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @thirdweb-dev/sdk@4.0.80
+  - @thirdweb-dev/react-core@4.6.19
+  - @thirdweb-dev/wallets@2.5.20
+
 ## 4.6.18
 
 ### Patch Changes

legacy_packages/react/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thirdweb-dev/react",
-  "version": "4.6.18",
+  "version": "4.6.19",
   "repository": "https://github.com/thirdweb-dev/js/tree/main/legacy_packages/react",
   "author": "thirdweb eng <[email protected]>",
   "license": "Apache-2.0",

legacy_packages/sdk/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @thirdweb-dev/sdk
 
+## 4.0.80
+
+### Patch Changes
+
+- Updated dependencies [[`0ab1407`](https://github.com/thirdweb-dev/js/commit/0ab14075d37aec27167c5885155f48ea880c9574), [`523cd1e`](https://github.com/thirdweb-dev/js/commit/523cd1e16fd1194ffbf8970150ed6f09d4e01fe9), [`cf7b6fc`](https://github.com/thirdweb-dev/js/commit/cf7b6fc7bc1686f3b4c54515d569d799d5e3ceea)]:
+  - thirdweb@5.19.0
+
 ## 4.0.79
 
 ### Patch Changes

legacy_packages/sdk/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thirdweb-dev/sdk",
-  "version": "4.0.79",
+  "version": "4.0.80",
   "description": "The main thirdweb SDK.",
   "repository": "https://github.com/thirdweb-dev/js/tree/main/legacy_packages/sdk",
   "license": "Apache-2.0",

legacy_packages/unity-js-bridge/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @thirdweb-dev/unity-js-bridge
 
+## 0.6.29
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @thirdweb-dev/sdk@4.0.80
+  - @thirdweb-dev/wallets@2.5.20
+  - @thirdweb-dev/auth@4.1.78
+
 ## 0.6.28
 
 ### Patch Changes

legacy_packages/unity-js-bridge/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thirdweb-dev/unity-js-bridge",
-  "version": "0.6.28",
+  "version": "0.6.29",
   "main": "dist/thirdweb-unity-bridge.js",
   "repository": "https://github.com/thirdweb-dev/js/tree/main/packages/unity-js-bridge",
   "license": "Apache-2.0",

legacy_packages/wallets/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @thirdweb-dev/wallets
 
+## 2.5.20
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @thirdweb-dev/sdk@4.0.80
+
 ## 2.5.19
 
 ### Patch Changes

legacy_packages/wallets/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thirdweb-dev/wallets",
-  "version": "2.5.19",
+  "version": "2.5.20",
   "main": "dist/thirdweb-dev-wallets.cjs.js",
   "module": "dist/thirdweb-dev-wallets.esm.js",
   "browser": {

packages/thirdweb/CHANGELOG.md

@@ -1,5 +1,17 @@
 # thirdweb
 
+## 5.19.0
+
+### Minor Changes
+
+- [#2995](https://github.com/thirdweb-dev/js/pull/2995) [`523cd1e`](https://github.com/thirdweb-dev/js/commit/523cd1e16fd1194ffbf8970150ed6f09d4e01fe9) Thanks [@gregfromstl](https://github.com/gregfromstl)! - Adds shortenAddress util
+
+- [#2997](https://github.com/thirdweb-dev/js/pull/2997) [`cf7b6fc`](https://github.com/thirdweb-dev/js/commit/cf7b6fc7bc1686f3b4c54515d569d799d5e3ceea) Thanks [@joaquim-verges](https://github.com/joaquim-verges)! - added `createWalletAdapter` helper for interop with diff libraries
+
+### Patch Changes
+
+- [#3000](https://github.com/thirdweb-dev/js/pull/3000) [`0ab1407`](https://github.com/thirdweb-dev/js/commit/0ab14075d37aec27167c5885155f48ea880c9574) Thanks [@MananTank](https://github.com/MananTank)! - Fix WalletImage fallback icon
+
 ## 5.18.1
 
 ### Patch Changes

packages/thirdweb/package.json

@@ -1,6 +1,6 @@
 {
   "name": "thirdweb",
-  "version": "5.18.1",
+  "version": "5.19.0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/thirdweb-dev/js.git#main"

packages/thirdweb/src/adapters/wallet-adapter.ts

@@ -0,0 +1,49 @@
+import type { Chain } from "../chains/types.js";
+import type { ThirdwebClient } from "../client/client.js";
+import type { Account, Wallet } from "../wallets/interfaces/wallet.js";
+import { createWalletEmitter } from "../wallets/wallet-emitter.js";
+
+export type AdapterWalletOptions = {
+  client: ThirdwebClient;
+  adaptedAccount: Account;
+  chain: Chain;
+  onDisconnect: () => Promise<void> | void;
+  switchChain: (chain: Chain) => Promise<void> | void;
+};
+
+export function createWalletAdapter(
+  options: AdapterWalletOptions,
+): Wallet<"adapter"> {
+  const emitter = createWalletEmitter<"adapter">();
+  let _chain = options.chain;
+  return {
+    id: "adapter",
+    subscribe: emitter.subscribe,
+    connect: async () => {
+      emitter.emit("onConnect", options);
+      return options.adaptedAccount;
+    },
+    autoConnect: async () => {
+      emitter.emit("onConnect", options);
+      return options.adaptedAccount;
+    },
+    disconnect: async () => {
+      await options.onDisconnect();
+      emitter.emit("disconnect", undefined);
+    },
+    getAccount() {
+      return options.adaptedAccount;
+    },
+    getChain() {
+      return _chain;
+    },
+    getConfig() {
+      return options;
+    },
+    switchChain: async (chain) => {
+      await options.switchChain(chain);
+      _chain = chain;
+      emitter.emit("chainChanged", chain);
+    },
+  };
+}

packages/thirdweb/src/exports/utils.ts

@@ -124,6 +124,7 @@ export {
   checksumAddress,
   getAddress,
   isAddress,
+  shortenAddress,
   type Address,
   type AddressInput,
 } from "../utils/address.js";

packages/thirdweb/src/exports/wallets.ts

@@ -96,3 +96,5 @@ export type {
 
 export { getAllWalletsList } from "../wallets/getAllWalletsList.js";
 export { getWalletInfo } from "../wallets/__generated__/getWalletInfo.js";
+
+export { createWalletAdapter } from "../adapters/wallet-adapter.js";

packages/thirdweb/src/react/web/ui/ConnectWallet/icons/dataUris.ts

@@ -12,3 +12,6 @@ export const smartWalletIcon =
 
 export const genericTokenIcon =
   "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzQwNDhfNDIzMSkiPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTcuNTg0IDQuODU1NjZDNy43MTA2OSA0Ljc4MjUyIDcuODU0MzkgNC43NDQwMiA4LjAwMDY3IDQuNzQ0MDJDOC4xNDY5NSA0Ljc0NDAyIDguMjkwNjUgNC43ODI1MiA4LjQxNzM0IDQuODU1NjZMMTAuNTE1MyA2LjA2NjY2QzEwLjY0MiA2LjEzOTggMTAuNzQ3MiA2LjI0NSAxMC44MjA0IDYuMzcxNjhDMTAuODkzNSA2LjQ5ODM1IDEwLjkzMiA2LjY0MjA1IDEwLjkzMiA2Ljc4ODMzVjkuMjExQzEwLjkzMiA5LjM1NzI3IDEwLjg5MzUgOS41MDA5NyAxMC44MjA0IDkuNjI3NjVDMTAuNzQ3MiA5Ljc1NDMzIDEwLjY0MiA5Ljg1OTUzIDEwLjUxNTMgOS45MzI2Nkw4LjQxNzM0IDExLjE0NEM4LjI5MDY1IDExLjIxNzEgOC4xNDY5NSAxMS4yNTU2IDguMDAwNjcgMTEuMjU1NkM3Ljg1NDM5IDExLjI1NTYgNy43MTA2OSAxMS4yMTcxIDcuNTg0IDExLjE0NEw1LjQ4NiA5LjkzMjY2QzUuMzU5MzIgOS44NTk1MyA1LjI1NDEzIDkuNzU0MzMgNS4xODA5OSA5LjYyNzY1QzUuMTA3ODUgOS41MDA5NyA1LjA2OTM0IDkuMzU3MjcgNS4wNjkzNCA5LjIxMVY2Ljc4ODY2QzUuMDY5MjggNi42NDIzMyA1LjEwNzc2IDYuNDk4NTYgNS4xODA5IDYuMzcxODJDNS4yNTQwNSA2LjI0NTA4IDUuMzU5MjcgNi4xMzk4MyA1LjQ4NiA2LjA2NjY2TDcuNTg0IDQuODU1NjZaTTguMDg0IDUuNDMzQzguMDU4NjcgNS40MTgzNyA4LjAyOTkzIDUuNDEwNjcgOC4wMDA2NyA1LjQxMDY3QzcuOTcxNDEgNS40MTA2NyA3Ljk0MjY3IDUuNDE4MzcgNy45MTczNCA1LjQzM0w1LjgxOTM0IDYuNjQ0MzNDNS43OTQgNi42NTg5NiA1Ljc3Mjk2IDYuNjggNS43NTgzMyA2LjcwNTMzQzUuNzQzNyA2LjczMDY3IDUuNzM2IDYuNzU5NDEgNS43MzYgNi43ODg2NlY5LjIxMTMzQzUuNzM2IDkuMjQwNTkgNS43NDM3IDkuMjY5MzMgNS43NTgzMyA5LjI5NDY2QzUuNzcyOTYgOS4zMiA1Ljc5NCA5LjM0MTA0IDUuODE5MzQgOS4zNTU2Nkw3LjkxNzM0IDEwLjU2NjdDNy45NDI2NyAxMC41ODEzIDcuOTcxNDEgMTAuNTg5IDguMDAwNjcgMTAuNTg5QzguMDI5OTMgMTAuNTg5IDguMDU4NjcgMTAuNTgxMyA4LjA4NCAxMC41NjY3TDEwLjE4MiA5LjM1NTMzQzEwLjIwNzMgOS4zNDA3IDEwLjIyODQgOS4zMTk2NiAxMC4yNDMgOS4yOTQzM0MxMC4yNTc2IDkuMjY4OTkgMTAuMjY1MyA5LjI0MDI1IDEwLjI2NTMgOS4yMTFWNi43ODg2NkMxMC4yNjUzIDYuNzU5NDEgMTAuMjU3NiA2LjczMDY3IDEwLjI0MyA2LjcwNTMzQzEwLjIyODQgNi42OCAxMC4yMDczIDYuNjU4OTYgMTAuMTgyIDYuNjQ0MzNMOC4wODQgNS40MzNaIiBmaWxsPSIjNUM1QzVDIi8+CjwvZz4KPGNpcmNsZSBjeD0iOCIgY3k9IjgiIHI9IjcuNjkyMzEiIHN0cm9rZT0iIzVDNUM1QyIgc3Ryb2tlLXdpZHRoPSIwLjYxNTM4NSIvPgo8Y2lyY2xlIGN4PSI3Ljk5OTU1IiBjeT0iOC4wMDAwNCIgcj0iNS44NDYxNSIgc3Ryb2tlPSIjNUM1QzVDIiBzdHJva2Utd2lkdGg9IjAuNjE1Mzg1Ii8+CjxkZWZzPgo8Y2xpcFBhdGggaWQ9ImNsaXAwXzQwNDhfNDIzMSI+CjxyZWN0IHdpZHRoPSI4IiBoZWlnaHQ9IjgiIGZpbGw9IndoaXRlIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0IDQpIi8+CjwvY2xpcFBhdGg+CjwvZGVmcz4KPC9zdmc+Cg==";
+
+export const genericWalletIcon =
+  "data:image/svg+xml;base64,PHN2ZwogICAgICB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgICAgIGZpbGw9Im5vbmUiCiAgICAgIHZpZXdCb3g9IjAgMCAxOCAxOCIKICAgICAgd2lkdGg9IjIwIgogICAgICBoZWlnaHQ9IjIwIgogICAgICByb2xlPSJwcmVzZW50YXRpb24iCiAgICA+CiAgICAgIDxwYXRoCiAgICAgICAgZmlsbD0iI2FhYSIKICAgICAgICBkPSJNMTUuNiA0LjZIMS44NXYtLjU1bDEyLjEtLjk2OHYuOTY4aDEuNjVWMi40YzAtMS4yMS0uOTgtMi4wNTktMi4xNzctMS44ODhMMi4zNzggMi4wODlDMS4xOCAyLjI2LjIgMy4zOS4yIDQuNnYxMWEyLjIgMi4yIDAgMDAyLjIgMi4yaDEzLjJhMi4yIDIuMiAwIDAwMi4yLTIuMlY2LjhhMi4yIDIuMiAwIDAwLTIuMi0yLjJ6bS0xLjY1IDcuNzA3YTEuNjUgMS42NSAwIDAxLS42My0zLjE3NiAxLjY1IDEuNjUgMCAxMS42MyAzLjE3NnoiCiAgICAgIC8+CiAgICA8L3N2Zz4=";

packages/thirdweb/src/react/web/ui/components/Img.tsx

@@ -27,7 +27,7 @@ export const Img: React.FC<{
   const widthPx = `${props.width}px`;
   const heightPx = `${props.height || props.width}px`;
 
-  if (!propSrc) {
+  if (propSrc === undefined) {
     return <Skeleton width={widthPx} height={heightPx} />;
   }
 

packages/thirdweb/src/react/web/ui/components/WalletImage.tsx

@@ -7,7 +7,11 @@ import type { WalletId } from "../../../../wallets/wallet-types.js";
 import { useActiveWallet } from "../../../core/hooks/wallets/wallet-hooks.js";
 import { getStorage } from "../../../core/storage.js";
 import { getLastAuthProvider } from "../../wallets/in-app/storage.js";
-import { emailIcon, phoneIcon } from "../ConnectWallet/icons/dataUris.js";
+import {
+  emailIcon,
+  genericWalletIcon,
+  phoneIcon,
+} from "../ConnectWallet/icons/dataUris.js";
 import {
   appleIconUri,
   facebookIconUri,
@@ -81,6 +85,7 @@ export function WalletImage(props: {
     return (
       <Img
         src={image}
+        fallbackImage={genericWalletIcon}
         width={props.size}
         height={props.size}
         loading="eager"
@@ -107,7 +112,8 @@ function WalletImageQuery(props: {
   return (
     <Img
       client={props.client}
-      src={walletImage.data}
+      src={walletImage.isLoading ? undefined : walletImage.data || ""}
+      fallbackImage={genericWalletIcon}
       width={props.size}
       height={props.size}
       loading="eager"

packages/thirdweb/src/utils/address.test.ts

@@ -1,6 +1,11 @@
 import { describe, expect, test } from "vitest";
 
-import { checksumAddress, getAddress, isAddress } from "./address.js";
+import {
+  checksumAddress,
+  getAddress,
+  isAddress,
+  shortenAddress,
+} from "./address.js";
 
 describe("getAddress", () => {
   test("checksums address", () => {
@@ -81,3 +86,11 @@ describe("checksumAddress", () => {
     ).toMatchInlineSnapshot('"0x15d34AAf54267DB7D7c367839AAf71A00a2C6A65"');
   });
 });
+
+describe("shortenAddress", () => {
+  test("shortens address", () => {
+    expect(
+      shortenAddress("0xa0cf798816d4b9b9866b5330eea46a18382f251e"),
+    ).toMatchInlineSnapshot('"0xA0...251e"');
+  });
+});

packages/thirdweb/src/utils/address.ts

@@ -95,3 +95,22 @@ export function getAddress(address: string): Address {
   }
   return checksumAddress(address);
 }
+
+/**
+ * Checksums and formats an address if valid. Note this function does not check if the provided address is an ENS.
+ * @param address - The address to shorten.
+ * @param length - The number of characters to keep from the start and end of the address.
+ * @returns The shortened address.
+ * @example
+ * ```ts
+ * import { shortenAddress } from 'thirdweb/utils';
+ *
+ * shortenAddress('0x5aAeb6053F3E94C9b9A09f33669435E7Ef1BeAed');
+ * //=> '0x5aAe...Ef1BeAed'
+ * ```
+ * @utils
+ */
+export function shortenAddress(address: Address, length = 4) {
+  const _address = getAddress(address);
+  return `${_address.slice(0, length)}...${_address.slice(-length)}`;
+}

packages/thirdweb/src/wallets/wallet-types.ts

@@ -1,3 +1,4 @@
+import type { AdapterWalletOptions } from "../adapters/wallet-adapter.js";
 import type { Chain } from "../chains/types.js";
 import type { ThirdwebClient } from "../client/client.js";
 import type {
@@ -28,6 +29,7 @@ export type WalletId =
   | "inApp"
   | "embedded" // deprecated
   | "smart"
+  | "adapter"
   | WCSupportedWalletIds
   | InjectedSupportedWalletIds;
 
@@ -116,7 +118,9 @@ export type WalletCreationOptions<T extends WalletId> = T extends "smart"
     ? InAppWalletCreationOptions
     : T extends typeof COINBASE
       ? CoinbaseWalletCreationOptions
-      : undefined;
+      : T extends "adapter"
+        ? AdapterWalletOptions
+        : undefined;
 
 /**
  * Generic type for getting the tuple type of arguments that the `createWallet` function takes.