Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .github/CONTRIBUTING.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ Thanks for your interest in contributing to MBGA! Please take a moment to review
Clone the repo and install dependencies:

```bash
git clone https://github.com/quantumlyy/mbga.git
git clone https://github.com/refrakts/mbga.git
cd mbga
pnpm install
```
Expand Down
2 changes: 1 addition & 1 deletion .github/workflows/test.yml
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ jobs:
uses: codecov/codecov-action@v5
with:
token: ${{ secrets.CODECOV_TOKEN }}
slug: Quantumlyy/mbga
slug: refrakts/mbga
files: ./coverage/lcov.info
flags: unittests
fail_ci_if_error: true
Expand Down
2 changes: 1 addition & 1 deletion LICENSE
Original file line number Diff line number Diff line change
Expand Up @@ -186,7 +186,7 @@
same "printed page" as the copyright notice for easier
identification within third-party archives.

Copyright [yyyy] [name of copyright owner]
Copyright 2026 Nejc Drobnič

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
Expand Down
2 changes: 1 addition & 1 deletion NEXT_TASK.md
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ Requires auth above; atomic swaps between BTC/Lightning/Spark and other assets v
## Prompt

```
Work on the quantumlyy/mbga repo.
Work on the refrakts/mbga repo.

Your current task: **Flashnet swaps and clawbacks**

Expand Down
15 changes: 8 additions & 7 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
Reactive primitives for Spark apps.

[![npm version](https://img.shields.io/npm/v/mbga)](https://www.npmjs.com/package/mbga)
[![license](https://img.shields.io/npm/l/mbga)](https://github.com/quantumlyy/mbga/blob/main/LICENSE)
[![codecov](https://codecov.io/gh/quantumlyy/mbga/graph/badge.svg?token=4UcviQKuL6)](https://codecov.io/gh/quantumlyy/mbga)
[![license](https://img.shields.io/npm/l/mbga)](https://github.com/refrakts/mbga/blob/main/LICENSE)
[![codecov](https://codecov.io/gh/refrakts/mbga/graph/badge.svg?token=4UcviQKuL6)](https://codecov.io/gh/refrakts/mbga)

## Features

Expand All @@ -32,11 +32,11 @@ pnpm add mbga @mbga/connectors @tanstack/react-query

```ts
import { createConfig, sparkMainnet } from 'mbga'
import { satsConnect } from 'mbga/connectors'
import { xverse } from 'mbga/connectors'

export const config = createConfig({
networks: [sparkMainnet],
connectors: [satsConnect()],
network: sparkMainnet,
connectors: [xverse()],
})
```

Expand Down Expand Up @@ -92,17 +92,18 @@ pnpm create mbga
| [`mbga`](./packages/react) | React Hooks for Spark |
| [`@mbga/core`](./packages/core) | VanillaJS library for Spark |
| [`@mbga/connectors`](./packages/connectors) | Collection of wallet connectors for MBGA |
| [`@mbga/kit`](./packages/kit) | Pre-built React UI components for wallet connection |
| [`@mbga/test`](./packages/test) | Test utilities for MBGA |
| [`@mbga/flashnet`](./packages/flashnet) | Flashnet authentication and orchestration |
| [`create-mbga`](./packages/create-mbga) | Scaffold a new MBGA project |

## Community

- [GitHub Discussions](https://github.com/quantumlyy/mbga/discussions) — ask questions and share ideas
- [GitHub Discussions](https://github.com/refrakts/mbga/discussions) — ask questions and share ideas

## Contributing

Contributions are welcome! Please read the [Contributing Guide](https://github.com/quantumlyy/mbga/blob/main/.github/CONTRIBUTING.md) before submitting a pull request.
Contributions are welcome! Please read the [Contributing Guide](https://github.com/refrakts/mbga/blob/main/.github/CONTRIBUTING.md) before submitting a pull request.

## Acknowledgments

Expand Down
28 changes: 24 additions & 4 deletions packages/connectors/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -14,23 +14,26 @@ Each connector has its own peer dependency -- install only what you need:

| Connector | Peer dependency | Install |
|-----------|----------------|---------|
| `satsConnect` | `sats-connect` | `npm install sats-connect` |
| `xverse` | `sats-connect` | `npm install sats-connect` |
| `sparkSdk` | `@buildonspark/spark-sdk` | `npm install @buildonspark/spark-sdk` |
| `walletStandard` | `@wallet-standard/core` | `npm install @wallet-standard/core` |

## Connectors

### `satsConnect`
### `xverse`

Connects to Xverse and other wallets that implement the [sats-connect](https://docs.xverse.app/sats-connect) protocol. This is the primary connector for browser-based wallet interactions.

> **Note:** The previous `satsConnect` export is a deprecated alias for `xverse`.

```ts
import { satsConnect } from '@mbga/connectors'
import { xverse } from '@mbga/connectors'
import { createConfig, sparkMainnet } from '@mbga/core'

