setup/configure @metamask/connect root package + repoint playgrounds (ex node playground) to @metamask/connect (#70)

adonesky1 · jiexi · web-flow · commit c03337d6ad4f · 2025-12-08T14:36:39.000-06:00
* setup/configure @metamask/connect root package

* re-point playgrounds to @metamask/connect

* changelog entry

* one small revert

* Update CHANGELOG.md

Co-authored-by: jiexi &lt;jiexiluan@gmail.com&gt;

* revert to use the root for multichain

* fix changelog

---------

Co-authored-by: jiexi &lt;jiexiluan@gmail.com&gt;
diff --git a/packages/connect/CHANGELOG.md b/packages/connect/CHANGELOG.md
@@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+### Added
+
+- Added subpath exports to `@metamask/connect` package: `@metamask/connect/evm` - unified export for EVM functionality
+
 ### Changed
 
 - Updated `description` in `package.json` ([#18](https://github.com/MetaMask/connect-monorepo/pull/18))
diff --git a/packages/connect/package.json b/packages/connect/package.json
@@ -36,6 +36,17 @@
       },
       "default": "./dist/multichain/index.js"
     },
+    "./evm": {
+      "import": {
+        "types": "./dist/evm/index.d.ts",
+        "default": "./dist/evm/index.mjs"
+      },
+      "require": {
+        "types": "./dist/evm/index.d.ts",
+        "default": "./dist/evm/index.js"
+      },
+      "default": "./dist/evm/index.js"
+    },
     "./package.json": "./package.json"
   },
   "main": "./dist/index.js",
@@ -45,7 +56,7 @@
     "dist/"
   ],
   "scripts": {
-    "build": "yarn clean && tsc -b --force tsconfig.build.json && npx tsup src/index.ts src/multichain/index.ts --format esm,cjs --external @metamask/connect-multichain",
+    "build": "yarn clean && tsc -b --force tsconfig.build.json && npx tsup src/index.ts src/multichain/index.ts src/evm/index.ts --format esm,cjs --external @metamask/connect-multichain --external @metamask/connect-evm",
     "build:docs": "typedoc",
     "changelog:format": "../../scripts/format-changelog.sh @metamask/connect",
     "changelog:update": "../../scripts/update-changelog.sh @metamask/connect",
@@ -58,6 +69,7 @@
     "test:verbose": "yarn test"
   },
   "dependencies": {
+    "@metamask/connect-evm": "workspace:^",
     "@metamask/connect-multichain": "workspace:^"
   },
   "devDependencies": {
diff --git a/packages/connect/src/evm/index.ts b/packages/connect/src/evm/index.ts
@@ -0,0 +1,2 @@
+export * from '@metamask/connect-evm';
+
diff --git a/packages/connect/tsconfig.build.json b/packages/connect/tsconfig.build.json
@@ -7,6 +7,7 @@
   },
   "include": ["./src"],
   "references": [
+    { "path": "../connect-evm/tsconfig.build.json" },
     { "path": "../connect-multichain/tsconfig.build.json" }
   ]
 }
diff --git a/packages/connect/tsconfig.json b/packages/connect/tsconfig.json
@@ -3,5 +3,9 @@
   "compilerOptions": {
     "baseUrl": "./"
   },
+  "references": [
+    { "path": "../connect-evm/tsconfig.build.json" },
+    { "path": "../connect-multichain/tsconfig.build.json" }
+  ],
   "include": ["./src"]
 }
diff --git a/playground/legacy-evm-react-vite-playground/README.md b/playground/legacy-evm-react-vite-playground/README.md
@@ -1,8 +1,8 @@
 # Legacy EVM React Vite Playground
 
-> A demo application showcasing `@metamask/connect-evm` integration in a React + Vite application.
+> A demo application showcasing `@metamask/connect/evm` integration in a React + Vite application.
 
-This playground demonstrates how to use `@metamask/connect-evm` in a React application with Vite. It provides working examples of all major features including connection, signing, transactions, and chain switching.
+This playground demonstrates how to use `@metamask/connect/evm` in a React application with Vite. It provides working examples of all major features including connection, signing, transactions, and chain switching.
 
 ## Features Demonstrated
 
@@ -98,7 +98,7 @@ legacy-evm-react-vite-playground/
 - **React 18** - UI framework
 - **Vite** - Build tool and dev server
 - **TypeScript** - Type safety
-- **@metamask/connect-evm** - MetaMask connection SDK
+- **@metamask/connect/evm** - MetaMask connection SDK
 
 ## Troubleshooting
 
@@ -116,7 +116,7 @@ legacy-evm-react-vite-playground/
 
 ## Learn More
 
