@monei-js/components 1.7.10 → 2.0.0

package/README.md

@@ -1,16 +1,79 @@
-# MONEI Components
+# @monei-js/components
 
-MONEI UI Components enable you to collect sensitive payment information using customizable UI components.
+MONEI UI Components — drop-in payment UI for the web. Renders secure iframes for card input, PayPal, Bizum, Google Pay, Apple Pay, and a full payment modal. Works with any framework or vanilla JS.
 
-UI components include features like:
+## Install
 
-Formatting card information automatically as it’s entered
-Translating placeholders into your customer’s preferred language
-Using responsive design to fit the width of your customer’s screen or mobile device
-Customizing the styling to match the look and feel of your checkout flow
+```bash
+npm install @monei-js/components
+```
 
-For creating payments on your server, use [@monei-js/node-sdk](https://github.com/MONEI/monei-node-sdk)
+Or load via CDN:
+
+```html
+<script src="https://js.monei.com/v3/monei.js"></script>
+```
+
+## Components
+
+| Component        | Description                                  |
+| ---------------- | -------------------------------------------- |
+| `CardInput`      | Secure card number/expiry/CVC input (iframe) |
+| `PaymentModal`   | Full-screen payment flow modal               |
+| `Bizum`          | Bizum button + phone verification modal      |
+| `PayPal`         | PayPal checkout button                       |
+| `GooglePay`      | Google Pay button                            |
+| `PaymentRequest` | Apple Pay / browser Payment Request button   |
+
+## Quick Start
+
+```js
+import {CardInput, createToken, confirmPayment} from '@monei-js/components';
+
+// Render card input
+const cardInput = CardInput({
+  paymentId: 'pay_...',
+  onChange({isTouched, error, cardType}) {
+    // handle validation state
+  },
+  onLoad() {
+    // component ready
+  }
+});
+cardInput.render('#card-input');
+
+// Tokenize and confirm
+const {token} = await createToken(cardInput);
+const result = await confirmPayment({paymentId: 'pay_...', paymentToken: token});
+```
+
+## API
+
+Exported via `api` namespace:
+
+- `createToken(request)` — tokenize a payment method (card, PayPal, Google Pay, Apple Pay, Bizum)
+- `confirmPayment({paymentId, ...})` — confirm a payment with token
+- `getPaymentMethods({accountId | paymentId})` — list available payment methods
+- `getPayment(paymentId)` — fetch payment status
+- `createPayment({accountId, amount, currency, ...})` — create a client-side payment (POS)
+- `sendPaymentReceipt({paymentId, customerEmail, ...})` — send receipt email
+
+## Framework Drivers
+
+Built-in rendering drivers for React, Vue 3, and Angular via `.driver()`:
+
+```js
+const MoneiCardInput = CardInput.driver('react');
+```
+
+## Server-Side
+
+For creating payments on your server, use [@monei-js/node-sdk](https://github.com/MONEI/monei-node-sdk).
 
 ## Documentation
 
-Check full documentation in our [Documentation portal](https://docs.monei.com/docs/monei-js-overview)
+Full docs: [docs.monei.com/docs/monei-js-overview](https://docs.monei.com/docs/monei-js-overview)
+
+## License
+
+MIT

package/dist/chunk.js

@@ -0,0 +1,13 @@
+//#region \0rolldown/runtime.js
+var __defProp = Object.defineProperty;
+var __exportAll = (all, no_symbols) => {
+	let target = {};
+	for (var name in all) __defProp(target, name, {
+		get: all[name],
+		enumerable: true
+	});
+	if (!no_symbols) __defProp(target, Symbol.toStringTag, { value: "Module" });
+	return target;
+};
+//#endregion
+export { __exportAll as t };