@kwespay/widget 1.0.7 → 1.0.8

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 CHANGED
@@ -1,12 +1,20 @@
1
1
  # @kwespay/widget
2
2
 
3
- > Accept crypto payments in 3 lines of code drop-in JavaScript widget for EVM chains.
3
+ > Accept crypto payments on any EVM chain with a single JavaScript widget.
4
4
 
5
5
  [![npm version](https://img.shields.io/npm/v/@kwespay/widget)](https://www.npmjs.com/package/@kwespay/widget)
6
6
  [![license](https://img.shields.io/npm/l/@kwespay/widget)](LICENSE)
7
7
 
8
8
  ---
9
9
 
10
+ ## Get Started
11
+
12
+ 1. Create a merchant account at [app.kwespay.xyz](https://app.kwespay.xyz)
13
+ 2. Grab your **API Key** and **Vendor ID** from the dashboard
14
+ 3. Install the widget and start accepting payments
15
+
16
+ ---
17
+
10
18
  ## Installation
11
19
 
12
20
  ```bash
@@ -27,8 +35,8 @@ Or load via CDN (no bundler required):
27
35
  import KwesPayWidget from "@kwespay/widget";
28
36
 
29
37
  const widget = new KwesPayWidget({
30
- apiKey: "your_api_key",
31
- vendorId: "your_vendor_id",
38
+ apiKey: "your_api_key", // from app.kwespay.xyz
39
+ vendorId: "your_vendor_id", // from app.kwespay.xyz
32
40
  amount: 10.0,
33
41
  currency: "USD",
34
42
  });
@@ -36,7 +44,7 @@ const widget = new KwesPayWidget({
36
44
  widget.open();
37
45
  ```
38
46
 
39
- That's it. The widget handles wallet connection, network switching, token selection, transaction signing, and success/error states.
47
+ The widget handles everything — wallet connection, network switching, token selection, transaction signing, and success/error states.
40
48
 
41
49
  ---
42
50
 
@@ -44,11 +52,11 @@ That's it. The widget handles wallet connection, network switching, token select
44
52
 
45
53
  ```js
46
54
  const widget = new KwesPayWidget({
47
- apiKey: "your_api_key", // Required — your KwesPay API key
48
- vendorId: "your_vendor_id", // Required — your merchant identifier
55
+ apiKey: "your_api_key", // Required — from app.kwespay.xyz
56
+ vendorId: "your_vendor_id", // Required — from app.kwespay.xyz
49
57
  amount: 25.0, // Required — fiat amount to charge
50
58
  currency: "USD", // Optional — "USD" (default) or "GHS"
51
- acceptedTokens: ["USDT", "USDC"], // Optional — restrict tokens. Pass "stablecoins" to allow all stables
59
+ acceptedTokens: ["USDT", "USDC"], // Optional — restrict accepted tokens
52
60
  });
53
61
  ```
54
62
 
@@ -60,7 +68,7 @@ const widget = new KwesPayWidget({
60
68
  | `"stablecoins"` | USDT, USDC, DAI, BUSD, USDc |
61
69
  | `["USDT", "USDC"]` | Only the listed tokens |
62
70
 
63
- Tokens are also scoped by your API key's network/token permissions set in the KwesPay dashboard.
71
+ Token and network availability is also scoped by the permissions set on your API key in the dashboard.
64
72
 
65
73
  ---
66
74
 
@@ -77,27 +85,23 @@ Tokens are also scoped by your API key's network/token permissions set in the Kw
77
85
  | Base Sepolia | 84532 | Testnet |
78
86
  | Lisk Sepolia | 4202 | Testnet |
79
87
 
80
- Network and token availability in the widget is automatically filtered by your API key's permitted scope.
81
-
82
88
  ---
83
89
 
84
90
  ## Methods
85
91
 
86
92
  ```js
87
- widget.open(); // Opens the payment widget
88
- widget.close(); // Closes the widget
93
+ widget.open(); // Open the payment widget
94
+ widget.close(); // Close the widget
89
95
  widget.isOpen(); // Returns boolean
90
- widget.updateAmount(15.0, "USD"); // Update amount without re-creating the widget
91
- widget.getState(); // Returns current widget + config state
92
- widget.destroy(); // Removes widget from DOM and cleans up
96
+ widget.updateAmount(15.0, "USD"); // Update amount on the fly
97
+ widget.getState(); // Returns current widget and config state
98
+ widget.destroy(); // Remove widget from DOM and clean up
93
99
  ```
94
100
 
95
101
  ---
96
102
 
97
103
  ## Events
98
104
 
99
- Listen for widget lifecycle and payment events on the `window`:
100
-
101
105
  ```js
102
106
  window.addEventListener("kwespay:paymentSuccess", (e) => {
103
107
  const {
@@ -109,7 +113,7 @@ window.addEventListener("kwespay:paymentSuccess", (e) => {
109
113
  token,
110
114
  network,
111
115
  } = e.detail;
112
- // Fulfil the order
116
+ // fulfil your order here
113
117
  });
114
118
 
115
119
  window.addEventListener("kwespay:paymentError", (e) => {
@@ -121,6 +125,7 @@ window.addEventListener("kwespay:paymentCancelled", (e) => {
121
125
  });
122
126
 
123
127
  window.addEventListener("kwespay:widgetOpened", () => {});
128
+
124
129
  window.addEventListener("kwespay:widgetClosed", (e) => {
125
130
  console.log(e.detail.completedPayment); // boolean
126
131
  });
@@ -134,10 +139,8 @@ window.addEventListener("kwespay:apiKeyValidated", (e) => {
134
139
 
135
140
  ## Wallet Support
136
141
 
137
- - **Injected wallets** (MetaMask, Coinbase Wallet, Rabby, etc.) via EIP-6963
138
- - **Mobile wallets** via WalletConnect v2 (QR code + deep link)
139
-
140
- ---
142
+ - **Injected wallets** MetaMask, Coinbase Wallet, Rabby, and any EIP-6963 compatible wallet
143
+ - **Mobile wallets** WalletConnect v2 via QR code and deep link
141
144
 
142
145
  ## Examples
143
146
 
@@ -148,12 +151,6 @@ window.addEventListener("kwespay:apiKeyValidated", (e) => {
148
151
 
149
152
  ---
150
153
 
151
- ## Fee Model
152
-
153
- KwesPay uses a **customer-pays-fee** architecture. The fee is calculated by the backend and signed into the payment payload — the merchant always receives the exact `amount` specified. Fee details are shown to the customer before they confirm the transaction.
154
-
155
- ---
156
-
157
154
  ## License
158
155
 
159
156
  MIT © KwesPay
package/dist/esm/index.js CHANGED
@@ -8,7 +8,7 @@ const SUPPORTED_CURRENCIES = {
8
8
  const STABLECOIN_SYMBOLS = ["USDT", "USDC", "DAI", "BUSD", "USDc"];
9
9
 
10
10
  const DEFAULT_CONFIG = {
11
- graphqlEndpoint: "https://8284-154-161-98-26.ngrok-free.app",
11
+ graphqlEndpoint: "https://api.kwespay.xyz/",
12
12
  currency: SUPPORTED_CURRENCIES.USD,
13
13
  };
14
14
 
@@ -97,7 +97,6 @@ const TOKEN_CONFIGS = {
97
97
  decimals: 18,
98
98
  coingeckoId: "ethereum",
99
99
  binanceSymbol: "ETHUSDT",
100
-
101
100
  },
102
101
  {
103
102
  symbol: "USDT",
@@ -3183,7 +3182,7 @@ const QuoteMethods = {
3183
3182
  } catch (err) {
3184
3183
  console.error("[KwesPayWidget] Quote fetch failed:", err.message);
3185
3184
  if (cryptoLine) {
3186
- cryptoLine.textContent = "Could not load rate — please try again.";
3185
+ cryptoLine.textContent = "Could not load please try again.";
3187
3186
  cryptoLine.classList.remove("loading");
3188
3187
  }
3189
3188
  if (proceedBtn) proceedBtn.disabled = true;
@@ -14,7 +14,7 @@
14
14
  const STABLECOIN_SYMBOLS = ["USDT", "USDC", "DAI", "BUSD", "USDc"];
15
15
 
16
16
  const DEFAULT_CONFIG = {
17
- graphqlEndpoint: "https://8284-154-161-98-26.ngrok-free.app",
17
+ graphqlEndpoint: "https://api.kwespay.xyz/",
18
18
  currency: SUPPORTED_CURRENCIES.USD,
19
19
  };
20
20
 
@@ -103,7 +103,6 @@
103
103
  decimals: 18,
104
104
  coingeckoId: "ethereum",
105
105
  binanceSymbol: "ETHUSDT",
106
-
107
106
  },
108
107
  {
109
108
  symbol: "USDT",
@@ -19129,7 +19128,7 @@ ${e.length}`,n=new TextEncoder().encode(t+e);return "0x"+toString$1(keccak_256$3
19129
19128
  } catch (err) {
19130
19129
  console.error("[KwesPayWidget] Quote fetch failed:", err.message);
19131
19130
  if (cryptoLine) {
19132
- cryptoLine.textContent = "Could not load rate — please try again.";
19131
+ cryptoLine.textContent = "Could not load please try again.";
19133
19132
  cryptoLine.classList.remove("loading");
19134
19133
  }
19135
19134
  if (proceedBtn) proceedBtn.disabled = true;