-- [@metamask/connect-evm Documentation](../../packages/connect-evm/README.md)
+- [@metamask/connect/evm Documentation](../../packages/connect-evm/README.md)
 - [MetaMask Documentation](https://docs.metamask.io)
 - [EIP-1193 Specification](https://eips.ethereum.org/EIPS/eip-1193)
 
diff --git a/playground/legacy-evm-react-vite-playground/package.json b/playground/legacy-evm-react-vite-playground/package.json
@@ -12,7 +12,7 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "@metamask/connect-evm": "workspace:^",
+    "@metamask/connect": "workspace:^",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "vite-plugin-node-polyfills": "^0.24.0"
diff --git a/playground/legacy-evm-react-vite-playground/src/App.tsx b/playground/legacy-evm-react-vite-playground/src/App.tsx
@@ -2,10 +2,10 @@ import { useEffect, useState } from 'react';
 import {
   MetamaskConnectEVM,
   createMetamaskConnectEVM,
-} from '@metamask/connect-evm';
+} from '@metamask/connect/evm';
 import './App.css';
 import { send_eth_signTypedData_v4, send_personal_sign } from './SignHelpers';
-import type { EIP1193Provider } from '@metamask/connect-evm';
+import type { EIP1193Provider } from '@metamask/connect/evm';
 import { getInfuraRpcUrls } from '@metamask/connect-multichain';
 
 function useSDK() {
diff --git a/playground/legacy-evm-react-vite-playground/src/SignHelpers.ts b/playground/legacy-evm-react-vite-playground/src/SignHelpers.ts
@@ -1,4 +1,4 @@
-import { EIP1193Provider } from '@metamask/connect-evm';
+import { EIP1193Provider } from '@metamask/connect/evm';
 import { Buffer } from 'buffer';
 
 export const send_eth_signTypedData_v4 = async (
diff --git a/playground/multichain-react-playground/package.json b/playground/multichain-react-playground/package.json
@@ -51,7 +51,7 @@
     "@metamask/utils": "^11.8.1"
   },
   "dependencies": {
-    "@metamask/connect-multichain": "workspace:^",
+    "@metamask/connect": "workspace:^",
     "@metamask/utils": "^11.8.1",
     "react": "^18.3.1",
     "react-dom": "^18.3.1"
@@ -108,8 +108,8 @@
       "@solana/web3.js>bigint-buffer": false,
       "@solana/web3.js>rpc-websockets>bufferutil": false,
       "@solana/web3.js>rpc-websockets>utf-8-validate": false,
-      "@metamask/connect-multichain>@metamask/mobile-wallet-protocol-dapp-client>@metamask/mobile-wallet-protocol-core>centrifuge>protobufjs": false,
-      "@metamask/connect-multichain>@metamask/mobile-wallet-protocol-core>centrifuge>protobufjs": false
+      "@metamask/connect>@metamask/mobile-wallet-protocol-dapp-client>@metamask/mobile-wallet-protocol-core>centrifuge>protobufjs": false,
+      "@metamask/connect>@metamask/mobile-wallet-protocol-core>centrifuge>protobufjs": false
     }
   }
 }
diff --git a/playground/multichain-react-playground/src/App.tsx b/playground/multichain-react-playground/src/App.tsx
@@ -1,5 +1,5 @@
 import { useState, useEffect, useCallback } from 'react';
-import type { Scope, SessionData } from '@metamask/connect-multichain';
+import type { Scope, SessionData } from '@metamask/connect';
 import type { CaipAccountId } from '@metamask/utils';
 import { useSDK } from './sdk';
 import DynamicInputs, { INPUT_LABEL_TYPE } from './components/DynamicInputs';
diff --git a/playground/multichain-react-playground/src/components/FeaturedNetworks.tsx b/playground/multichain-react-playground/src/components/FeaturedNetworks.tsx
@@ -1,5 +1,5 @@
 /* eslint-disable */
-import type { Scope } from '@metamask/connect-multichain';
+import type { Scope } from '@metamask/connect';
 // biome-ignore lint/style/useImportType: ok
 import React from 'react';
 
diff --git a/playground/multichain-react-playground/src/components/ScopeCard.tsx b/playground/multichain-react-playground/src/components/ScopeCard.tsx
@@ -1,5 +1,5 @@
 import MetaMaskOpenRPCDocument from '@metamask/api-specs';
