@meshconnect/uwc-react 0.7.1 → 0.8.0

package/dist/hooks/index.d.ts

@@ -6,6 +6,7 @@ export * from './useWallets';
 export * from './useWallet';
 export * from './useNetworks';
 export * from './useSignMessage';
+export * from './useSignTypedData';
 export * from './useTransaction';
 export * from './useWalletCapabilities';
 export * from './useDetectedWallets';

package/dist/hooks/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAA;AAC/B,cAAc,oBAAoB,CAAA;AAClC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,cAAc,CAAA;AAC5B,cAAc,cAAc,CAAA;AAC5B,cAAc,aAAa,CAAA;AAC3B,cAAc,eAAe,CAAA;AAC7B,cAAc,kBAAkB,CAAA;AAChC,cAAc,kBAAkB,CAAA;AAChC,cAAc,yBAAyB,CAAA;AACvC,cAAc,sBAAsB,CAAA;AACpC,cAAc,4BAA4B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAA;AAC/B,cAAc,oBAAoB,CAAA;AAClC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,cAAc,CAAA;AAC5B,cAAc,cAAc,CAAA;AAC5B,cAAc,aAAa,CAAA;AAC3B,cAAc,eAAe,CAAA;AAC7B,cAAc,kBAAkB,CAAA;AAChC,cAAc,oBAAoB,CAAA;AAClC,cAAc,kBAAkB,CAAA;AAChC,cAAc,yBAAyB,CAAA;AACvC,cAAc,sBAAsB,CAAA;AACpC,cAAc,4BAA4B,CAAA"}

package/dist/hooks/index.js

@@ -6,6 +6,7 @@ export * from './useWallets';
 export * from './useWallet';
 export * from './useNetworks';
 export * from './useSignMessage';
+export * from './useSignTypedData';
 export * from './useTransaction';
 export * from './useWalletCapabilities';
 export * from './useDetectedWallets';

package/dist/hooks/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAA;AAC/B,cAAc,oBAAoB,CAAA;AAClC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,cAAc,CAAA;AAC5B,cAAc,cAAc,CAAA;AAC5B,cAAc,aAAa,CAAA;AAC3B,cAAc,eAAe,CAAA;AAC7B,cAAc,kBAAkB,CAAA;AAChC,cAAc,kBAAkB,CAAA;AAChC,cAAc,yBAAyB,CAAA;AACvC,cAAc,sBAAsB,CAAA;AACpC,cAAc,4BAA4B,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAA;AAC/B,cAAc,oBAAoB,CAAA;AAClC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,cAAc,CAAA;AAC5B,cAAc,cAAc,CAAA;AAC5B,cAAc,aAAa,CAAA;AAC3B,cAAc,eAAe,CAAA;AAC7B,cAAc,kBAAkB,CAAA;AAChC,cAAc,oBAAoB,CAAA;AAClC,cAAc,kBAAkB,CAAA;AAChC,cAAc,yBAAyB,CAAA;AACvC,cAAc,sBAAsB,CAAA;AACpC,cAAc,4BAA4B,CAAA"}

package/dist/hooks/useSignTypedData.d.ts

@@ -0,0 +1,26 @@
+import type { UseSignTypedDataReturn } from '@meshconnect/uwc-types';
+/**
+ * Hook for signing EIP-712 typed structured data (eth_signTypedData_v4).
+ *
+ * Used by ERC-3009 (Transfer With Authorization) and EIP-2612 (Permit) relay
+ * flows — the user signs an off-chain authorization and Mesh's backend submits
+ * the transaction and pays gas. EVM-only (eip155); throws for TON connections.
+ *
+ * @returns Object containing signTypedData function, loading state, last signature, and error
+ * @throws Error if used outside of ConnectionProvider
+ * @example
+ * ```tsx
+ * const { signTypedData, isLoading, signature } = useSignTypedData()
+ *
+ * const handleSign = async () => {
+ *   try {
+ *     const sig = await signTypedData(typedData)
+ *     // send sig to the relay endpoint
+ *   } catch (error) {
+ *     console.error('Failed to sign:', error)
+ *   }
+ * }
+ * ```
+ */
+export declare function useSignTypedData(): UseSignTypedDataReturn;
+//# sourceMappingURL=useSignTypedData.d.ts.map

