spark-micropayments 0.2.0 → 0.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/ReadMe.md +35 -3
- package/package.json +1 -1
package/ReadMe.md
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
## Overview
|
|
2
|
-
To install the package,
|
|
2
|
+
To install the package, run `npm i spark-micropayments` in your project.
|
|
3
3
|
|
|
4
|
-
|
|
4
|
+
## Basic Usage
|
|
5
5
|
|
|
6
6
|
```tsx
|
|
7
|
-
import Paywall from 'micropayments'
|
|
7
|
+
import Paywall from 'spark-micropayments'
|
|
8
8
|
|
|
9
9
|
function App() {
|
|
10
10
|
return (
|
|
@@ -26,6 +26,35 @@ function App() {
|
|
|
26
26
|
|
|
27
27
|
Any content within the `Paywall` component will only be visible if the user pays the specified amount of USDB via the Spark network. The user connects their Xverse wallet and pays using USDB stablecoin.
|
|
28
28
|
|
|
29
|
+
## ConnectWallet
|
|
30
|
+
|
|
31
|
+
By default, the `Paywall` component includes its own "Connect Wallet" button. If you want a disconnect button elsewhere in your UI (e.g., a navbar), use the `ConnectWallet` component. It renders only when a wallet is connected, showing the truncated address and a "Disconnect" button. Wallet state syncs automatically between both components — no provider wrapper needed.
|
|
32
|
+
|
|
33
|
+
```tsx
|
|
34
|
+
import Paywall, { ConnectWallet } from 'spark-micropayments'
|
|
35
|
+
|
|
36
|
+
function App() {
|
|
37
|
+
return (
|
|
38
|
+
<div>
|
|
39
|
+
<header>
|
|
40
|
+
<h1>My Site</h1>
|
|
41
|
+
<ConnectWallet />
|
|
42
|
+
</header>
|
|
43
|
+
|
|
44
|
+
<Paywall
|
|
45
|
+
receiverSparkAddress="spark1pgss96dw2dqw0gwxlwudx2v863husuass6u2q3e4lfz23qs96ewfedz2w0pxam"
|
|
46
|
+
amount={0.1}
|
|
47
|
+
sparkscanApiKey="ss_sk_live_..."
|
|
48
|
+
>
|
|
49
|
+
<p>Paywalled content</p>
|
|
50
|
+
</Paywall>
|
|
51
|
+
</div>
|
|
52
|
+
)
|
|
53
|
+
}
|
|
54
|
+
```
|
|
55
|
+
|
|
56
|
+
`ConnectWallet` accepts an optional `className` prop for styling.
|
|
57
|
+
|
|
29
58
|
## Parameters
|
|
30
59
|
|
|
31
60
|
#### receiverSparkAddress
|
|
@@ -36,3 +65,6 @@ The minimum amount of USDB that the user needs to pay to access the paywalled co
|
|
|
36
65
|
|
|
37
66
|
#### sparkscanApiKey
|
|
38
67
|
Your SparkScan API key, used to verify whether the connected wallet has already paid.
|
|
68
|
+
|
|
69
|
+
#### sparkscanBaseUrl (optional)
|
|
70
|
+
Base URL for the SparkScan API. Use a proxy path (e.g., `/api/sparkscan`) to avoid CORS issues. Defaults to `https://api.sparkscan.io`.
|