merge main into v-3/network-button

reown-com · Sep 6, 2023 · cde78a6 · cde78a6
2 parents f6cc4a3 + 864b7b2
commit cde78a6
Show file tree

Hide file tree

Showing 36 changed files with 487 additions and 164 deletions.
diff --git a/apps/gallery/package.json b/apps/gallery/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@apps/gallery",
-  "version": "3.0.0-alpha.5",
+  "version": "3.0.0-73ed03f2",
   "private": true,
   "main": "index.js",
   "scripts": {
@@ -9,7 +9,7 @@
     "lint": "eslint . --ext .js,.jsx,.ts,.tsx"
   },
   "dependencies": {
-    "@web3modal/ui": "3.0.0-alpha.5",
+    "@web3modal/ui": "3.0.0-73ed03f2",
     "lit": "2.8.0",
     "storybook": "7.4.0"
   },

diff --git a/apps/gallery/stories/composites/wui-connect-button.stories.ts b/apps/gallery/stories/composites/wui-connect-button.stories.ts
@@ -9,30 +9,23 @@ export default {
   title: 'Composites/wui-connect-button',
   args: {
     size: 'md',
-    disabled: false,
-    loading: false,
-    text: 'Connect Wallet'
+    loading: false
   },
   argTypes: {
     size: {
       options: ['sm', 'md'],
       control: { type: 'select' }
     },
-    disabled: {
-      control: { type: 'boolean' }
-    },
     loading: {
       control: { type: 'boolean' }
     }
   }
 } as Component
 
 export const Default: Component = {
-  render: args =>
-    html`<wui-connect-button
-      size=${args.size}
-      ?loading=${args.loading}
-      ?disabled=${args.disabled}
-      text=${args.text}
-    ></wui-connect-button>`
+  render: args => html`
+    <wui-connect-button size=${args.size} ?loading=${args.loading}>
+      ${args.loading ? 'Connecting...' : 'Connect Wallet'}
+    </wui-connect-button>
+  `
 }
