diff --git a/dapps/web3modal/next/package.json b/dapps/web3modal/next/package.json index 1214103bf..a31f119d7 100644 --- a/dapps/web3modal/next/package.json +++ b/dapps/web3modal/next/package.json @@ -11,7 +11,7 @@ }, "dependencies": { "@tanstack/react-query": "^5.17.19", - "@web3modal/wagmi": "4.0.0-alpha.2", + "@web3modal/wagmi": "4.0.0-alpha.3", "next": "14.0.4", "react": "^18", "react-dom": "^18", diff --git a/dapps/web3modal/next/pnpm-lock.yaml b/dapps/web3modal/next/pnpm-lock.yaml index 4b450cfa2..70014866a 100644 --- a/dapps/web3modal/next/pnpm-lock.yaml +++ b/dapps/web3modal/next/pnpm-lock.yaml @@ -9,8 +9,8 @@ dependencies: specifier: ^5.17.19 version: 5.17.19(react@18.2.0) '@web3modal/wagmi': - specifier: 4.0.0-alpha.2 - version: 4.0.0-alpha.2(@types/react@18.2.48)(@wagmi/connectors@4.1.6)(@wagmi/core@2.3.1)(typescript@5.3.3)(viem@2.5.0) + specifier: 4.0.0-alpha.3 + version: 4.0.0-alpha.3(@types/react@18.2.48)(@wagmi/connectors@4.1.10)(@wagmi/core@2.6.1)(typescript@5.3.3)(viem@2.5.0) next: specifier: 14.0.4 version: 14.0.4(@babel/core@7.23.7)(react-dom@18.2.0)(react@18.2.0) @@ -3367,76 +3367,6 @@ packages: - zod dev: false - /@wagmi/connectors@4.1.6(@types/react@18.2.48)(@wagmi/core@2.3.1)(react-dom@18.2.0)(react-native@0.73.2)(react@18.2.0)(typescript@5.3.3)(viem@2.5.0): - resolution: {integrity: sha512-Kew/4K3AFMF4eNwg5ZEDMDu0R2MaLWwkgzWTPNwIp3Jjm8jtxSJ2Qyg23wS0YxaaGGefXX4/9K9MAN2Vjpsowg==} - peerDependencies: - '@wagmi/core': 2.3.1 - typescript: '>=5.0.4' - viem: 2.x - peerDependenciesMeta: - typescript: - optional: true - dependencies: - '@coinbase/wallet-sdk': 3.9.1 - '@metamask/sdk': 0.14.1(@types/react@18.2.48)(react-dom@18.2.0)(react-native@0.73.2)(react@18.2.0) - '@safe-global/safe-apps-provider': 0.18.1(typescript@5.3.3) - '@safe-global/safe-apps-sdk': 8.1.0(typescript@5.3.3) - '@wagmi/core': 2.3.1(@types/react@18.2.48)(react@18.2.0)(typescript@5.3.3)(viem@2.5.0) - '@walletconnect/ethereum-provider': 2.11.0(@types/react@18.2.48)(react@18.2.0) - '@walletconnect/modal': 2.6.2(@types/react@18.2.48)(react@18.2.0) - typescript: 5.3.3 - viem: 2.5.0(typescript@5.3.3) - transitivePeerDependencies: - - '@azure/app-configuration' - - '@azure/cosmos' - - '@azure/data-tables' - - '@azure/identity' - - '@azure/keyvault-secrets' - - '@azure/storage-blob' - - '@capacitor/preferences' - - '@netlify/blobs' - - '@planetscale/database' - - '@react-native-async-storage/async-storage' - - '@types/react' - - '@upstash/redis' - - '@vercel/kv' - - bufferutil - - encoding - - react - - react-dom - - react-native - - rollup - - supports-color - - utf-8-validate - - zod - dev: false - - /@wagmi/core@2.3.1(@types/react@18.2.48)(react@18.2.0)(typescript@5.3.3)(viem@2.5.0): - resolution: {integrity: sha512-vpD5el6E8s2gmTDFPr1ghRuQCBTe45QSOSxAPkImCXWXiAh4xoCfwPH8lBUBpRJouu2eVBPVaCpGQNGO8yD1xw==} - peerDependencies: - '@tanstack/query-core': '>=5.0.0' - typescript: '>=5.0.4' - viem: 2.x - peerDependenciesMeta: - '@tanstack/query-core': - optional: true - typescript: - optional: true - dependencies: - eventemitter3: 5.0.1 - mipd: 0.0.5(typescript@5.3.3) - typescript: 5.3.3 - viem: 2.5.0(typescript@5.3.3) - zustand: 4.4.1(@types/react@18.2.48)(react@18.2.0) - transitivePeerDependencies: - - '@types/react' - - bufferutil - - immer - - react - - utf-8-validate - - zod - dev: false - /@wagmi/core@2.6.1(@types/react@18.2.48)(react@18.2.0)(typescript@5.3.3)(viem@2.5.0): resolution: {integrity: sha512-8uE4cpkGqHObjFcDUU6ZGqn9KiOO2wsJOKZ+bXevLOXe2a6M268vOUKJUM2d6/Whn4aBFEyMcX8ESdLuySS78w==} peerDependencies: @@ -3830,79 +3760,79 @@ packages: tslib: 1.14.1 dev: false - /@web3modal/common@4.0.0-alpha.2: - resolution: {integrity: sha512-ApRt4cFCiWigJh97B1UONH5PKrK+q/DXQwTmiy8WZOHwF0+FQyjnCkp6tfT0QnXTrvyafj1MlY46BbRTu7zmIw==} + /@web3modal/common@4.0.0-alpha.3: + resolution: {integrity: sha512-zGeQdannT6VsMSA2vfPvK8Adkq5fMazreOJwoxXJsDdHK9r/zm/L913FsMf0h9fLnye7j5gbLbN2U7zu75RP3w==} dependencies: dayjs: 1.11.10 dev: false - /@web3modal/core@4.0.0-alpha.2(@types/react@18.2.48)(react@18.2.0): - resolution: {integrity: sha512-s/BlEKMNqvuaUGqWapIhZZyvwT+B62ylHlEVuUE1N4TK0yL2Unpw9s57C6yD30HRG/lfNS6iDU20QKCvpliETQ==} + /@web3modal/core@4.0.0-alpha.3(@types/react@18.2.48)(react@18.2.0): + resolution: {integrity: sha512-NrIlwzaX/Q7sJ7+ML37iGM6m1x7EbeF0u+ONktKSz611QE84hnxDAWpj755C2MFG5H1EqDnGJ8ZhgL9BiwLXmA==} dependencies: - '@web3modal/common': 4.0.0-alpha.2 - '@web3modal/wallet': 4.0.0-alpha.2 + '@web3modal/common': 4.0.0-alpha.3 + '@web3modal/wallet': 4.0.0-alpha.3 valtio: 1.11.2(@types/react@18.2.48)(react@18.2.0) transitivePeerDependencies: - '@types/react' - react dev: false - /@web3modal/polyfills@4.0.0-alpha.2: - resolution: {integrity: sha512-ATZvLcyPclnaeIpiMyn8CFp+j/TmGjAKkdT9SN+gOWEXDI1dVRVNFagK3lI5nczs5YveskBTD1ZWckpnuYLu8g==} + /@web3modal/polyfills@4.0.0-alpha.3: + resolution: {integrity: sha512-U13Wy75cOAMPpW2oPHqtnt6Yv3yf5JhQ+ygpXONhYKU6ik/K2FkRgrMfskvL8Bkzl2K4XvlAFjraLCY8RKKAAg==} dependencies: buffer: 6.0.3 dev: false - /@web3modal/scaffold-react@4.0.0-alpha.2(@types/react@18.2.48)(react-dom@18.2.0)(react@18.2.0): - resolution: {integrity: sha512-zFEsCwSHzn4upL8DZST92STy5X2VxNxDYJCGx4RNiQTwDEIOqxNMMLlVI+1r9KVYWqJLxUpaTLb2CWyHCYSk9w==} + /@web3modal/scaffold-react@4.0.0-alpha.3(@types/react@18.2.48)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-flL36F+RfLLwj8q/kTzAFWHmiu6i1JuyBL6vxYPpwJlKkWtgXuQNSSjLimyp8Qxt18UbHAH7V2Z3fFcS2LtCaA==} peerDependencies: react: '>=17' react-dom: '>=17' dependencies: - '@web3modal/scaffold': 4.0.0-alpha.2(@types/react@18.2.48)(react@18.2.0) + '@web3modal/scaffold': 4.0.0-alpha.3(@types/react@18.2.48)(react@18.2.0) react: 18.2.0 react-dom: 18.2.0(react@18.2.0) transitivePeerDependencies: - '@types/react' dev: false - /@web3modal/scaffold-utils@4.0.0-alpha.2(@types/react@18.2.48)(react@18.2.0): - resolution: {integrity: sha512-JkFQ15rRMgtO1++nsSOYVgSyAWio3e+/FKY/c2vLqphVuANc8h67Ne7OXJ3J8Yiae9GSHcHsLtpfxRHlxYGyWQ==} + /@web3modal/scaffold-utils@4.0.0-alpha.3(@types/react@18.2.48)(react@18.2.0): + resolution: {integrity: sha512-/N66YAI96aAMjtPGixFKlYmnWKIGyDJEFiUytL/9OjiQjbVbGyGR2YwsFmNZiNYIAH0Wn5kd1vjf/wqfOAEPww==} dependencies: - '@web3modal/polyfills': 4.0.0-alpha.2 - '@web3modal/scaffold': 4.0.0-alpha.2(@types/react@18.2.48)(react@18.2.0) + '@web3modal/polyfills': 4.0.0-alpha.3 + '@web3modal/scaffold': 4.0.0-alpha.3(@types/react@18.2.48)(react@18.2.0) valtio: 1.11.2(@types/react@18.2.48)(react@18.2.0) transitivePeerDependencies: - '@types/react' - react dev: false - /@web3modal/scaffold-vue@4.0.0-alpha.2(@types/react@18.2.48)(react@18.2.0)(vue@3.4.14): - resolution: {integrity: sha512-iMzAo/9/245qiOR8c/2YkHsHUajyyU78KlD9u21bfxZn78z3h9BzR6WiDi7lzWZl96murWkwmh6rE2ncnE/a7A==} + /@web3modal/scaffold-vue@4.0.0-alpha.3(@types/react@18.2.48)(react@18.2.0)(vue@3.4.14): + resolution: {integrity: sha512-R3IIDdpPeZBxviquSAKup93SIOFIl6G21d9SUYWRPmv0Smao7QjgDUKaQQC8KIYwA5Ga0txu2hT8cFRwO0qEZg==} peerDependencies: vue: '>=3' dependencies: - '@web3modal/scaffold': 4.0.0-alpha.2(@types/react@18.2.48)(react@18.2.0) + '@web3modal/scaffold': 4.0.0-alpha.3(@types/react@18.2.48)(react@18.2.0) vue: 3.4.14(typescript@5.3.3) transitivePeerDependencies: - '@types/react' - react dev: false - /@web3modal/scaffold@4.0.0-alpha.2(@types/react@18.2.48)(react@18.2.0): - resolution: {integrity: sha512-HHw0aJ1hwWhuR42xGHKgoYajq+tZUV8OGddY7hpoCRIlj68oXnTdJIX6yCwCXAs9UmXh67BgvumkittbFTDf5Q==} + /@web3modal/scaffold@4.0.0-alpha.3(@types/react@18.2.48)(react@18.2.0): + resolution: {integrity: sha512-yXdKFJPyhD12vVqKhI3NndFhPhYd8x6oNt945gCXXeorFozocnTL5YBlAUYCu58fMxhGO0sJMTxxXbFzIkx5Wg==} dependencies: - '@web3modal/common': 4.0.0-alpha.2 - '@web3modal/core': 4.0.0-alpha.2(@types/react@18.2.48)(react@18.2.0) - '@web3modal/ui': 4.0.0-alpha.2 + '@web3modal/common': 4.0.0-alpha.3 + '@web3modal/core': 4.0.0-alpha.3(@types/react@18.2.48)(react@18.2.0) + '@web3modal/ui': 4.0.0-alpha.3 lit: 3.1.0 transitivePeerDependencies: - '@types/react' - react dev: false - /@web3modal/siwe@4.0.0-alpha.2(@types/react@18.2.48)(typescript@5.3.3): - resolution: {integrity: sha512-W0a70hTfR1EyHtB1COakvWv+smMZodMzai8eAuy9ckPO58MOP1CQVZMOPzrMTtLw/h4ytNheaKJQa3nRWtGySg==} + /@web3modal/siwe@4.0.0-alpha.3(@types/react@18.2.48)(typescript@5.3.3): + resolution: {integrity: sha512-OLaILPs8AaPgiy297uWEF4q1I30/g7tcmJFeyLHQraN+6RK2B0m2Hw+HnLLwLXPu1KfksXD3QS21wbV2W4ekCA==} requiresBuild: true peerDependenciesMeta: react: @@ -3912,8 +3842,8 @@ packages: vue: optional: true dependencies: - '@web3modal/core': 4.0.0-alpha.2(@types/react@18.2.48)(react@18.2.0) - '@web3modal/scaffold-utils': 4.0.0-alpha.2(@types/react@18.2.48)(react@18.2.0) + '@web3modal/core': 4.0.0-alpha.3(@types/react@18.2.48)(react@18.2.0) + '@web3modal/scaffold-utils': 4.0.0-alpha.3(@types/react@18.2.48)(react@18.2.0) optionalDependencies: react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -3924,15 +3854,15 @@ packages: dev: false optional: true - /@web3modal/ui@4.0.0-alpha.2: - resolution: {integrity: sha512-4w/ajFZsIMHgVA9W5ppkaPllQyCo9ixBb/efRu5yfq0oIwLBKXnV/RRyzdsFFC1idzDeMkF2nrkCcHY7XklDvQ==} + /@web3modal/ui@4.0.0-alpha.3: + resolution: {integrity: sha512-5z51jAlXyiy/bXlc9GeTuo2awgxiGnP3CLEh2mICArmiURasA7WOEon4gMtv9Bt/Vuz4204OBuwOerSnN7VuYQ==} dependencies: lit: 3.1.0 qrcode: 1.5.3 dev: false - /@web3modal/wagmi@4.0.0-alpha.2(@types/react@18.2.48)(@wagmi/connectors@4.1.6)(@wagmi/core@2.3.1)(typescript@5.3.3)(viem@2.5.0): - resolution: {integrity: sha512-5V7AsKPKs3mgb1MAjyA+YXBTcdr0FHNklxPdaRkh/dSYRKaiDVkD7aJKku4Maskoyv9Mtv87vYZiDf/Ak6Ky2Q==} + /@web3modal/wagmi@4.0.0-alpha.3(@types/react@18.2.48)(@wagmi/connectors@4.1.10)(@wagmi/core@2.6.1)(typescript@5.3.3)(viem@2.5.0): + resolution: {integrity: sha512-NPPdDjoPCIk5CNqv3SnposspMhD8OsJRQmEaw043jvs+RLSdgKhdTAVy4Ns//Q4aNxobec5usS4KUyNe5Iz13A==} peerDependencies: '@wagmi/connectors': '>=4.0.0' '@wagmi/core': '>=2.0.0' @@ -3947,16 +3877,16 @@ packages: vue: optional: true dependencies: - '@wagmi/connectors': 4.1.6(@types/react@18.2.48)(@wagmi/core@2.3.1)(react-dom@18.2.0)(react-native@0.73.2)(react@18.2.0)(typescript@5.3.3)(viem@2.5.0) - '@wagmi/core': 2.3.1(@types/react@18.2.48)(react@18.2.0)(typescript@5.3.3)(viem@2.5.0) - '@web3modal/polyfills': 4.0.0-alpha.2 - '@web3modal/scaffold': 4.0.0-alpha.2(@types/react@18.2.48)(react@18.2.0) - '@web3modal/scaffold-react': 4.0.0-alpha.2(@types/react@18.2.48)(react-dom@18.2.0)(react@18.2.0) - '@web3modal/scaffold-utils': 4.0.0-alpha.2(@types/react@18.2.48)(react@18.2.0) - '@web3modal/scaffold-vue': 4.0.0-alpha.2(@types/react@18.2.48)(react@18.2.0)(vue@3.4.14) + '@wagmi/connectors': 4.1.10(@types/react@18.2.48)(@wagmi/core@2.6.1)(react-dom@18.2.0)(react-native@0.73.2)(react@18.2.0)(typescript@5.3.3)(viem@2.5.0) + '@wagmi/core': 2.6.1(@types/react@18.2.48)(react@18.2.0)(typescript@5.3.3)(viem@2.5.0) + '@web3modal/polyfills': 4.0.0-alpha.3 + '@web3modal/scaffold': 4.0.0-alpha.3(@types/react@18.2.48)(react@18.2.0) + '@web3modal/scaffold-react': 4.0.0-alpha.3(@types/react@18.2.48)(react-dom@18.2.0)(react@18.2.0) + '@web3modal/scaffold-utils': 4.0.0-alpha.3(@types/react@18.2.48)(react@18.2.0) + '@web3modal/scaffold-vue': 4.0.0-alpha.3(@types/react@18.2.48)(react@18.2.0)(vue@3.4.14) viem: 2.5.0(typescript@5.3.3) optionalDependencies: - '@web3modal/siwe': 4.0.0-alpha.2(@types/react@18.2.48)(typescript@5.3.3) + '@web3modal/siwe': 4.0.0-alpha.3(@types/react@18.2.48)(typescript@5.3.3) react: 18.2.0 react-dom: 18.2.0(react@18.2.0) vue: 3.4.14(typescript@5.3.3) @@ -3965,8 +3895,8 @@ packages: - typescript dev: false - /@web3modal/wallet@4.0.0-alpha.2: - resolution: {integrity: sha512-LKB/kfiC+xwbHg/rMNCuvh0DDqP9j4J1TTnRjyD4pIwsCA6sU9ea4+JGSRsC9M6P9PNLrqBqmuktDHg+px3jcQ==} + /@web3modal/wallet@4.0.0-alpha.3: + resolution: {integrity: sha512-hhdF9WDYSGh4U97neez3ENYOS/g8yF52TbCALLhu5n7bUh1xUpoDPGIk2Bf5jIpB4NpCfg2aH0TBdV8OaiahAg==} requiresBuild: true dependencies: zod: 3.22.4 diff --git a/dapps/web3modal/next/src/app/page.module.css b/dapps/web3modal/next/src/app/page.module.css index 17247e748..6d3c8d57f 100644 --- a/dapps/web3modal/next/src/app/page.module.css +++ b/dapps/web3modal/next/src/app/page.module.css @@ -1,8 +1,9 @@ .main { display: flex; flex-direction: column; - justify-content: space-between; + justify-content: center; align-items: center; padding: 6rem; + gap: 40px; min-height: 100vh; } \ No newline at end of file diff --git a/dapps/web3modal/next/src/app/page.tsx b/dapps/web3modal/next/src/app/page.tsx index 29d46b934..1be7eae9e 100644 --- a/dapps/web3modal/next/src/app/page.tsx +++ b/dapps/web3modal/next/src/app/page.tsx @@ -1,10 +1,11 @@ -import Connect from '@/components/Connect' +import Connect, { Custom } from '@/components/Connect' import styles from './page.module.css' export default function Home() { return (
+
) } diff --git a/dapps/web3modal/next/src/components/Connect.tsx b/dapps/web3modal/next/src/components/Connect.tsx index dc0926f04..7df494b10 100644 --- a/dapps/web3modal/next/src/components/Connect.tsx +++ b/dapps/web3modal/next/src/components/Connect.tsx @@ -1,5 +1,12 @@ 'use client' +import { useWeb3Modal } from "@web3modal/wagmi/react" + export default function Connect() { return } + +export function Custom(){ + const { open } = useWeb3Modal() + return +}