package/dist/hooks/useSignTypedData.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSignTypedData.d.ts","sourceRoot":"","sources":["../../src/hooks/useSignTypedData.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAEV,sBAAsB,EAEvB,MAAM,wBAAwB,CAAA;AAE/B;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,gBAAgB,IAAI,sBAAsB,CAyCzD"}

package/dist/hooks/useSignTypedData.js

@@ -0,0 +1,62 @@
+import { useContext, useCallback, useState } from 'react';
+import { ConnectionContext } from '../providers/ConnectionProvider';
+/**
+ * Hook for signing EIP-712 typed structured data (eth_signTypedData_v4).
+ *
+ * Used by ERC-3009 (Transfer With Authorization) and EIP-2612 (Permit) relay
+ * flows — the user signs an off-chain authorization and Mesh's backend submits
+ * the transaction and pays gas. EVM-only (eip155); throws for TON connections.
+ *
+ * @returns Object containing signTypedData function, loading state, last signature, and error
+ * @throws Error if used outside of ConnectionProvider
+ * @example
+ * ```tsx
+ * const { signTypedData, isLoading, signature } = useSignTypedData()
+ *
+ * const handleSign = async () => {
+ *   try {
+ *     const sig = await signTypedData(typedData)
+ *     // send sig to the relay endpoint
+ *   } catch (error) {
+ *     console.error('Failed to sign:', error)
+ *   }
+ * }
+ * ```
+ */
+export function useSignTypedData() {
+    const context = useContext(ConnectionContext);
+    if (!context) {
+        throw new Error('useSignTypedData must be used within a ConnectionProvider');
+    }
+    const { connector, session } = context;
+    const [isLoading, setIsLoading] = useState(false);
+    const [signature, setSignature] = useState();
+    const [error, setError] = useState();
+    const signTypedData = useCallback(async (typedData) => {
+        if (!session.activeAddress) {
+            throw new Error('No wallet connected');
+        }
+        setIsLoading(true);
+        setError(undefined);
+        try {
+            const sig = await connector.signTypedData(typedData);
+            setSignature(sig);
+            return sig;
+        }
+        catch (err) {
+            const walletError = err;
+            setError(walletError);
+            throw err;
+        }
+        finally {
+            setIsLoading(false);
+        }
+    }, [connector, session.activeAddress]);
+    return {
+        signTypedData,
+        isLoading,
+        signature,
+        error
+    };
+}
+//# sourceMappingURL=useSignTypedData.js.map

package/dist/hooks/useSignTypedData.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSignTypedData.js","sourceRoot":"","sources":["../../src/hooks/useSignTypedData.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAA;AAOnE;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,UAAU,gBAAgB;IAC9B,MAAM,OAAO,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAA;IAE7C,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,MAAM,IAAI,KAAK,CAAC,2DAA2D,CAAC,CAAA;IAC9E,CAAC;IAED,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,OAAO,CAAA;IACtC,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IACjD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,EAAsB,CAAA;IAChE,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,EAA2B,CAAA;IAE7D,MAAM,aAAa,GAAG,WAAW,CAC/B,KAAK,EAAE,SAA0B,EAAmB,EAAE;QACpD,IAAI,CAAC,OAAO,CAAC,aAAa,EAAE,CAAC;YAC3B,MAAM,IAAI,KAAK,CAAC,qBAAqB,CAAC,CAAA;QACxC,CAAC;QAED,YAAY,CAAC,IAAI,CAAC,CAAA;QAClB,QAAQ,CAAC,SAAS,CAAC,CAAA;QACnB,IAAI,CAAC;YACH,MAAM,GAAG,GAAG,MAAM,SAAS,CAAC,aAAa,CAAC,SAAS,CAAC,CAAA;YACpD,YAAY,CAAC,GAAG,CAAC,CAAA;YACjB,OAAO,GAAG,CAAA;QACZ,CAAC;QAAC,OAAO,GAAG,EAAE,CAAC;YACb,MAAM,WAAW,GAAG,GAAkB,CAAA;YACtC,QAAQ,CAAC,WAAW,CAAC,CAAA;YACrB,MAAM,GAAG,CAAA;QACX,CAAC;gBAAS,CAAC;YACT,YAAY,CAAC,KAAK,CAAC,CAAA;QACrB,CAAC;IACH,CAAC,EACD,CAAC,SAAS,EAAE,OAAO,CAAC,aAAa,CAAC,CACnC,CAAA;IAED,OAAO;QACL,aAAa;QACb,SAAS;QACT,SAAS;QACT,KAAK;KACN,CAAA;AACH,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@meshconnect/uwc-react",
-  "version": "0.7.1",
+  "version": "0.8.0",
   "description": "React hooks and components for Universal Wallet Connector",
   "type": "module",
   "main": "dist/index.js",
