refactor: separate react export for siwe hooks, update lab examples a…

…nd configs

.changeset/config.json

@@ -7,5 +7,5 @@
   "access": "public",
   "baseBranch": "main",
   "updateInternalDependencies": "patch",
-  "ignore": ["@examples/*"]
+  "ignore": ["@examples/*", "@services/*"]
 }

apps/laboratory/src/components/AppKitAuthInfo.tsx

@@ -3,7 +3,7 @@
 import * as React from 'react'
 
 import { AppKitInfo } from './AppKitInfo'
-import { useSiweSession } from '@reown/appkit-siwe'
+import { useSiweSession } from '@reown/appkit-siwe/react'
 
 export function AppKitAuthInfo() {
   const { session, status } = useSiweSession()

apps/laboratory/src/components/Siwe/SiweData.tsx

@@ -9,7 +9,7 @@ import {
   Text
 } from '@chakra-ui/react'
 import { useSession } from 'next-auth/react'
-import type { SIWESession } from '@reown/appkit-siwe'
+import type { SIWESession } from '@reown/appkit-siwe/react'
 
 export function SiweData() {
   const { data, status } = useSession()

apps/laboratory/src/pages/api/auth/[...nextauth].ts

@@ -1,7 +1,11 @@
 import type { NextApiRequest, NextApiResponse } from 'next'
 import nextAuth from 'next-auth'
 import credentialsProvider from 'next-auth/providers/credentials'
-import { type SIWESession, getChainIdFromMessage, getAddressFromMessage } from '@reown/appkit-siwe'
+import {
+  type SIWESession,
+  getChainIdFromMessage,
+  getAddressFromMessage
+} from '@reown/appkit-siwe/react'
 import { verifySignature } from '../../../utils/SignatureUtil'
 
 declare module 'next-auth' {

apps/laboratory/src/utils/SiweUtils.ts

@@ -1,5 +1,9 @@
-import type { SIWECreateMessageArgs, SIWESession, SIWEVerifyMessageArgs } from '@reown/appkit-siwe'
-import { createSIWEConfig, formatMessage } from '@reown/appkit-siwe'
+import type {
+  SIWECreateMessageArgs,
+  SIWESession,
+  SIWEVerifyMessageArgs
+} from '@reown/appkit-siwe/react'
+import { createSIWEConfig, formatMessage } from '@reown/appkit-siwe/react'
 import { getCsrfToken, getSession, signIn, signOut } from 'next-auth/react'
 
 export const siweConfig = createSIWEConfig({

packages/siwe/core/utils/TypeUtils.ts

@@ -26,7 +26,7 @@ export interface SIWECreateMessageArgs {
 export type SIWEMessageArgs = {
   /**
    * @deprecated - Chains are set based on the `networks` you provided to the `createAppKit` function.
-   * @see https://docs.reown.com/appkit/react/core/installation#implementation
+   * @see https://docs.reown.com/appkit/react/core/options#networks
    */
   chains?: number[]
   methods?: string[]

packages/siwe/exports/index.ts

@@ -11,7 +11,6 @@ export {
   getChainIdFromMessage,
   verifySignature
 } from '../core/helpers/index.js'
-export { useSiweSession } from '../core/hooks/react.js'
 export * from '../core/utils/AppKitAuthUtil.js'
 
 export { formatMessage, getDidAddress, getDidChainId } from '@walletconnect/utils'

packages/siwe/core/hooks/react.ts → packages/siwe/exports/react.ts

@@ -1,6 +1,42 @@
 import { OptionsController } from '@reown/appkit-core'
 import { useEffect, useState } from 'react'
-import { SIWEController } from '../controller/SIWEController.js'
+
+import type {
+  SIWEClientMethods,
+  SIWEConfig,
+  SIWECreateMessageArgs,
+  SIWESession,
+  SIWEVerifyMessageArgs
+} from '../core/utils/TypeUtils.js'
+import { AppKitSIWEClient } from '../src/client.js'
+import { SIWEController } from '../core/controller/SIWEController.js'
+export {
+  getAddressFromMessage,
+  getChainIdFromMessage,
+  verifySignature
+} from '../core/helpers/index.js'
+export * from '../core/utils/AppKitAuthUtil.js'
+
+export { formatMessage, getDidAddress, getDidChainId } from '@walletconnect/utils'
+export { SIWEController, type SIWEControllerClient } from '../core/controller/SIWEController.js'
+export * from '../core/utils/TypeUtils.js'
+export type {
+  AppKitSIWEClient,
+  SIWEClientMethods,
+  SIWEConfig,
+  SIWECreateMessageArgs,
+  SIWESession,
+  SIWEVerifyMessageArgs
+}
+
+export * from '../scaffold/partials/w3m-connecting-siwe/index.js'
+export * from '../scaffold/views/w3m-connecting-siwe-view/index.js'
+
+export function createSIWEConfig(siweConfig: SIWEConfig) {
+  return new AppKitSIWEClient(siweConfig)
+}
+
+// -- Hooks ------------------------------------------------------------
 
 export function useSiweSession() {
   if (

packages/siwe/package.json

@@ -15,13 +15,32 @@
     "typecheck": "tsc --noEmit",
     "lint": "eslint . --ext .js,.jsx,.ts,.tsx"
   },
+  "exports": {
+    ".": {
+      "types": "./dist/types/exports/index.d.ts",
+      "import": "./dist/esm/exports/index.js",
+      "default": "./dist/esm/exports/index.js"
+    },
+    "./react": {
+      "types": "./dist/types/exports/react.d.ts",
+      "import": "./dist/esm/exports/react.js",
+      "default": "./dist/esm/exports/react.js"
+    }
+  },
+  "typesVersions": {
+    "*": {
+      "react": [
+        "./dist/types/exports/react.d.ts"
+      ]
+    }
+  },
   "dependencies": {
-    "@walletconnect/utils": "2.17.0",
     "@reown/appkit-core": "workspace:*",
     "@reown/appkit-ui": "workspace:*",
     "@reown/appkit-common": "workspace:*",
     "@reown/appkit-wallet": "workspace:*",
     "@reown/appkit-utils": "workspace:*",
+    "@walletconnect/utils": "2.17.0",
     "valtio": "1.11.2",
     "lit": "3.1.0"
   },

packages/siwe/tsconfig.json

@@ -2,7 +2,8 @@
   "compilerOptions": {
     "composite": true,
     "outDir": "./dist/esm",
-    "declarationDir": "./dist/types"
+    "declarationDir": "./dist/types",
+    "removeComments": false
   },
   "extends": "../../tsconfig.json",
   "include": ["exports", "src", "core", "scaffold", "tests"]