-import type { Scope, SessionData } from '@metamask/connect-multichain';
+import type { Scope, SessionData } from '@metamask/connect';
 import {
   type CaipAccountAddress,
   type CaipAccountId,
diff --git a/playground/multichain-react-playground/src/sdk/SDKProvider.tsx b/playground/multichain-react-playground/src/sdk/SDKProvider.tsx
@@ -8,7 +8,7 @@ import {
   type Scope,
   type SDKState,
   type SessionData,
-} from '@metamask/connect-multichain';
+} from '@metamask/connect';
 import type { CaipAccountId } from '@metamask/utils';
 import type React from 'react';
 import {
diff --git a/yarn.lock b/yarn.lock
@@ -4077,11 +4077,12 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@metamask/connect@workspace:packages/connect":
+"@metamask/connect@workspace:^, @metamask/connect@workspace:packages/connect":
   version: 0.0.0-use.local
   resolution: "@metamask/connect@workspace:packages/connect"
   dependencies:
     "@metamask/auto-changelog": "npm:^3.4.4"
+    "@metamask/connect-evm": "workspace:^"
     "@metamask/connect-multichain": "workspace:^"
     "@types/jest": "npm:^29.5.14"
     deepmerge: "npm:^4.2.2"
@@ -4546,7 +4547,7 @@ __metadata:
     "@lavamoat/preinstall-always-fail": "npm:^2.0.0"
     "@metamask/api-specs": "npm:^0.14.0"
     "@metamask/auto-changelog": "npm:^3.4.4"
-    "@metamask/connect-multichain": "workspace:^"
+    "@metamask/connect": "workspace:^"
     "@metamask/utils": "npm:^11.8.1"
     "@open-rpc/meta-schema": "npm:^1.14.9"
     "@open-rpc/schema-utils-js": "npm:^2.0.5"
@@ -20099,7 +20100,7 @@ __metadata:
   resolution: "legacy-evm-react-vite@workspace:playground/legacy-evm-react-vite-playground"
   dependencies:
     "@eslint/js": "npm:^9.13.0"
-    "@metamask/connect-evm": "workspace:^"
+    "@metamask/connect": "workspace:^"
     "@types/react": "npm:^18.3.1"
     "@types/react-dom": "npm:^18.3.1"
     "@vitejs/plugin-react": "npm:^4.3.3"

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,2 @@`
	`1`	`+export * from '@metamask/connect-evm';`
	`2`	`+`
Original file line number	Diff line number	Diff line change
`@@ -7,6 +7,7 @@`
`7`	`7`	`},`
`8`	`8`	`"include": ["./src"],`
`9`	`9`	`"references": [`
	`10`	`+ { "path": "../connect-evm/tsconfig.build.json" },`
`10`	`11`	`{ "path": "../connect-multichain/tsconfig.build.json" }`
`11`	`12`	`]`
`12`	`13`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-import { EIP1193Provider } from '@metamask/connect-evm';`
	`1`	`+import { EIP1193Provider } from '@metamask/connect/evm';`
`2`	`2`	`import { Buffer } from 'buffer';`
`3`	`3`
`4`	`4`	`export const send_eth_signTypedData_v4 = async (`
Original file line number	Diff line number	Diff line change
`@@ -51,7 +51,7 @@`
`51`	`51`	`"@metamask/utils": "^11.8.1"`
`52`	`52`	`},`
`53`	`53`	`"dependencies": {`
`54`		`- "@metamask/connect-multichain": "workspace:^",`
	`54`	`+ "@metamask/connect": "workspace:^",`
`55`	`55`	`"@metamask/utils": "^11.8.1",`
`56`	`56`	`"react": "^18.3.1",`
`57`	`57`	`"react-dom": "^18.3.1"`
`@@ -108,8 +108,8 @@`
`108`	`108`	`"@solana/web3.js>bigint-buffer": false,`
`109`	`109`	`"@solana/web3.js>rpc-websockets>bufferutil": false,`
`110`	`110`	`"@solana/web3.js>rpc-websockets>utf-8-validate": false,`
`111`		`- "@metamask/connect-multichain>@metamask/mobile-wallet-protocol-dapp-client>@metamask/mobile-wallet-protocol-core>centrifuge>protobufjs": false,`
`112`		`- "@metamask/connect-multichain>@metamask/mobile-wallet-protocol-core>centrifuge>protobufjs": false`
	`111`	`+ "@metamask/connect>@metamask/mobile-wallet-protocol-dapp-client>@metamask/mobile-wallet-protocol-core>centrifuge>protobufjs": false,`
	`112`	`+ "@metamask/connect>@metamask/mobile-wallet-protocol-core>centrifuge>protobufjs": false`
`113`	`113`	`}`
`114`	`114`	`}`
`115`	`115`	`}`