@useragent-kit/react

React hooks for browser Triangle User Agent integrations built on top of @useragent-kit/sdk.

Use this package when your host shell is React-based and you want typed hooks for:

• SDK access
• wallet state
• host-api outcome handling
• extension dispatch

Install

npm install @useragent-kit/react @useragent-kit/sdk react

Minimal example

import { HostSdkProvider, useWallet } from "@useragent-kit/react";

function WalletSummary() {
  const { state, address, loadMnemonic } = useWallet();

  return (
    <div>
      <div>State: {state}</div>
      <div>Address: {address ?? "locked"}</div>
      <button
        onClick={() =>
          loadMnemonic(
            "abandon abandon abandon abandon abandon abandon abandon abandon abandon abandon abandon about",
          )
        }
      >
        Load demo wallet
      </button>
    </div>
  );
}

export function App() {
  return (
    <HostSdkProvider>
      <WalletSummary />
    </HostSdkProvider>
  );
}

Compatibility

• React 18+
• peer dependency on @useragent-kit/sdk

Documentation

• Browser host guide: https://github.com/paritytech/useragent-kit/blob/main/site/src/content/docs/getting-started/web-host.md
• Web integration: https://github.com/paritytech/useragent-kit/blob/main/site/src/content/docs/getting-started/web.md