const config = createConfig({
network: sparkMainnet,
connectors: [
satsConnect(),
xverse(),
],
})
```
Expand All @@ -53,6 +56,23 @@ const config = createConfig({
})
```

### `walletStandard`

Wraps a [Wallet Standard](https://github.com/wallet-standard/wallet-standard) `Wallet` instance into an MBGA connector. Supports `standard:connect`/`disconnect`/`events` and Spark-specific features (`spark:connect`, `spark:getBalance`, etc.).

Typically you won't create these manually -- use the `walletStandardDiscovery` plugin to auto-discover and register compatible wallets at runtime:

```ts
import { xverse, walletStandardDiscovery } from '@mbga/connectors'
import { createConfig, sparkMainnet } from '@mbga/core'

const config = createConfig({
network: sparkMainnet,
connectors: [xverse()],
plugins: [walletStandardDiscovery()],
})
```

## Custom Connectors

You can create custom connectors using `createConnector` from `@mbga/core`:
Expand Down
2 changes: 1 addition & 1 deletion packages/connectors/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
"license": "Apache-2.0",
"repository": {
"type": "git",
"url": "https://github.com/quantumlyy/mbga.git",
"url": "https://github.com/refrakts/mbga.git",
"directory": "packages/connectors"
},
"scripts": {
Expand Down
18 changes: 18 additions & 0 deletions packages/core/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -84,6 +84,20 @@ const config = createConfig({
| `estimateFee` | Estimate the fee for a payment |
| `signMessage` | Sign a message with BIP-322 |

### Tokens

| Action | Description |
|--------|-------------|
| `getTokenBalance` | Get a token balance |
| `sendToken` | Send a token transfer |

### Wallet (continued)

| Action | Description |
|--------|-------------|
| `getTransactions` | List transaction history |
| `switchConnection` | Switch the active connection |

### Watchers

| Action | Description |
Expand All @@ -109,13 +123,17 @@ import { ... } from '@mbga/core/internal'
| `detectPaymentDestination` | Detect if a string is a Lightning invoice, Bitcoin address, or Spark address |
| `serialize` / `deserialize` | JSON serialization helpers |
| `deepEqual` | Deep equality comparison |
| `formatSats` / `parseSats` | Satoshi formatting and parsing |
| `formatTokenAmount` / `parseTokenAmount` | Token amount formatting with decimal support |

## Related Packages

| Package | Description |
|---------|-------------|
| [`mbga`](../react) | React hooks wrapping this library |
| [`@mbga/connectors`](../connectors) | Wallet connector implementations |
| [`@mbga/kit`](../kit) | Pre-built React UI components for wallet connection |
| [`@mbga/flashnet`](../flashnet) | Flashnet authentication and orchestration |
| [`create-mbga`](../create-mbga) | CLI to scaffold a new MBGA project |

## License
Expand Down
2 changes: 1 addition & 1 deletion packages/core/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
"license": "Apache-2.0",
"repository": {
"type": "git",
"url": "https://github.com/quantumlyy/mbga.git",
"url": "https://github.com/refrakts/mbga.git",
"directory": "packages/core"
},
"scripts": {
Expand Down
2 changes: 1 addition & 1 deletion packages/create-mbga/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
"license": "Apache-2.0",
"repository": {
"type": "git",
"url": "git+https://github.com/quantumlyy/mbga.git",
"url": "git+https://github.com/refrakts/mbga.git",
"directory": "packages/create-mbga"
},
"type": "module",
Expand Down
2 changes: 1 addition & 1 deletion packages/flashnet/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
"license": "Apache-2.0",
"repository": {
"type": "git",
"url": "https://github.com/quantumlyy/mbga.git",
"url": "https://github.com/refrakts/mbga.git",
"directory": "packages/flashnet"
},
"scripts": {
Expand Down
114 changes: 114 additions & 0 deletions packages/kit/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,114 @@
# @mbga/kit

Pre-built React UI components for connecting [Spark](https://www.spark.info/) wallets. Drop-in ConnectButton, wallet selection modal, and account management -- styled or headless.

## Installation

```bash
npm install @mbga/kit mbga @mbga/core @mbga/connectors sats-connect @tanstack/react-query
pnpm add @mbga/kit mbga @mbga/core @mbga/connectors sats-connect @tanstack/react-query
yarn add @mbga/kit mbga @mbga/core @mbga/connectors sats-connect @tanstack/react-query
```

## Quick Start

```tsx
import { MbgaProvider } from 'mbga'
import { KitProvider, ConnectButton } from '@mbga/kit'
import { createConfig, sparkMainnet } from '@mbga/core'
import { xverse } from '@mbga/connectors'
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'

const config = createConfig({
network: sparkMainnet,
connectors: [xverse()],
})

const queryClient = new QueryClient()

function App() {
return (
<QueryClientProvider client={queryClient}>
<MbgaProvider config={config}>
<KitProvider theme="dark">
<ConnectButton />
</KitProvider>
</MbgaProvider>
</QueryClientProvider>
)
}
```

`KitProvider` must be placed inside a `MbgaProvider`. It handles theming and modal state for the kit components.

## Components

### Styled

| Component | Description |
|-----------|-------------|
| `KitProvider` | Context provider (theming, modal state). Must be inside `MbgaProvider`. |
| `ConnectButton` | Connect/disconnect button with connected state display |
| `ConnectModal` | Modal with wallet list for selecting a connector |
| `AccountModal` | Connected account info (address, balance, disconnect) |

### Headless

Unstyled variants that expose render props for full customization:

```tsx
import { ConnectButtonHeadless } from '@mbga/kit'

<ConnectButtonHeadless>
{({ isConnected, address, connect, disconnect }) => (
// your custom UI
)}
</ConnectButtonHeadless>
```

| Component | Description |
|-----------|-------------|
| `ConnectButtonHeadless` | Render-prop connect/disconnect button |
| `ConnectModalHeadless` | Render-prop wallet selection modal |
| `AccountModalHeadless` | Render-prop account info |
| `Modal` | Generic modal primitive (overlay, open/close) |

Headless components are also available via the `@mbga/kit/headless` sub-path export.

## Theming

Built-in light and dark themes, with optional CSS variable overrides:

```tsx
import { KitProvider } from '@mbga/kit'

<KitProvider theme="dark" customTheme={{ '--mbgak-border-radius': '42px' }}>
<ConnectButton />
</KitProvider>
```

| Export | Description |
|--------|-------------|
| `lightTheme` | Default light theme |
| `darkTheme` | Dark theme |
| `resolveTheme` | Merge a partial theme with defaults |
| `themeToStyleVars` | Convert a theme object to CSS custom properties |

## Utilities

| Export | Description |
|--------|-------------|
| `truncateAddress` | Shorten an address for display |
| `copyToClipboard` | Copy text to clipboard |

## Related Packages

| Package | Description |
|---------|-------------|
| [`mbga`](../react) | React hooks for Spark |
| [`@mbga/core`](../core) | Framework-agnostic core library |
| [`@mbga/connectors`](../connectors) | Wallet connector implementations |

## License

Apache-2.0
2 changes: 1 addition & 1 deletion packages/kit/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
"license": "Apache-2.0",
"repository": {
"type": "git",
"url": "https://github.com/quantumlyy/mbga.git",
"url": "https://github.com/refrakts/mbga.git",
"directory": "packages/kit"
},
"scripts": {
Expand Down
16 changes: 14 additions & 2 deletions packages/react/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,18 +12,20 @@ pnpm add mbga @mbga/connectors sats-connect @tanstack/react-query
yarn add mbga @mbga/connectors sats-connect @tanstack/react-query
```

> `sats-connect` is a peer dependency of `@mbga/connectors` required by the `xverse` connector.

## Quick Start

### 1. Create a config

```ts
// src/mbga.ts
import { satsConnect } from 'mbga/connectors'
import { xverse } from 'mbga/connectors'
import { createConfig, sparkMainnet } from 'mbga'

export const config = createConfig({
network: sparkMainnet,
connectors: [satsConnect()],
connectors: [xverse()],
})
```

Expand Down Expand Up @@ -98,6 +100,14 @@ function Wallet() {
| `useEstimateFee` | Estimate the fee for a payment |
| `useSignMessage` | Sign a message with BIP-322 |

### Tokens

| Hook | Description |
|------|-------------|
| `useTokenList` | Fetch the token registry |
| `useTokenBalance` | Query a token balance |
| `useSendToken` | Send a token transfer |

## Sub-path Exports

```ts
Expand Down Expand Up @@ -128,6 +138,8 @@ The provider handles hydration automatically -- no extra setup needed.
|---------|-------------|
| [`@mbga/core`](../core) | Framework-agnostic core (use this for non-React apps) |
| [`@mbga/connectors`](../connectors) | Wallet connector implementations |
| [`@mbga/kit`](../kit) | Pre-built React UI components for wallet connection |
| [`@mbga/flashnet`](../flashnet) | Flashnet authentication and orchestration |
| [`create-mbga`](../create-mbga) | CLI to scaffold a new MBGA project |

## License
Expand Down
2 changes: 1 addition & 1 deletion packages/react/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
"license": "Apache-2.0",
"repository": {
"type": "git",
"url": "https://github.com/quantumlyy/mbga.git",
"url": "https://github.com/refrakts/mbga.git",
"directory": "packages/react"
},
"scripts": {
Expand Down
Loading
Loading