diff --git a/apps/laboratory/package.json b/apps/laboratory/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@apps/laboratory",
-  "version": "3.0.0-alpha.5",
+  "version": "3.0.0-73ed03f2",
   "private": true,
   "scripts": {
     "dev:laboratory": "next dev",
@@ -11,9 +11,9 @@
     "@chakra-ui/react": "2.8.0",
     "@emotion/react": "11.11.1",
     "@emotion/styled": "11.11.0",
-    "@sentry/browser": "7.66.0",
-    "@sentry/react": "7.66.0",
-    "@web3modal/wagmi": "3.0.0-alpha.5",
+    "@sentry/browser": "7.67.0",
+    "@sentry/react": "7.67.0",
+    "@web3modal/wagmi": "3.0.0-73ed03f2",
     "framer-motion": "10.16.4",
     "next": "13.4.19",
     "react-icons": "4.10.1",

diff --git a/apps/laboratory/src/components/ConnectButton.tsx b/apps/laboratory/src/components/ConnectButton.tsx
@@ -1,13 +1,10 @@
 import { Button, useToast } from '@chakra-ui/react'
-import { useWeb3Modal } from '@web3modal/wagmi/react'
-import { useAccount, useDisconnect, useSignMessage } from 'wagmi'
+import { useAccount, useSignMessage } from 'wagmi'
 
 export function ConnectButton() {
   const toast = useToast()
-  const { isConnected, address } = useAccount()
-  const { disconnect } = useDisconnect()
+  const { isConnected } = useAccount()
   const { signMessageAsync } = useSignMessage({ message: 'Hello Web3Modal!' })
-  const modal = useWeb3Modal()
 
   async function onSignMessage() {
     try {
@@ -23,13 +20,10 @@ export function ConnectButton() {
     }
   }
 
-  return isConnected ? (
+  return (
     <>
-      <Button onClick={() => modal.open()}>{address}</Button>
-      <Button onClick={() => disconnect()}>Disconnect</Button>
-      <Button onClick={() => onSignMessage()}>Sign Message</Button>
+      <w3m-button />
+      {isConnected ? <Button onClick={() => onSignMessage()}>Sign Message</Button> : null}
     </>
-  ) : (
-    <Button onClick={() => modal.open()}>Connect Wallet</Button>
   )
 }
diff --git a/apps/laboratory/src/components/NetworksButton.tsx b/apps/laboratory/src/components/NetworksButton.tsx
@@ -1,12 +1,3 @@
-import { Button } from '@chakra-ui/react'
-import { useWeb3Modal } from '@web3modal/wagmi/react'
-import { useNetwork } from 'wagmi'
-
 export function NetworksButton() {
-  const { chain } = useNetwork()
-  const modal = useWeb3Modal()
-
-  return (
-    <Button onClick={() => modal.open({ view: 'Networks' })}>{chain?.name ?? 'Networks'}</Button>
-  )
+  return <w3m-network-button />
 }
diff --git a/apps/laboratory/src/pages/index.tsx b/apps/laboratory/src/pages/index.tsx
@@ -46,7 +46,8 @@ export const wagmiConfig = defaultWagmiConfig({ chains, projectId, appName: 'Web
 export const modal = createWeb3Modal({
   wagmiConfig,
   projectId,
-  chains
+  chains,
+  defaultChain: zora
 })
 
 export default function HomePage() {

diff --git a/examples/react-wagmi/index.html b/examples/react-wagmi/index.html
@@ -7,6 +7,6 @@
   </head>
   <body>
     <div id="app"></div>
-    <script type="module" src="/src/main.jsx"></script>
+    <script type="module" src="/src/main.tsx"></script>
   </body>
 </html>
diff --git a/examples/react-wagmi/package.json b/examples/react-wagmi/package.json
@@ -1,13 +1,13 @@
 {
   "name": "@examples/react-wagmi",
   "private": true,
-  "version": "3.0.0-alpha.5",
+  "version": "3.0.0-73ed03f2",
   "scripts": {
     "dev:example": "vite --port 3001",
-    "build:example": "vite build"
+    "build:examples": "vite build"
   },
   "dependencies": {
-    "@web3modal/wagmi": "3.0.0-alpha.5"
+    "@web3modal/wagmi": "3.0.0-73ed03f2"
   },
   "devDependencies": {
     "@vitejs/plugin-react": "4.0.4"

diff --git a/examples/react-wagmi/src/App.jsx → examples/react-wagmi/src/App.tsx b/examples/react-wagmi/src/App.jsx → examples/react-wagmi/src/App.tsx
@@ -2,7 +2,7 @@ import { createWeb3Modal, defaultWagmiConfig, useWeb3Modal } from '@web3modal/wa
 import { WagmiConfig } from 'wagmi'
 import { arbitrum, mainnet } from 'wagmi/chains'
 
-// 1. Get projectId
+// @ts-expect-error 1. Get projectId
 const projectId = import.meta.env.VITE_PROJECT_ID
 if (!projectId) {
   throw new Error('VITE_PROJECT_ID is not set')
@@ -20,7 +20,7 @@ createWeb3Modal({
   themeMode: 'light',
   themeVariables: {
     '--w3m-color-mix': '#00DCFF',
-    '--w3m-color-mix-strength': 50
+    '--w3m-color-mix-strength': 20
   }
 })
 
@@ -30,8 +30,13 @@ export default function App() {
 
   return (
     <WagmiConfig config={wagmiConfig}>
-      <button onClick={() => modal.open()}>Open Connect Modal</button>
-      <button onClick={() => modal.open({ view: 'Networks' })}>Open Network Modal</button>
+      <w3m-button />
+      <w3m-network-button />
+      <w3m-connect-button />
+      <w3m-account-button />
+
+      <button onClick={() => modal.open()}>Connect Wallet</button>
+      <button onClick={() => modal.open({ view: 'Networks' })}>Choose Network</button>
     </WagmiConfig>
   )
 }
diff --git a/examples/react-wagmi/src/main.jsx → examples/react-wagmi/src/main.tsx b/examples/react-wagmi/src/main.jsx → examples/react-wagmi/src/main.tsx
diff --git a/examples/react-wagmi/tsconfig.json b/examples/react-wagmi/tsconfig.json
@@ -0,0 +1,9 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "jsx": "preserve",
+    "noEmit": true,
+    "incremental": true
+  },
+  "include": ["src"]
+}
diff --git a/examples/vue-wagmi/package.json b/examples/vue-wagmi/package.json
@@ -1,13 +1,13 @@
 {
   "name": "@examples/vue-wagmi",
   "private": true,
-  "version": "3.0.0-alpha.5",
+  "version": "3.0.0-73ed03f2",
   "scripts": {
     "dev:example": "vite --port 3002",
-    "build:example": "vite build"
+    "build:examples": "vite build"
   },
   "dependencies": {
-    "@web3modal/wagmi": "3.0.0-alpha.5"
+    "@web3modal/wagmi": "3.0.0-73ed03f2"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "4.3.4"

diff --git a/examples/vue-wagmi/src/App.vue b/examples/vue-wagmi/src/App.vue
@@ -1,8 +1,8 @@
 <script lang="ts" setup>
-import { mainnet, arbitrum } from '@wagmi/core/chains'
-import { createWeb3Modal, useWeb3Modal, defaultWagmiConfig } from '@web3modal/wagmi/vue'
+import { arbitrum, mainnet } from '@wagmi/core/chains'
+import { createWeb3Modal, defaultWagmiConfig, useWeb3Modal } from '@web3modal/wagmi/vue'
 
-// 1. Get projectId
+// @ts-expect-error 1. Get projectId
 const projectId = import.meta.env.VITE_PROJECT_ID
 if (!projectId) {
   throw new Error('VITE_PROJECT_ID is not set')
@@ -20,7 +20,7 @@ createWeb3Modal({
   themeMode: 'light',
   themeVariables: {
     '--w3m-color-mix': '#00BB7F',
-    '--w3m-color-mix-strength': 40
+    '--w3m-color-mix-strength': 20
   }
 })
 
@@ -29,6 +29,11 @@ const modal = useWeb3Modal()
 </script>
 
 <template>
+  <w3m-button />
+  <w3m-network-button />
+  <w3m-connect-button />
+  <w3m-account-button />
+
   <button @click="modal.open()">Open Connect Modal</button>
   <button @click="modal.open({ view: 'Networks' })">Open Network Modal</button>
 </template>
diff --git a/lerna.json b/lerna.json
@@ -9,6 +9,6 @@
     "apps/*",
     "examples/*"
   ],
-  "version": "3.0.0-alpha.5",
+  "version": "3.0.0-73ed03f2",
   "$schema": "node_modules/lerna/schemas/lerna-schema.json"
 }