npm package: @nexm-io/bitsnap-utxo-wallet-adapter
Description: ## Get Started
Latest version: 0.0.3

# @nexm-io/bitsnap-utxo-wallet-adapter

## Get Started

```bash
npm i @nexm-io/bitsnap-utxo-wallet-adapter @tanstack/react-query
```

## Run Example

```bash
npm i & npm run build
cd example
npm i & npm run dev
```

## Introduction

Connect to UTXO based-model chains with similar [wagmi](https://github.com/wagmi-dev/wagmi) React hooks.


#### Support Connectors:
Support Bitcoin Wallet Connectors:
- [x] Unisat
- [x] Xverse
- [x] BitSnap UTXO Wallet
- [ ] OKX (Orbit/Moon)
- [ ] Leather
- [ ] Phantom
- [ ] Magic Eden

#### Example:
```jsx
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { BitsnapAdapterConfig, createClient, getDefaultProviders } from "@nexm-io/bitsnap-utxo-wallet-adapter";
import { UnisatConnector } from "@nexm-io/bitsnap-utxo-wallet-adapter/connectors/unisat";
import { XverseConnector } from "@nexm-io/bitsnap-utxo-wallet-adapter/connectors/xverse";
import { BitsnapConnector } from "@nexm-io/bitsnap-utxo-wallet-adapter/connectors/bitsnap";

const client = createClient({
    autoConnect: true,
    provider: getDefaultProviders,
    connectors: [
        new UnisatConnector(),
        new XverseConnector(),
        new BitsnapConnector()
    ],
})

const queryClient = new QueryClient({
    defaultOptions: {
        queries: {
            gcTime: 1_000 * 60 * 60 * 24, // 24 hours
            networkMode: 'offlineFirst',
            refetchOnWindowFocus: false,
            retry: 0,
        },
        mutations: {
            networkMode: 'offlineFirst',
        },
    },
})

function App() {
  return (
    <BitsnapAdapterConfig client={client}>
        <QueryClientProvider client={queryClient}>
            {children}
        </QueryClientProvider>
    </BitsnapAdapterConfig>
  )
}
```

### Connector

```jsx
import { useAccount, useConnect, useDisconnect, useNetwork, useSwitchNetwork, useClient, useBalances } from "@nexm-io/bitsnap-utxo-wallet-adapter";

function ConnectButton() {
  const { connect, connectors } = useConnect();

  return (
    <div>
      {connectors.map((connector) => (
        <button type="button" key={connector.id} onClick={() => connect({ connector})}>
          {connector.name}
        </button>
      ))}
    </div>
  )
}
```

### Hooks

```jsx
import { 
    useAccount, 
    useConnect, 
    useDisconnect, 
    useNetwork, 
    useSwitchNetwork, 
    useClient, 
    useBalances,
    useSignMessage,
    useSendNativeCoin
} from "@nexm-io/bitsnap-utxo-wallet-adapter";
```

#### Balance

```js
const { data } = useBalances({
  watch: true,
})
```

#### Sign Message

```js
const { data, isSuccess, isPending, signMessage } = useSignMessage();

signMessage({ message, address: senderAddress })

if (isSuccess) {
    console.log(data.signature)
}
```

#### Sign PSBT

```js
const { data, isSuccess, signPspt } = useSignPsbt();

signPspt({
  psbtBase64: psbtB64,
  options: {
    signInputs: [{ address: senderAddress, index: 0 }],
    autoFinalized: true,
    broadcast: true
  }
})

if (isSuccess) {
    console.log(data)
}
```

### Send Transaction

```js
const { data, isPending, isSuccess, sendNativeCoin } = useSendNativeCoin();

sendNativeCoin({ 
    addressTo, 
    amount: satAmount, 
    senderAddress: senderAddress, 
    options: {  feeRate: 10 } 
})

if (isSuccess) {
    console.log(data)
}
```