A React SDK for implementing wallet web3 authentication and authorization to your website.
npm install @dynamic-labs/sparkA Spark wallet connector package for the Dynamic SDK that enables seamless integration with Spark network wallets.
- Magic Eden Wallet Support - Full integration with Magic Eden's Spark wallet
- Flexible Provider Interface - Easy to add support for additional Spark wallets
- Bitcoin Transfers - Send Bitcoin to Spark addresses with optional Taproot support
- Token Transfers - Transfer tokens between Spark addresses
- Message Signing - Sign messages for authentication with optional Taproot support
- Mainnet Support - Currently supports Spark mainnet (chain ID 301)
``bash`
npm install @dynamic-labs/spark
The package includes full support for Magic Eden's Spark wallet implementation, which provides:
- Connection Management - Seamless wallet connection and disconnection
- Address Retrieval - Get current wallet address
- Message Signing - Sign messages for authentication with optional Taproot support
- Bitcoin Transfers - Send Bitcoin to other Spark addresses
- Token Transfers - Transfer tokens between Spark addresses
The SparkWalletConnector provides a robust foundation for all Spark wallet integrations:
- Abstract Implementation - Handles common wallet operations
- Error Handling - Comprehensive error handling and logging
- Mainnet Focus - Currently optimized for mainnet usage
All Spark wallet providers must implement the ISparkProvider interface:
`typescript
interface ISparkProvider {
isConnected: boolean;
chainId?: string;
network?: string;
connect(): Promise
disconnect(): Promise
getAddress(): Promise
signMessage(
message: string | SparkSignMessageRequest,
): Promise
signMessageWithTaproot(message: string): Promise
transferBitcoin(params: {
receiverSparkAddress: string;
amountSats: bigint;
isTaproot?: boolean;
}): Promise
transferTokens(params: {
tokenPublicKey: string;
receiverSparkAddress: string;
tokenAmount: number;
isTaproot?: boolean;
}): Promise
request(method: string, params?: unknown): Promise
[key: string]: unknown; // Extensible for additional properties
}
`
| Network | Chain ID | Description | Block Explorer |
| ----------- | -------- | ------------------ | -------------------------------------- |
| Mainnet | 301 | Production network | mempool.space |
> Note: Currently only mainnet is supported. Testnet, signet, and regtest support may be added in future versions.
`typescript
import { DynamicContextProvider } from '@dynamic-labs/sdk-react-core';
import { SparkWalletConnectors } from '@dynamic-labs/spark';
function App() {
return (
environmentId: 'your-environment-id',
walletConnectors: [SparkWalletConnectors()],
}}
>
{/ Your app content /}
);
}
`
`typescript
import { useDynamicContext } from '@dynamic-labs/sdk-react-core';
import { SparkWallet } from '@dynamic-labs/spark';
function MyComponent() {
const { primaryWallet } = useDynamicContext();
const handleSendBitcoin = async () => {
if (primaryWallet instanceof SparkWallet) {
// Send Bitcoin
const txHash = await primaryWallet.sendBalance({
amount: '100000', // 100,000 satoshis
toAddress: 'sp1recipient123456789abcdef',
isTaproot: false,
});
// Or use the direct transferBitcoin method
const txHash2 = await primaryWallet.transferBitcoin({
amount: '50000',
toAddress: 'sp1recipient123456789abcdef',
isTaproot: true,
});
}
};
const handleSendTokens = async () => {
if (primaryWallet instanceof SparkWallet) {
const txHash = await primaryWallet.transferTokens({
tokenPublicKey: 'token123',
receiverSparkAddress: 'sp1recipient123456789abcdef',
tokenAmount: 1000,
isTaproot: false,
});
}
};
return (
$3
To add support for a new Spark wallet:
`typescript
import { SparkWalletConnector } from '@dynamic-labs/spark';export class YourSparkConnector extends SparkWalletConnector {
override name = 'Your Spark Wallet';
override overrideKey = 'yourspark';
public override getProvider(): ISparkProvider | undefined {
return window.yourProvider;
}
}
`$3
Use the
isSparkWallet type guard to safely work with Spark wallets:`typescript
import { isSparkWallet } from '@dynamic-labs/spark';function handleWallet(wallet: Wallet) {
if (isSparkWallet(wallet)) {
// TypeScript now knows this is a SparkWallet
wallet.transferBitcoin({
amount: '100000',
toAddress: 'sp1recipient123456789abcdef',
});
}
}
`๐งช Testing
$3
`bash
npx nx test spark
`$3
`bash
npx nx build spark
`$3
1. Start the demo app:
npm run start
2. Navigate to the Spark wallet section
3. Test connection, address retrieval, and message signing๐ API Reference
$3
-
SparkWalletConnectors() - Factory function returning all available connectors
- SparkWalletConnector - Base class for custom implementations
- SparkWallet - Wallet class with Bitcoin and token transfer methods
- ISparkProvider - Interface for wallet providers
- isSparkWallet - Type guard for Spark wallets$3
-
sendBalance(params) - Send Bitcoin (alias for transferBitcoin)
- transferBitcoin(params) - Send Bitcoin to a Spark address
- transferTokens(params) - Send tokens to a Spark address$3
-
SparkConnectionResult - Result from wallet connection
- SparkAddressResult - Result from address retrieval
- SparkSignMessageRequest - Message signing request options
- SparkSignatureResult - Result from message signing๐ Related Packages
- @dynamic-labs/sdk-react-core - React SDK core functionality
- @dynamic-labs/wallet-connector-core - Base wallet connector classes
- @dynamic-labs/types - Common type definitions
๐ค Contributing
We welcome contributions! Please see our contributing guidelines for details.
$3
1. Clone the repository
2. Install dependencies:
npm install
3. Run tests: npx nx test spark
4. Build package: npx nx build spark$3
1. Create a new connector class extending
SparkWalletConnector
2. Implement the getProvider() method
3. Add comprehensive tests
4. Update the SparkWalletConnectors()` factory functionThis package is part of the Dynamic SDK and follows the same licensing terms. See LICENSE for details.
- Documentation: docs.dynamic.xyz
- GitHub Issues: Report bugs or request features
- Discord: Join our community
---
Built with โค๏ธ by the Dynamic Labs team