From 284ff4526dfd63a2a27a2ad5c5eb25368a380116 Mon Sep 17 00:00:00 2001 From: 0xAsimetriq <3154053+0xAsimetriq@users.noreply.github.com> Date: Tue, 2 Jan 2024 16:58:46 +0200 Subject: [PATCH] feat: Sync modal theme with secure-site wallet views (#1694) --- apps/gallery/package.json | 6 +- apps/laboratory/package.json | 8 +- examples/html-ethers5/package.json | 4 +- examples/html-wagmi/package.json | 4 +- examples/react-ethers5/package.json | 4 +- examples/react-wagmi/package.json | 4 +- examples/vue-ethers5/package.json | 4 +- examples/vue-wagmi/package.json | 4 +- lerna.json | 2 +- package-lock.json | 126 +++++++++--------- packages/common/package.json | 2 +- packages/core/package.json | 6 +- .../core/src/controllers/ThemeController.ts | 6 +- packages/ethers/package.json | 14 +- packages/ethers5/package.json | 14 +- packages/polyfills/package.json | 2 +- packages/scaffold-react/package.json | 4 +- packages/scaffold-utils/package.json | 6 +- packages/scaffold-utils/src/ConstantsUtil.ts | 2 +- packages/scaffold-vue/package.json | 4 +- packages/scaffold/package.json | 10 +- packages/scaffold/src/client.ts | 22 +++ packages/siwe/package.json | 6 +- packages/ui/package.json | 4 +- packages/wagmi/package.json | 14 +- packages/wallet/package.json | 2 +- packages/wallet/src/W3mFrameConstants.ts | 5 +- packages/wallet/src/W3mFrameProvider.ts | 26 ++++ packages/wallet/src/W3mFrameSchema.ts | 12 +- packages/wallet/src/W3mFrameTypes.ts | 4 +- 30 files changed, 199 insertions(+), 132 deletions(-) diff --git a/apps/gallery/package.json b/apps/gallery/package.json index c7f502010a..828b303892 100644 --- a/apps/gallery/package.json +++ b/apps/gallery/package.json @@ -1,6 +1,6 @@ { "name": "@apps/gallery", - "version": "3.5.3", + "version": "3.6.0-f682e195", "private": true, "main": "index.js", "scripts": { @@ -9,8 +9,8 @@ "lint": "eslint . --ext .js,.jsx,.ts,.tsx" }, "dependencies": { - "@web3modal/common": "3.5.3", - "@web3modal/ui": "3.5.3", + "@web3modal/common": "3.6.0-f682e195", + "@web3modal/ui": "3.6.0-f682e195", "lit": "3.1.0", "storybook": "7.6.7" }, diff --git a/apps/laboratory/package.json b/apps/laboratory/package.json index c537d47556..09d27db9f8 100644 --- a/apps/laboratory/package.json +++ b/apps/laboratory/package.json @@ -1,6 +1,6 @@ { "name": "@apps/laboratory", - "version": "3.5.3", + "version": "3.6.0-f682e195", "private": true, "scripts": { "dev:laboratory": "next dev", @@ -17,9 +17,9 @@ "@emotion/styled": "11.11.0", "@sentry/browser": "7.91.0", "@sentry/react": "7.91.0", - "@web3modal/ethers": "3.5.3", - "@web3modal/ethers5": "3.5.3", - "@web3modal/wagmi": "3.5.3", + "@web3modal/ethers": "3.6.0-f682e195", + "@web3modal/ethers5": "3.6.0-f682e195", + "@web3modal/wagmi": "3.6.0-f682e195", "framer-motion": "10.16.16", "next": "14.0.4", "next-auth": "4.24.5", diff --git a/examples/html-ethers5/package.json b/examples/html-ethers5/package.json index d347f04264..34ac2879c0 100644 --- a/examples/html-ethers5/package.json +++ b/examples/html-ethers5/package.json @@ -1,13 +1,13 @@ { "name": "@examples/html-ethers5", "private": true, - "version": "3.5.3", + "version": "3.6.0-f682e195", "scripts": { "dev:example": "vite --port 3011", "build:examples": "vite build" }, "dependencies": { - "@web3modal/ethers5": "3.5.3", + "@web3modal/ethers5": "3.6.0-f682e195", "ethers": "5.7.2" } } diff --git a/examples/html-wagmi/package.json b/examples/html-wagmi/package.json index 23aeef8593..63b4134bd9 100644 --- a/examples/html-wagmi/package.json +++ b/examples/html-wagmi/package.json @@ -1,12 +1,12 @@ { "name": "@examples/html-wagmi", "private": true, - "version": "3.5.3", + "version": "3.6.0-f682e195", "scripts": { "dev:example": "vite --port 3001", "build:examples": "vite build" }, "dependencies": { - "@web3modal/wagmi": "3.5.3" + "@web3modal/wagmi": "3.6.0-f682e195" } } diff --git a/examples/react-ethers5/package.json b/examples/react-ethers5/package.json index a5a46a4437..9b7e0544ce 100644 --- a/examples/react-ethers5/package.json +++ b/examples/react-ethers5/package.json @@ -1,13 +1,13 @@ { "name": "@examples/react-ethers5", "private": true, - "version": "3.5.3", + "version": "3.6.0-f682e195", "scripts": { "dev:example": "vite --port 3012", "build:examples": "vite build" }, "dependencies": { - "@web3modal/ethers5": "3.5.3", + "@web3modal/ethers5": "3.6.0-f682e195", "ethers": "5.7.2" }, "devDependencies": { diff --git a/examples/react-wagmi/package.json b/examples/react-wagmi/package.json index 48569625b6..8afa854571 100644 --- a/examples/react-wagmi/package.json +++ b/examples/react-wagmi/package.json @@ -1,13 +1,13 @@ { "name": "@examples/react-wagmi", "private": true, - "version": "3.5.3", + "version": "3.6.0-f682e195", "scripts": { "dev:example": "vite --port 3002", "build:examples": "vite build" }, "dependencies": { - "@web3modal/wagmi": "3.5.3" + "@web3modal/wagmi": "3.6.0-f682e195" }, "devDependencies": { "@vitejs/plugin-react": "4.2.1" diff --git a/examples/vue-ethers5/package.json b/examples/vue-ethers5/package.json index 5f0e133f25..e6cb135dd2 100644 --- a/examples/vue-ethers5/package.json +++ b/examples/vue-ethers5/package.json @@ -1,13 +1,13 @@ { "name": "@examples/vue-ethers5", "private": true, - "version": "3.5.3", + "version": "3.6.0-f682e195", "scripts": { "dev:example": "vite --port 3013", "build:examples": "vite build" }, "dependencies": { - "@web3modal/ethers5": "3.5.3", + "@web3modal/ethers5": "3.6.0-f682e195", "ethers": "5.7.2" }, "devDependencies": { diff --git a/examples/vue-wagmi/package.json b/examples/vue-wagmi/package.json index 60f0190eea..84ae04d399 100644 --- a/examples/vue-wagmi/package.json +++ b/examples/vue-wagmi/package.json @@ -1,13 +1,13 @@ { "name": "@examples/vue-wagmi", "private": true, - "version": "3.5.3", + "version": "3.6.0-f682e195", "scripts": { "dev:example": "vite --port 3003", "build:examples": "vite build" }, "dependencies": { - "@web3modal/wagmi": "3.5.3" + "@web3modal/wagmi": "3.6.0-f682e195" }, "devDependencies": { "@vitejs/plugin-vue": "5.0.2" diff --git a/lerna.json b/lerna.json index e858045d90..a99a8c24e6 100644 --- a/lerna.json +++ b/lerna.json @@ -17,6 +17,6 @@ "apps/*", "examples/*" ], - "version": "3.5.3", + "version": "3.6.0-f682e195", "$schema": "node_modules/lerna/schemas/lerna-schema.json" } diff --git a/package-lock.json b/package-lock.json index bc2d76d0af..d00d89b60b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -48,10 +48,10 @@ }, "apps/gallery": { "name": "@apps/gallery", - "version": "3.5.3", + "version": "3.6.0-f682e195", "dependencies": { - "@web3modal/common": "3.5.3", - "@web3modal/ui": "3.5.3", + "@web3modal/common": "3.6.0-f682e195", + "@web3modal/ui": "3.6.0-f682e195", "lit": "3.1.0", "storybook": "7.6.7" }, @@ -77,16 +77,16 @@ }, "apps/laboratory": { "name": "@apps/laboratory", - "version": "3.5.3", + "version": "3.6.0-f682e195", "dependencies": { "@chakra-ui/react": "2.8.2", "@emotion/react": "11.11.3", "@emotion/styled": "11.11.0", "@sentry/browser": "7.91.0", "@sentry/react": "7.91.0", - "@web3modal/ethers": "3.5.3", - "@web3modal/ethers5": "3.5.3", - "@web3modal/wagmi": "3.5.3", + "@web3modal/ethers": "3.6.0-f682e195", + "@web3modal/ethers5": "3.6.0-f682e195", + "@web3modal/wagmi": "3.6.0-f682e195", "framer-motion": "10.16.16", "next": "14.0.4", "next-auth": "4.24.5", @@ -102,9 +102,9 @@ }, "examples/html-ethers5": { "name": "@examples/html-ethers5", - "version": "3.5.3", + "version": "3.6.0-f682e195", "dependencies": { - "@web3modal/ethers5": "3.5.3", + "@web3modal/ethers5": "3.6.0-f682e195", "ethers": "5.7.2" } }, @@ -157,16 +157,16 @@ }, "examples/html-wagmi": { "name": "@examples/html-wagmi", - "version": "3.5.3", + "version": "3.6.0-f682e195", "dependencies": { - "@web3modal/wagmi": "3.5.3" + "@web3modal/wagmi": "3.6.0-f682e195" } }, "examples/react-ethers5": { "name": "@examples/react-ethers5", - "version": "3.5.3", + "version": "3.6.0-f682e195", "dependencies": { - "@web3modal/ethers5": "3.5.3", + "@web3modal/ethers5": "3.6.0-f682e195", "ethers": "5.7.2" }, "devDependencies": { @@ -222,9 +222,9 @@ }, "examples/react-wagmi": { "name": "@examples/react-wagmi", - "version": "3.5.3", + "version": "3.6.0-f682e195", "dependencies": { - "@web3modal/wagmi": "3.5.3" + "@web3modal/wagmi": "3.6.0-f682e195" }, "devDependencies": { "@vitejs/plugin-react": "4.2.1" @@ -232,9 +232,9 @@ }, "examples/vue-ethers5": { "name": "@examples/vue-ethers5", - "version": "3.5.3", + "version": "3.6.0-f682e195", "dependencies": { - "@web3modal/ethers5": "3.5.3", + "@web3modal/ethers5": "3.6.0-f682e195", "ethers": "5.7.2" }, "devDependencies": { @@ -290,9 +290,9 @@ }, "examples/vue-wagmi": { "name": "@examples/vue-wagmi", - "version": "3.5.3", + "version": "3.6.0-f682e195", "dependencies": { - "@web3modal/wagmi": "3.5.3" + "@web3modal/wagmi": "3.6.0-f682e195" }, "devDependencies": { "@vitejs/plugin-vue": "5.0.2" @@ -27379,7 +27379,7 @@ }, "packages/common": { "name": "@web3modal/common", - "version": "3.5.3", + "version": "3.6.0-f682e195", "license": "Apache-2.0", "dependencies": { "dayjs": "1.11.10" @@ -27387,26 +27387,26 @@ }, "packages/core": { "name": "@web3modal/core", - "version": "3.5.3", + "version": "3.6.0-f682e195", "license": "Apache-2.0", "dependencies": { - "@web3modal/common": "3.5.3", - "@web3modal/wallet": "3.5.3", + "@web3modal/common": "3.6.0-f682e195", + "@web3modal/wallet": "3.6.0-f682e195", "valtio": "1.11.2" } }, "packages/ethers": { "name": "@web3modal/ethers", - "version": "3.5.3", + "version": "3.6.0-f682e195", "license": "Apache-2.0", "dependencies": { "@coinbase/wallet-sdk": "3.7.2", "@walletconnect/ethereum-provider": "2.11.0", - "@web3modal/polyfills": "3.5.3", - "@web3modal/scaffold": "3.5.3", - "@web3modal/scaffold-react": "3.5.3", - "@web3modal/scaffold-utils": "3.5.3", - "@web3modal/scaffold-vue": "3.5.3", + "@web3modal/polyfills": "3.6.0-f682e195", + "@web3modal/scaffold": "3.6.0-f682e195", + "@web3modal/scaffold-react": "3.6.0-f682e195", + "@web3modal/scaffold-utils": "3.6.0-f682e195", + "@web3modal/scaffold-vue": "3.6.0-f682e195", "valtio": "1.11.2" }, "devDependencies": { @@ -27414,7 +27414,7 @@ "ethers": "6.9.0" }, "optionalDependencies": { - "@web3modal/siwe": "3.5.3", + "@web3modal/siwe": "3.6.0-17c0eb03", "react": ">=17", "react-dom": ">=17", "vue": ">=3" @@ -27550,16 +27550,16 @@ }, "packages/ethers5": { "name": "@web3modal/ethers5", - "version": "3.5.3", + "version": "3.6.0-f682e195", "license": "Apache-2.0", "dependencies": { "@coinbase/wallet-sdk": "3.7.2", "@walletconnect/ethereum-provider": "2.11.0", - "@web3modal/polyfills": "3.5.3", - "@web3modal/scaffold": "3.5.3", - "@web3modal/scaffold-react": "3.5.3", - "@web3modal/scaffold-utils": "3.5.3", - "@web3modal/scaffold-vue": "3.5.3", + "@web3modal/polyfills": "3.6.0-f682e195", + "@web3modal/scaffold": "3.6.0-f682e195", + "@web3modal/scaffold-react": "3.6.0-f682e195", + "@web3modal/scaffold-utils": "3.6.0-f682e195", + "@web3modal/scaffold-vue": "3.6.0-f682e195", "valtio": "1.11.2" }, "devDependencies": { @@ -27567,7 +27567,7 @@ "ethers": "5.7.2" }, "optionalDependencies": { - "@web3modal/siwe": "3.5.3", + "@web3modal/siwe": "3.6.0-17c0eb03", "react": ">=17", "react-dom": ">=17", "vue": ">=3" @@ -27751,7 +27751,7 @@ }, "packages/polyfills": { "name": "@web3modal/polyfills", - "version": "3.5.3", + "version": "3.6.0-f682e195", "license": "Apache-2.0", "dependencies": { "buffer": "6.0.3" @@ -27782,24 +27782,24 @@ }, "packages/scaffold": { "name": "@web3modal/scaffold", - "version": "3.5.3", + "version": "3.6.0-f682e195", "license": "Apache-2.0", "dependencies": { - "@web3modal/common": "3.5.3", - "@web3modal/core": "3.5.3", - "@web3modal/ui": "3.5.3", + "@web3modal/common": "3.6.0-f682e195", + "@web3modal/core": "3.6.0-f682e195", + "@web3modal/ui": "3.6.0-f682e195", "lit": "3.1.0" }, "devDependencies": { - "@web3modal/wallet": "3.5.3" + "@web3modal/wallet": "3.6.0-f682e195" } }, "packages/scaffold-react": { "name": "@web3modal/scaffold-react", - "version": "3.5.3", + "version": "3.6.0-f682e195", "license": "Apache-2.0", "dependencies": { - "@web3modal/scaffold": "3.5.3" + "@web3modal/scaffold": "3.6.0-f682e195" }, "peerDependencies": { "react": ">=17", @@ -27808,20 +27808,20 @@ }, "packages/scaffold-utils": { "name": "@web3modal/scaffold-utils", - "version": "3.5.3", + "version": "3.6.0-f682e195", "license": "Apache-2.0", "dependencies": { - "@web3modal/polyfills": "3.5.3", - "@web3modal/scaffold": "3.5.3", + "@web3modal/polyfills": "3.6.0-f682e195", + "@web3modal/scaffold": "3.6.0-f682e195", "valtio": "1.11.2" } }, "packages/scaffold-vue": { "name": "@web3modal/scaffold-vue", - "version": "3.5.3", + "version": "3.6.0-f682e195", "license": "Apache-2.0", "dependencies": { - "@web3modal/scaffold": "3.5.3" + "@web3modal/scaffold": "3.6.0-f682e195" }, "peerDependencies": { "vue": ">=3" @@ -27839,11 +27839,11 @@ }, "packages/siwe": { "name": "@web3modal/siwe", - "version": "3.5.3", + "version": "3.6.0-f682e195", "license": "Apache-2.0", "dependencies": { - "@web3modal/core": "3.5.3", - "@web3modal/scaffold-utils": "3.5.3" + "@web3modal/core": "3.6.0-f682e195", + "@web3modal/scaffold-utils": "3.6.0-f682e195" }, "optionalDependencies": { "react": ">=17", @@ -27869,7 +27869,7 @@ }, "packages/ui": { "name": "@web3modal/ui", - "version": "3.5.3", + "version": "3.6.0-f682e195", "license": "Apache-2.0", "dependencies": { "lit": "3.1.0", @@ -27877,7 +27877,7 @@ }, "devDependencies": { "@types/qrcode": "1.5.5", - "@web3modal/common": "3.5.3", + "@web3modal/common": "3.6.0-f682e195", "eslint-plugin-lit": "1.11.0", "eslint-plugin-wc": "2.0.4" } @@ -27894,20 +27894,20 @@ }, "packages/wagmi": { "name": "@web3modal/wagmi", - "version": "3.5.3", + "version": "3.6.0-f682e195", "license": "Apache-2.0", "dependencies": { - "@web3modal/polyfills": "3.5.3", - "@web3modal/scaffold": "3.5.3", - "@web3modal/scaffold-react": "3.5.3", - "@web3modal/scaffold-utils": "3.5.3", - "@web3modal/scaffold-vue": "3.5.3" + "@web3modal/polyfills": "3.6.0-f682e195", + "@web3modal/scaffold": "3.6.0-f682e195", + "@web3modal/scaffold-react": "3.6.0-f682e195", + "@web3modal/scaffold-utils": "3.6.0-f682e195", + "@web3modal/scaffold-vue": "3.6.0-f682e195" }, "devDependencies": { "@web3modal/siwe": "*" }, "optionalDependencies": { - "@web3modal/siwe": "3.5.3", + "@web3modal/siwe": "3.6.0-17c0eb03", "react": ">=17", "react-dom": ">=17", "vue": ">=3" @@ -27937,7 +27937,7 @@ }, "packages/wallet": { "name": "@web3modal/wallet", - "version": "3.5.3", + "version": "3.6.0-f682e195", "license": "Apache-2.0", "dependencies": { "zod": "3.22.4" diff --git a/packages/common/package.json b/packages/common/package.json index ae65d37f55..0723f40e1b 100644 --- a/packages/common/package.json +++ b/packages/common/package.json @@ -1,6 +1,6 @@ { "name": "@web3modal/common", - "version": "3.5.3", + "version": "3.6.0-f682e195", "type": "module", "main": "./dist/esm/index.js", "types": "./dist/types/index.d.ts", diff --git a/packages/core/package.json b/packages/core/package.json index 234fc8c66d..ed18477e25 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,6 +1,6 @@ { "name": "@web3modal/core", - "version": "3.5.3", + "version": "3.6.0-f682e195", "type": "module", "main": "./dist/esm/index.js", "types": "./dist/types/index.d.ts", @@ -17,8 +17,8 @@ "lint": "eslint . --ext .js,.jsx,.ts,.tsx" }, "dependencies": { - "@web3modal/common": "3.5.3", - "@web3modal/wallet": "3.5.3", + "@web3modal/common": "3.6.0-f682e195", + "@web3modal/wallet": "3.6.0-f682e195", "valtio": "1.11.2" }, "keywords": [ diff --git a/packages/core/src/controllers/ThemeController.ts b/packages/core/src/controllers/ThemeController.ts index 6c8789747f..68eb02fbda 100644 --- a/packages/core/src/controllers/ThemeController.ts +++ b/packages/core/src/controllers/ThemeController.ts @@ -1,4 +1,4 @@ -import { proxy, subscribe as sub } from 'valtio/vanilla' +import { proxy, subscribe as sub, snapshot } from 'valtio/vanilla' import type { ThemeMode, ThemeVariables } from '../utils/TypeUtil.js' // -- Types --------------------------------------------- // @@ -27,5 +27,9 @@ export const ThemeController = { setThemeVariables(themeVariables: ThemeControllerState['themeVariables']) { state.themeVariables = { ...state.themeVariables, ...themeVariables } + }, + + getSnapshot() { + return snapshot(state) } } diff --git a/packages/ethers/package.json b/packages/ethers/package.json index 70364643b6..f3c3fc599b 100644 --- a/packages/ethers/package.json +++ b/packages/ethers/package.json @@ -1,6 +1,6 @@ { "name": "@web3modal/ethers", - "version": "3.5.3", + "version": "3.6.0-f682e195", "type": "module", "main": "./dist/esm/exports/index.js", "types": "./dist/types/exports/index.d.ts", @@ -45,11 +45,11 @@ "dependencies": { "@coinbase/wallet-sdk": "3.7.2", "@walletconnect/ethereum-provider": "2.11.0", - "@web3modal/polyfills": "3.5.3", - "@web3modal/scaffold": "3.5.3", - "@web3modal/scaffold-react": "3.5.3", - "@web3modal/scaffold-utils": "3.5.3", - "@web3modal/scaffold-vue": "3.5.3", + "@web3modal/polyfills": "3.6.0-f682e195", + "@web3modal/scaffold": "3.6.0-f682e195", + "@web3modal/scaffold-react": "3.6.0-f682e195", + "@web3modal/scaffold-utils": "3.6.0-f682e195", + "@web3modal/scaffold-vue": "3.6.0-f682e195", "valtio": "1.11.2" }, "peerDependencies": { @@ -78,7 +78,7 @@ } }, "optionalDependencies": { - "@web3modal/siwe": "3.5.3", + "@web3modal/siwe": "3.6.0-17c0eb03", "react": ">=17", "react-dom": ">=17", "vue": ">=3" diff --git a/packages/ethers5/package.json b/packages/ethers5/package.json index 5ed64069ec..7e6f28d79d 100644 --- a/packages/ethers5/package.json +++ b/packages/ethers5/package.json @@ -1,6 +1,6 @@ { "name": "@web3modal/ethers5", - "version": "3.5.3", + "version": "3.6.0-f682e195", "type": "module", "main": "./dist/esm/exports/index.js", "types": "./dist/types/exports/index.d.ts", @@ -45,11 +45,11 @@ "dependencies": { "@coinbase/wallet-sdk": "3.7.2", "@walletconnect/ethereum-provider": "2.11.0", - "@web3modal/polyfills": "3.5.3", - "@web3modal/scaffold": "3.5.3", - "@web3modal/scaffold-react": "3.5.3", - "@web3modal/scaffold-utils": "3.5.3", - "@web3modal/scaffold-vue": "3.5.3", + "@web3modal/polyfills": "3.6.0-f682e195", + "@web3modal/scaffold": "3.6.0-f682e195", + "@web3modal/scaffold-react": "3.6.0-f682e195", + "@web3modal/scaffold-utils": "3.6.0-f682e195", + "@web3modal/scaffold-vue": "3.6.0-f682e195", "valtio": "1.11.2" }, "devDependencies": { @@ -78,7 +78,7 @@ } }, "optionalDependencies": { - "@web3modal/siwe": "3.5.3", + "@web3modal/siwe": "3.6.0-17c0eb03", "react": ">=17", "react-dom": ">=17", "vue": ">=3" diff --git a/packages/polyfills/package.json b/packages/polyfills/package.json index 1d392017b2..6cc86f7fff 100644 --- a/packages/polyfills/package.json +++ b/packages/polyfills/package.json @@ -1,6 +1,6 @@ { "name": "@web3modal/polyfills", - "version": "3.5.3", + "version": "3.6.0-f682e195", "type": "module", "main": "./dist/esm/index.js", "types": "./dist/types/index.d.ts", diff --git a/packages/scaffold-react/package.json b/packages/scaffold-react/package.json index 9fb829f41b..02925dd6dd 100644 --- a/packages/scaffold-react/package.json +++ b/packages/scaffold-react/package.json @@ -1,6 +1,6 @@ { "name": "@web3modal/scaffold-react", - "version": "3.5.3", + "version": "3.6.0-f682e195", "type": "module", "main": "./dist/esm/index.js", "types": "./dist/types/index.d.ts", @@ -16,7 +16,7 @@ "lint": "eslint . --ext .js,.jsx,.ts,.tsx" }, "dependencies": { - "@web3modal/scaffold": "3.5.3" + "@web3modal/scaffold": "3.6.0-f682e195" }, "peerDependencies": { "react": ">=17", diff --git a/packages/scaffold-utils/package.json b/packages/scaffold-utils/package.json index 4d7f0673e1..19ab706b2d 100644 --- a/packages/scaffold-utils/package.json +++ b/packages/scaffold-utils/package.json @@ -1,6 +1,6 @@ { "name": "@web3modal/scaffold-utils", - "version": "3.5.3", + "version": "3.6.0-f682e195", "type": "module", "main": "./dist/esm/exports/index.js", "types": "./dist/types/exports/index.d.ts", @@ -35,8 +35,8 @@ "lint": "eslint . --ext .js,.jsx,.ts,.tsx" }, "dependencies": { - "@web3modal/polyfills": "3.5.3", - "@web3modal/scaffold": "3.5.3", + "@web3modal/polyfills": "3.6.0-f682e195", + "@web3modal/scaffold": "3.6.0-f682e195", "valtio": "1.11.2" }, "keywords": [ diff --git a/packages/scaffold-utils/src/ConstantsUtil.ts b/packages/scaffold-utils/src/ConstantsUtil.ts index 18be61d1bf..4e57efbdf2 100644 --- a/packages/scaffold-utils/src/ConstantsUtil.ts +++ b/packages/scaffold-utils/src/ConstantsUtil.ts @@ -10,5 +10,5 @@ export const ConstantsUtil = { ADD_CHAIN_METHOD: 'wallet_addEthereumChain', EIP6963_ANNOUNCE_EVENT: 'eip6963:announceProvider', EIP6963_REQUEST_EVENT: 'eip6963:requestProvider', - VERSION: '3.5.3' + VERSION: '3.6.0-f682e195' } diff --git a/packages/scaffold-vue/package.json b/packages/scaffold-vue/package.json index 9ffcab1838..7d13642ca8 100644 --- a/packages/scaffold-vue/package.json +++ b/packages/scaffold-vue/package.json @@ -1,6 +1,6 @@ { "name": "@web3modal/scaffold-vue", - "version": "3.5.3", + "version": "3.6.0-f682e195", "type": "module", "main": "./dist/esm/index.js", "types": "./dist/types/index.d.ts", @@ -16,7 +16,7 @@ "lint": "eslint . --ext .js,.jsx,.ts,.tsx" }, "dependencies": { - "@web3modal/scaffold": "3.5.3" + "@web3modal/scaffold": "3.6.0-f682e195" }, "peerDependencies": { "vue": ">=3" diff --git a/packages/scaffold/package.json b/packages/scaffold/package.json index 5b74734867..8801fa4bf3 100644 --- a/packages/scaffold/package.json +++ b/packages/scaffold/package.json @@ -1,6 +1,6 @@ { "name": "@web3modal/scaffold", - "version": "3.5.3", + "version": "3.6.0-f682e195", "type": "module", "main": "./dist/esm/index.js", "types": "./dist/types/index.d.ts", @@ -16,13 +16,13 @@ "lint": "eslint . --ext .js,.jsx,.ts,.tsx" }, "dependencies": { - "@web3modal/common": "3.5.3", - "@web3modal/core": "3.5.3", - "@web3modal/ui": "3.5.3", + "@web3modal/common": "3.6.0-f682e195", + "@web3modal/core": "3.6.0-f682e195", + "@web3modal/ui": "3.6.0-f682e195", "lit": "3.1.0" }, "devDependencies": { - "@web3modal/wallet": "3.5.3" + "@web3modal/wallet": "3.6.0-f682e195" }, "keywords": [ "web3", diff --git a/packages/scaffold/src/client.ts b/packages/scaffold/src/client.ts index 034e64e287..3ffca93e53 100644 --- a/packages/scaffold/src/client.ts +++ b/packages/scaffold/src/client.ts @@ -94,11 +94,33 @@ export class Web3ModalScaffold { public setThemeMode(themeMode: ThemeControllerState['themeMode']) { ThemeController.setThemeMode(themeMode) setColorTheme(ThemeController.state.themeMode) + try { + const emailConnector = ConnectorController.getEmailConnector() + if (emailConnector) { + emailConnector.provider.syncTheme({ + themeMode: ThemeController.getSnapshot().themeMode + }) + } + } catch { + // eslint-disable-next-line no-console + console.info('Unable to sync theme to email connector') + } } public setThemeVariables(themeVariables: ThemeControllerState['themeVariables']) { ThemeController.setThemeVariables(themeVariables) setThemeVariables(ThemeController.state.themeVariables) + try { + const emailConnector = ConnectorController.getEmailConnector() + if (emailConnector) { + emailConnector.provider.syncTheme({ + themeVariables: ThemeController.getSnapshot().themeVariables + }) + } + } catch { + // eslint-disable-next-line no-console + console.info('Unable to sync theme to email connector') + } } public subscribeTheme(callback: (newState: ThemeControllerState) => void) { diff --git a/packages/siwe/package.json b/packages/siwe/package.json index d2317a097f..b3dfe3f189 100644 --- a/packages/siwe/package.json +++ b/packages/siwe/package.json @@ -1,6 +1,6 @@ { "name": "@web3modal/siwe", - "version": "3.5.3", + "version": "3.6.0-f682e195", "type": "module", "main": "./dist/esm/exports/index.js", "types": "./dist/types/exports/index.d.ts", @@ -16,8 +16,8 @@ "lint": "eslint . --ext .js,.jsx,.ts,.tsx" }, "dependencies": { - "@web3modal/core": "3.5.3", - "@web3modal/scaffold-utils": "3.5.3" + "@web3modal/core": "3.6.0-f682e195", + "@web3modal/scaffold-utils": "3.6.0-f682e195" }, "peerDependencies": { "react": ">=17", diff --git a/packages/ui/package.json b/packages/ui/package.json index 0c05fb5c79..99c1e92a07 100644 --- a/packages/ui/package.json +++ b/packages/ui/package.json @@ -1,6 +1,6 @@ { "name": "@web3modal/ui", - "version": "3.5.3", + "version": "3.6.0-f682e195", "type": "module", "main": "./dist/esm/index.js", "types": "./dist/types/index.d.ts", @@ -21,7 +21,7 @@ }, "devDependencies": { "@types/qrcode": "1.5.5", - "@web3modal/common": "3.5.3", + "@web3modal/common": "3.6.0-f682e195", "eslint-plugin-lit": "1.11.0", "eslint-plugin-wc": "2.0.4" }, diff --git a/packages/wagmi/package.json b/packages/wagmi/package.json index 20787d36eb..258f9358cb 100644 --- a/packages/wagmi/package.json +++ b/packages/wagmi/package.json @@ -1,6 +1,6 @@ { "name": "@web3modal/wagmi", - "version": "3.5.3", + "version": "3.6.0-f682e195", "type": "module", "main": "./dist/esm/exports/index.js", "types": "./dist/types/exports/index.d.ts", @@ -43,11 +43,11 @@ "lint": "eslint . --ext .js,.jsx,.ts,.tsx" }, "dependencies": { - "@web3modal/polyfills": "3.5.3", - "@web3modal/scaffold": "3.5.3", - "@web3modal/scaffold-react": "3.5.3", - "@web3modal/scaffold-utils": "3.5.3", - "@web3modal/scaffold-vue": "3.5.3" + "@web3modal/polyfills": "3.6.0-f682e195", + "@web3modal/scaffold": "3.6.0-f682e195", + "@web3modal/scaffold-react": "3.6.0-f682e195", + "@web3modal/scaffold-utils": "3.6.0-f682e195", + "@web3modal/scaffold-vue": "3.6.0-f682e195" }, "devDependencies": { "@web3modal/siwe": "*" @@ -75,7 +75,7 @@ } }, "optionalDependencies": { - "@web3modal/siwe": "3.5.3", + "@web3modal/siwe": "3.6.0-17c0eb03", "react": ">=17", "react-dom": ">=17", "vue": ">=3" diff --git a/packages/wallet/package.json b/packages/wallet/package.json index 6ec8b50d2e..c513452691 100644 --- a/packages/wallet/package.json +++ b/packages/wallet/package.json @@ -1,6 +1,6 @@ { "name": "@web3modal/wallet", - "version": "3.5.3", + "version": "3.6.0-f682e195", "type": "module", "main": "./dist/esm/index.js", "types": "./dist/types/index.d.ts", diff --git a/packages/wallet/src/W3mFrameConstants.ts b/packages/wallet/src/W3mFrameConstants.ts index 753359c6be..11ca1f88e6 100644 --- a/packages/wallet/src/W3mFrameConstants.ts +++ b/packages/wallet/src/W3mFrameConstants.ts @@ -21,6 +21,7 @@ export const W3mFrameConstants = { APP_RPC_REQUEST: '@w3m-app/RPC_REQUEST', APP_UPDATE_EMAIL: '@w3m-app/UPDATE_EMAIL', APP_AWAIT_UPDATE_EMAIL: '@w3m-app/AWAIT_UPDATE_EMAIL', + APP_SYNC_THEME: '@w3m-app/SYNC_THEME', FRAME_SWITCH_NETWORK_ERROR: '@w3m-frame/SWITCH_NETWORK_ERROR', FRAME_SWITCH_NETWORK_SUCCESS: '@w3m-frame/SWITCH_NETWORK_SUCCESS', @@ -44,5 +45,7 @@ export const W3mFrameConstants = { FRAME_UPDATE_EMAIL_SUCCESS: '@w3m-frame/UPDATE_EMAIL_SUCCESS', FRAME_UPDATE_EMAIL_ERROR: '@w3m-frame/UPDATE_EMAIL_ERROR', FRAME_AWAIT_UPDATE_EMAIL_SUCCESS: '@w3m-frame/AWAIT_UPDATE_EMAIL_SUCCESS', - FRAME_AWAIT_UPDATE_EMAIL_ERROR: '@w3m-frame/AWAIT_UPDATE_EMAIL_ERROR' + FRAME_AWAIT_UPDATE_EMAIL_ERROR: '@w3m-frame/AWAIT_UPDATE_EMAIL_ERROR', + FRAME_SYNC_THEME_SUCCESS: '@w3m-frame/SYNC_THEME_SUCCESS', + FRAME_SYNC_THEME_ERROR: '@w3m-frame/SYNC_THEME_ERROR' } as const diff --git a/packages/wallet/src/W3mFrameProvider.ts b/packages/wallet/src/W3mFrameProvider.ts index e7cc210c5b..5f91e87c46 100644 --- a/packages/wallet/src/W3mFrameProvider.ts +++ b/packages/wallet/src/W3mFrameProvider.ts @@ -17,6 +17,7 @@ type SwitchChainResolver = Resolver type RpcRequestResolver = Resolver type UpdateEmailResolver = Resolver type AwaitUpdateEmailResolver = Resolver +type SyncThemeResolver = Resolver // -- Provider -------------------------------------------------------- export class W3mFrameProvider { @@ -44,6 +45,8 @@ export class W3mFrameProvider { private awaitUpdateEmailResolver: AwaitUpdateEmailResolver = undefined + private syncThemeResolver: SyncThemeResolver = undefined + public constructor(projectId: string) { this.w3mFrame = new W3mFrame(projectId, true) this.w3mFrame.events.onFrameEvent(event => { @@ -97,6 +100,10 @@ export class W3mFrameProvider { return this.onAwaitUpdateEmailSuccess(event) case W3mFrameConstants.FRAME_AWAIT_UPDATE_EMAIL_ERROR: return this.onAwaitUpdateEmailError(event) + case W3mFrameConstants.FRAME_SYNC_THEME_SUCCESS: + return this.onSyncThemeSuccess() + case W3mFrameConstants.FRAME_SYNC_THEME_ERROR: + return this.onSyncThemeError(event) default: return null } @@ -182,6 +189,15 @@ export class W3mFrameProvider { ) } + public async syncTheme(payload: W3mFrameTypes.Requests['AppSyncThemeRequest']) { + await this.w3mFrame.frameLoadPromise + this.w3mFrame.events.postAppEvent({ type: W3mFrameConstants.APP_SYNC_THEME, payload }) + + return new Promise((resolve, reject) => { + this.syncThemeResolver = { resolve, reject } + }) + } + // -- Provider Methods ------------------------------------------------ public async connect(payload?: W3mFrameTypes.Requests['AppGetUserRequest']) { await this.w3mFrame.frameLoadPromise @@ -388,6 +404,16 @@ export class W3mFrameProvider { this.awaitUpdateEmailResolver?.reject(event.payload.message) } + private onSyncThemeSuccess() { + this.syncThemeResolver?.resolve(undefined) + } + + private onSyncThemeError( + event: Extract + ) { + this.syncThemeResolver?.reject(event.payload.message) + } + // -- Private Methods ------------------------------------------------- private setNewLastEmailLoginTime() { W3mFrameStorage.set(W3mFrameConstants.LAST_EMAIL_LOGIN_TIME, Date.now().toString()) diff --git a/packages/wallet/src/W3mFrameSchema.ts b/packages/wallet/src/W3mFrameSchema.ts index cf59b974bc..b7539834a5 100644 --- a/packages/wallet/src/W3mFrameSchema.ts +++ b/packages/wallet/src/W3mFrameSchema.ts @@ -14,6 +14,10 @@ export const AppConnectEmailRequest = z.object({ email: z.string().email() }) export const AppConnectOtpRequest = z.object({ otp: z.string() }) export const AppGetUserRequest = z.object({ chainId: z.optional(z.number()) }) export const AppUpdateEmailRequest = z.object({ email: z.string().email() }) +export const AppSyncThemeRequest = z.object({ + themeMode: z.optional(z.enum(['light', 'dark'])), + themeVariables: z.optional(z.record(z.string(), z.string().or(z.number()))) +}) export const FrameConnectEmailResponse = z.object({ action: z.enum(['VERIFY_DEVICE', 'VERIFY_OTP']) }) @@ -90,7 +94,9 @@ export const W3mFrameSchema = { .or(z.object({ type: zType('APP_UPDATE_EMAIL'), payload: AppUpdateEmailRequest })) - .or(z.object({ type: zType('APP_AWAIT_UPDATE_EMAIL') })), + .or(z.object({ type: zType('APP_AWAIT_UPDATE_EMAIL') })) + + .or(z.object({ type: zType('APP_SYNC_THEME'), payload: AppSyncThemeRequest })), // -- Frame Events --------------------------------------------------------- frameEvent: z @@ -146,4 +152,8 @@ export const W3mFrameSchema = { payload: FrameAwaitUpdateEmailResponse }) ) + + .or(z.object({ type: zType('FRAME_SYNC_THEME_ERROR'), payload: zError })) + + .or(z.object({ type: zType('FRAME_SYNC_THEME_SUCCESS') })) } diff --git a/packages/wallet/src/W3mFrameTypes.ts b/packages/wallet/src/W3mFrameTypes.ts index b73ef9321c..3891d91cea 100644 --- a/packages/wallet/src/W3mFrameTypes.ts +++ b/packages/wallet/src/W3mFrameTypes.ts @@ -19,7 +19,8 @@ import { FrameSession, AppGetUserRequest, AppUpdateEmailRequest, - FrameAwaitUpdateEmailResponse + FrameAwaitUpdateEmailResponse, + AppSyncThemeRequest } from './W3mFrameSchema.js' export namespace W3mFrameTypes { @@ -33,6 +34,7 @@ export namespace W3mFrameTypes { AppSwitchNetworkRequest: z.infer AppGetUserRequest: z.infer AppUpdateEmailRequest: z.infer + AppSyncThemeRequest: z.infer } export interface Responses {