@@ -16,8 +16,8 @@
     "src"
   ],
   "dependencies": {
-    "@meshconnect/uwc-core": "0.8.1",
-    "@meshconnect/uwc-types": "0.14.0"
+    "@meshconnect/uwc-core": "0.9.0",
+    "@meshconnect/uwc-types": "0.15.0"
   },
   "peerDependencies": {
     "react": "^18.0.0",

package/src/hooks/index.ts

@@ -6,6 +6,7 @@ export * from './useWallets'
 export * from './useWallet'
 export * from './useNetworks'
 export * from './useSignMessage'
+export * from './useSignTypedData'
 export * from './useTransaction'
 export * from './useWalletCapabilities'
 export * from './useDetectedWallets'

package/src/hooks/useSignTypedData.test.tsx

@@ -0,0 +1,252 @@
+import React, { act } from 'react'
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
+import { createRoot } from 'react-dom/client'
+import { ConnectionContext } from '../providers/ConnectionProvider'
+import { useSignTypedData } from './useSignTypedData'
+import type {
+  EIP712TypedData,
+  UseSignTypedDataReturn
+} from '@meshconnect/uwc-types'
+
+// ---------------------------------------------------------------------------
+// Fixtures + helpers
+// ---------------------------------------------------------------------------
+
+const USDC_TYPED_DATA: EIP712TypedData = {
+  domain: {
+    name: 'USD Coin',
+    version: '2',
+    chainId: 1,
+    verifyingContract: '0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48'
+  },
+  types: {
+    TransferWithAuthorization: [
+      { name: 'from', type: 'address' },
+      { name: 'to', type: 'address' },
+      { name: 'value', type: 'uint256' },
+      { name: 'validAfter', type: 'uint256' },
+      { name: 'validBefore', type: 'uint256' },
+      { name: 'nonce', type: 'bytes32' }
+    ]
+  },
+  primaryType: 'TransferWithAuthorization',
+  message: {
+    from: '0xabc',
+    to: '0xdef',
+    value: '1000000',
+    validAfter: 0,
+    validBefore: 9999999999,
+    nonce: '0xdeadbeef'
+  }
+}
+
+/** Minimal stub that satisfies ConnectionContextValue's connector shape. */
+function makeConnector(
+  signTypedData: (typedData: EIP712TypedData) => Promise<string>
+) {
+  return {
+    signTypedData,
+    getSession: () => ({ isConnected: false }),
+    isReady: () => true,
+    subscribe: () => () => {},
+    getWallets: () => [],
+    getNetworks: () => []
+  }
+}
+
+/**
+ * Minimal context value that wraps a connector stub. Pass `{ activeAddress }`
+ * as an object (not a bare arg) so an explicit `undefined` survives.
+ */
+function makeContextValue(
+  connector: ReturnType<typeof makeConnector>,
+  { activeAddress }: { activeAddress: string | undefined } = {
+    activeAddress: '0xUserAddress'
+  }
+) {
+  return {
+    connector,
+    session: {
+      isConnected: activeAddress !== undefined,
+      walletId: undefined,
+      networkId: undefined,
+      activeAddress
+    },
+    wallets: [],
+    networks: [],
+    isReady: true
+  }
+}
+
+/**
+ * Renders `useSignTypedData` inside a component that exposes its return value
+ * via a captured ref. Mirrors useSignSolanaTransaction.test.tsx: createRoot +
+ * act, no @testing-library/react (not installed in this package).
+ */
+function renderHookInContext(
+  contextValue: ReturnType<typeof makeContextValue>
+) {
+  const captured: { current: UseSignTypedDataReturn | null } = { current: null }
+
+  function Capture() {
+    captured.current = useSignTypedData()
+    return null
+  }
+
+  const container = document.createElement('div')
+  document.body.appendChild(container)
+  const root = createRoot(container)
+
+  async function render() {
+    await act(async () => {
+      root.render(
+        <ConnectionContext.Provider value={contextValue as never}>
+          <Capture />
+        </ConnectionContext.Provider>
+      )
+    })
+  }
+
+  async function unmount() {
+    await act(async () => {
+      root.unmount()
+    })
+    document.body.removeChild(container)
+  }
+
+  return { captured, render, unmount }
+}
+
+// ---------------------------------------------------------------------------
+// Tests
+// ---------------------------------------------------------------------------
+
+describe('useSignTypedData', () => {
+  let container: HTMLDivElement
+  let root: ReturnType<typeof createRoot>
+
+  beforeEach(() => {
+    container = document.createElement('div')
+    document.body.appendChild(container)
+    root = createRoot(container)
+  })
+
+  afterEach(async () => {
+    await act(async () => {
+      root.unmount()
+    })
+    if (document.body.contains(container)) {
+      document.body.removeChild(container)
+    }
+  })
+
+  it('throws when rendered outside ConnectionProvider', () => {
+    function BareHook() {
+      useSignTypedData()
+      return null
+    }
+
+    expect(() => {
+      const errorSpy = vi.spyOn(console, 'error').mockImplementation(() => {})
+      try {
+        act(() => {
+          root.render(<BareHook />)
+        })
+      } finally {
+        errorSpy.mockRestore()
+      }
+    }).toThrowError('useSignTypedData must be used within a ConnectionProvider')
+  })
+
+  it('returns the signature from connector.signTypedData on success', async () => {
+    const mockSign = vi.fn().mockResolvedValue('0xtypedsig')
+    const ctxValue = makeContextValue(makeConnector(mockSign))
+    const { captured, render, unmount } = renderHookInContext(ctxValue)
+
+    await render()
+    expect(captured.current).not.toBeNull()
+
+    let result: string | undefined
+    await act(async () => {
+      result = await captured.current!.signTypedData(USDC_TYPED_DATA)
+    })
+
+    expect(mockSign).toHaveBeenCalledOnce()
+    expect(mockSign).toHaveBeenCalledWith(USDC_TYPED_DATA)
+    expect(result).toBe('0xtypedsig')
+    expect(captured.current!.signature).toBe('0xtypedsig')
+    await unmount()
+  })
+
+  it('sets error state and re-throws when connector rejects', async () => {
+    const walletError = { code: 4001, message: 'User rejected' }
+    const mockSign = vi.fn().mockRejectedValue(walletError)
+    const ctxValue = makeContextValue(makeConnector(mockSign))
+    const { captured, render, unmount } = renderHookInContext(ctxValue)
+
+    await render()
+
+    let thrownError: unknown
+    await act(async () => {
+      try {
+        await captured.current!.signTypedData(USDC_TYPED_DATA)
+      } catch (err) {
+        thrownError = err
+      }
+    })
+
+    expect(thrownError).toBe(walletError)
+    expect(captured.current!.error).toBe(walletError)
+    await unmount()
+  })
+
+  it('sets isLoading=true during call and false after success', async () => {
+    let resolveSign!: (v: string) => void
+    const pendingSign = new Promise<string>(res => {
+      resolveSign = res
+    })
+    const mockSign = vi.fn().mockReturnValue(pendingSign)
+    const ctxValue = makeContextValue(makeConnector(mockSign))
+    const { captured, render, unmount } = renderHookInContext(ctxValue)
+
+    await render()
+
+    let callPromise: Promise<string>
+    await act(async () => {
+      callPromise = captured.current!.signTypedData(USDC_TYPED_DATA)
+    })
+
+    expect(captured.current!.isLoading).toBe(true)
+
+    await act(async () => {
+      resolveSign('0xsig')
+      await callPromise!
+    })
+
+    expect(captured.current!.isLoading).toBe(false)
+    await unmount()
+  })
+
+  it('throws "No wallet connected" when there is no active address', async () => {
+    const mockSign = vi.fn()
+    const ctxValue = makeContextValue(makeConnector(mockSign), {
+      activeAddress: undefined
+    })
+    const { captured, render, unmount } = renderHookInContext(ctxValue)
+
+    await render()
+
+    let thrownError: unknown
+    await act(async () => {
+      try {
+        await captured.current!.signTypedData(USDC_TYPED_DATA)
+      } catch (err) {
+        thrownError = err
+      }
+    })
+
+    expect((thrownError as Error).message).toBe('No wallet connected')
+    expect(mockSign).not.toHaveBeenCalled()
+    await unmount()
+  })
+})

package/src/hooks/useSignTypedData.ts

@@ -0,0 +1,73 @@
+import { useContext, useCallback, useState } from 'react'
+import { ConnectionContext } from '../providers/ConnectionProvider'
+import type {
+  EIP712TypedData,
+  UseSignTypedDataReturn,
+  WalletError
+} from '@meshconnect/uwc-types'
+
+/**
+ * Hook for signing EIP-712 typed structured data (eth_signTypedData_v4).
+ *
+ * Used by ERC-3009 (Transfer With Authorization) and EIP-2612 (Permit) relay
+ * flows — the user signs an off-chain authorization and Mesh's backend submits
+ * the transaction and pays gas. EVM-only (eip155); throws for TON connections.
+ *
+ * @returns Object containing signTypedData function, loading state, last signature, and error
+ * @throws Error if used outside of ConnectionProvider
+ * @example
+ * ```tsx
+ * const { signTypedData, isLoading, signature } = useSignTypedData()
+ *
+ * const handleSign = async () => {
+ *   try {
+ *     const sig = await signTypedData(typedData)
+ *     // send sig to the relay endpoint
+ *   } catch (error) {
+ *     console.error('Failed to sign:', error)
+ *   }
+ * }
+ * ```
+ */
+export function useSignTypedData(): UseSignTypedDataReturn {
+  const context = useContext(ConnectionContext)
+
+  if (!context) {
+    throw new Error('useSignTypedData must be used within a ConnectionProvider')
+  }
+
+  const { connector, session } = context
+  const [isLoading, setIsLoading] = useState(false)
+  const [signature, setSignature] = useState<string | undefined>()
+  const [error, setError] = useState<WalletError | undefined>()
+
+  const signTypedData = useCallback(
+    async (typedData: EIP712TypedData): Promise<string> => {
+      if (!session.activeAddress) {
+        throw new Error('No wallet connected')
+      }
+
+      setIsLoading(true)
+      setError(undefined)
+      try {
+        const sig = await connector.signTypedData(typedData)
+        setSignature(sig)
+        return sig
+      } catch (err) {
+        const walletError = err as WalletError
+        setError(walletError)
+        throw err
+      } finally {
+        setIsLoading(false)
+      }
+    },
+    [connector, session.activeAddress]
+  )
+
+  return {
+    signTypedData,
+    isLoading,
+    signature,
+    error
+  }
+}