Skip to content

<WalletProvider> ​

<WalletProvider> es el proveedor de contexto de React para la wallet integrada.

Ejemplo ​

tsx
// src/index.tsx
import { createWallet } from '@money-sdk/core'
import { WalletProvider } from '@money-sdk/react'

const wallet = createWallet(/* ... */)

function Root() {
  return (
    <WalletProvider wallet={wallet}>
      <App />
    </WalletProvider>
  )
}

Referencia ​

props.wallet ​

La wallet inicializada tal y como la devuelve createWallet.

Hooks ​

Los siguientes hooks se exportan desde @money-sdk/react y deben llamarse dentro de un <WalletProvider>:

useWallet() ​

Devuelve la instancia Wallet pasada al proveedor. Úsalo cuando necesites llamar a métodos como getProvider, disconnect o experimental_expand fuera del widget.

tsx
import { useWallet } from '@money-sdk/react'

function ConnectButton() {
  const wallet = useWallet()

  const handleClick = async () => {
    const solana = await wallet.getProvider('solana')
    await solana?.connect()
  }

  return <button onClick={handleClick}>Connect</button>
}

useConnected() ​

Devuelve un booleano que indica si el usuario ha conectado la wallet a tu dApp. Útil para controlar el acceso a la UI:

tsx
import { useConnected } from '@money-sdk/react'

function App() {
  const connected = useConnected()

  return connected ? <Dashboard /> : <Landing />
}

useObservable(observable) ​

Hook de bajo nivel para suscribirse a un observable interno expuesto por la instancia de la wallet. Por lo general no necesitarás esto directamente: prefiere useConnected para el estado de conexión.