mmpay-browser-sdk 1.0.3 → 1.0.5

package/dist/cjs/index.js

@@ -2,14 +2,18 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MMPaySDK = void 0;
 class MMPaySDK {
+    /**
+     * constructor
+     * @param publishableKey
+     * @param options
+     */
     constructor(publishableKey, options = {}) {
         this.pollIntervalId = undefined;
         this.onCompleteCallback = null;
         this.overlayElement = null;
-        // Properties to store pending data for re-rendering after cancel attempt
         this.pendingApiResponse = null;
         this.pendingPaymentPayload = null;
-        this.QR_SIZE = 300;
+        this.QR_SIZE = 290;
         if (!publishableKey) {
             throw new Error("A Publishable Key is required to initialize [MMPaySDK].");
         }
@@ -17,7 +21,7 @@ class MMPaySDK {
         this.environment = options.environment || 'production';
         this.baseUrl = options.baseUrl || 'https://api.mm-pay.com';
         this.merchantName = options.merchantName || 'Your Merchant';
-        this.POLL_INTERVAL_MS = options.pollInterval || 3000;
+        this.POLL_INTERVAL_MS = options.pollInterval || 5000;
     }
     /**
      * _callApi
@@ -26,12 +30,20 @@ class MMPaySDK {
      * @returns
      */
     async _callApi(endpoint, data = {}) {
+        let config = {
+            'Content-Type': 'application/json',
+            'Authorization': `Bearer ${this.publishableKey}`
+        };
+        if (this.tokenKey) {
+            config = {
+                'Content-Type': 'application/json',
+                'Authorization': `Bearer ${this.publishableKey}`,
+                'X-MMPay-Btoken': `${this.tokenKey}`
+            };
+        }
         const response = await fetch(`${this.baseUrl}${endpoint}`, {
             method: 'POST',
-            headers: {
-                'Content-Type': 'application/json',
-                'Authorization': `Bearer ${this.publishableKey}`
-            },
+            headers: config,
             body: JSON.stringify(data)
         });
         if (!response.ok) {
@@ -41,11 +53,38 @@ class MMPaySDK {
         return response.json();
     }
     /**
-     * createPaymentRequest
-     * @param {PaymentData} payload
-     * @returns
+     * _callApiTokenRequest
+     * @param {ICreateTokenRequestParams} payload
+     * @param {number} payload.amount
+     * @param {string} payload.currency
+     * @param {string} payload.orderId
+     * @param {string} payload.nonce
+     * @param {string} payload.callbackUrl
+     * @returns {Promise<ICreateTokenResponse>}
+     */
+    async _callApiTokenRequest(payload) {
+        try {
+            const endpoint = this.environment === 'sandbox'
+                ? '/xpayments/sandbox-token-request'
+                : '/xpayments/production-token-request';
+            return await this._callApi(endpoint, payload);
+        }
+        catch (error) {
+            console.error("Token request failed:", error);
+            throw error;
+        }
+    }
+    /**
+     * _callApiPaymentRequest
+     * @param {ICreatePaymentRequestParams} payload
+     * @param {number} payload.amount
+     * @param {string} payload.currency
+     * @param {string} payload.orderId
+     * @param {string} payload.nonce
+     * @param {string} payload.callbackUrl
+     * @returns {Promise<ICreatePaymentResponse>}
      */
-    async createPaymentRequest(payload) {
+    async _callApiPaymentRequest(payload) {
         try {
             const endpoint = this.environment === 'sandbox'
                 ? '/xpayments/sandbox-payment-create'
@@ -57,10 +96,75 @@ class MMPaySDK {
             throw error;
         }
     }
+    /**
+     * createPayment
+     * @param {ICorePayParams} params
+     * @param {number} params.amount
+     * @param {string} params.orderId
+     * @param {string} params.callbackUrl
+     * @returns {Promise<ICreatePaymentResponse>}
+     */
+    async createPayment(params) {
+        const payload = {
+            amount: params.amount,
+            orderId: params.orderId,
+            callbackUrl: params.callbackUrl,
+            currency: 'MMK',
+            nonce: new Date().getTime().toString() + '_mmp'
+        };
+        try {
+            const tokenResponse = await this._callApiTokenRequest(payload);
+            this.tokenKey = tokenResponse.token;
+            const apiResponse = await this._callApiPaymentRequest(payload);
+            return apiResponse;
+        }
+        catch (error) {
+            console.error("Payment request failed:", error);
+            throw error;
+        }
+    }
+    /**
+     * showPaymentModal
+     * @param {ICorePayParams} params
+     * @param {number} params.amount
+     * @param {string} params.orderId
+     * @param {string} params.callbackUrl
+     * @param {Function} onComplete
+     */
+    async showPaymentModal(params, onComplete) {
+        const initialContent = `<div class="mmpay-overlay-content"><div style="text-align: center; color: #fff;">ငွေပေးချေမှု စတင်နေသည်...</div></div>`;
+        this._createAndRenderModal(initialContent, false);
+        this.onCompleteCallback = onComplete;
+        const payload = {
+            amount: params.amount,
+            orderId: params.orderId,
+            callbackUrl: params.callbackUrl,
+            currency: 'MMK',
+            nonce: new Date().getTime().toString() + '_mmp'
+        };
+        try {
+            const tokenResponse = await this._callApiTokenRequest(payload);
+            this.tokenKey = tokenResponse.token;
+            const apiResponse = await this._callApiPaymentRequest(payload);
+            if (apiResponse && apiResponse.qr && apiResponse.transactionRefId) {
+                this.pendingApiResponse = apiResponse;
+                this.pendingPaymentPayload = payload;
+                this._renderQrModalContent(apiResponse, payload, this.merchantName);
+                this._startPolling(payload, onComplete);
+            }
+            else {
+                this._showTerminalMessage(apiResponse.orderId || 'N/A', 'FAILED', 'ငွေပေးချေမှု စတင်ရန် မအောင်မြင်ပါ။ QR ဒေတာ မရရှိပါ။');
+            }
+        }
+        catch (error) {
+            this.tokenKey = null;
+            this._showTerminalMessage(payload.orderId || 'N/A', 'FAILED', 'ငွေပေးချေမှု စတင်စဉ် အမှားအယွင်း ဖြစ်ပွားသည်။ ကွန်ဆိုးလ်တွင် ကြည့်ပါ။');
+        }
+    }
     /**
      * _createAndRenderModal
      * @param {string} contentHtml
-     * @param isTerminal
+     * @param {boolean} isTerminal
      * @returns
      */
     _createAndRenderModal(contentHtml, isTerminal = false) {
@@ -72,7 +176,6 @@ class MMPaySDK {
         const style = document.createElement('style');
         style.innerHTML = `
           @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&family=Padauk:wght@400;700&display=swap');
-
           #mmpay-full-modal {
             position: fixed;
             top: 0;
@@ -172,41 +275,15 @@ class MMPaySDK {
         document.body.style.overflow = 'hidden'; // FIX: Prevent body scroll when modal is open
         return overlay;
     }
-    /**
-     * showPaymentModal
-     * @param {PaymentData} payload
-     * @param {Function} onComplete
-     */
-    async showPaymentModal(payload, onComplete) {
-        const initialContent = `<div class="mmpay-overlay-content"><div style="text-align: center; color: #fff;">ငွေပေးချေမှု စတင်နေသည်...</div></div>`;
-        this._createAndRenderModal(initialContent, false);
-        this.onCompleteCallback = onComplete;
-        try {
-            const apiResponse = await this.createPaymentRequest(payload);
-            if (apiResponse && apiResponse.qr && apiResponse.transactionId) {
-                this.pendingApiResponse = apiResponse;
-                this.pendingPaymentPayload = payload;
-                this._renderQrModalContent(apiResponse, payload, this.merchantName);
-                this._startPolling(apiResponse._id, onComplete);
-            }
-            else {
-                this._showTerminalMessage(apiResponse.orderId || 'N/A', 'FAILED', 'ငွေပေးချေမှု စတင်ရန် မအောင်မြင်ပါ။ QR ဒေတာ မရရှိပါ။');
-            }
-        }
-        catch (error) {
-            // Myanmar translation for "Error during payment initiation. See console."
-            this._showTerminalMessage(payload.orderId || 'N/A', 'FAILED', 'ငွေပေးချေမှု စတင်စဉ် အမှားအယွင်း ဖြစ်ပွားသည်။ ကွန်ဆိုးလ်တွင် ကြည့်ပါ။');
-        }
-    }
     /**
      * _renderQrModalContent
-     * @param {CreatePaymentResponse} apiResponse
-     * @param {PaymentData} payload
+     * @param {ICreatePaymentResponse} apiResponse
+     * @param {CreatePaymentRequest} payload
      * @param {string} merchantName
      */
     _renderQrModalContent(apiResponse, payload, merchantName) {
         const qrData = apiResponse.qr;
-        const amountDisplay = `${apiResponse.amount.toFixed(2)} ${apiResponse.currency}`;
+        const amountDisplay = `${apiResponse.amount.toFixed(2)} MMK`;
         const qrCanvasId = 'mmpayQrCanvas';
         const orderId = payload.orderId;
         window.MMPayDownloadQR = function () {
@@ -273,7 +350,7 @@ class MMPaySDK {
               <span class="mmpay-text-myanmar">မှာယူမှုနံပါတ်:</span> <strong>${apiResponse.orderId}</strong>
           </div>
           <div class="mmpay-detail">
-              <span class="mmpay-text-myanmar">ငွေပေးငွေယူနံပါတ်:</span> <strong>${apiResponse.transactionId}</strong>
+              <span class="mmpay-text-myanmar">ငွေပေးငွေယူနံပါတ်:</span> <strong>${apiResponse.transactionRefId}</strong>
           </div>
 
           <p class="mmpay-warning mmpay-text-myanmar">
@@ -382,7 +459,7 @@ class MMPaySDK {
     }
     /**
      * Cleans up the modal and stops polling.
-     * @param restoreBodyScroll
+     * @param {boolean} restoreBodyScroll
      */
     _cleanupModal(restoreBodyScroll) {
         if (this.pollIntervalId !== undefined) {
@@ -428,10 +505,15 @@ class MMPaySDK {
     }
     /**
      * _startPolling
-     * @param {string} _id
+     * @param {IPollingRequest} payload
+     * @param {number} payload.amount
+     * @param {string} payload.currency
+     * @param {string} payload.orderId
+     * @param {string} payload.nonce
+     * @param {string} payload.callbackUrl
      * @param {Function} onComplete
      */
-    async _startPolling(_id, onComplete) {
+    async _startPolling(payload, onComplete) {
         if (this.pollIntervalId !== undefined) {
             window.clearInterval(this.pollIntervalId);
         }
@@ -440,7 +522,7 @@ class MMPaySDK {
                 const endpoint = this.environment === 'sandbox'
                     ? '/xpayments/sandbox-payment-polling'
                     : '/xpayments/production-payment-polling';
-                const response = await this._callApi(endpoint, { _id: _id });
+                const response = await this._callApi(endpoint, payload);
                 const status = (response.status || '').toUpperCase();
                 if (status === 'SUCCESS' || status === 'FAILED' || status === 'EXPIRED') {
                     window.clearInterval(this.pollIntervalId);
@@ -451,6 +533,7 @@ class MMPaySDK {
                         `ငွေပေးချေမှု ${status === 'FAILED' ? 'မအောင်မြင်ပါ' : 'သက်တမ်းကုန်သွားပါပြီ'}.`;
                     this._showTerminalMessage(response.orderId || 'N/A', status, message);
                     if (onComplete) {
+                        this.tokenKey = null;
                         onComplete({ success: success, transaction: response });
                     }
                     return;

package/dist/esm/index.d.ts

@@ -1,46 +1,49 @@
-export interface PaymentData {
+export interface ICorePayParams {
     amount: number;
-    currency: string;
     orderId: string;
     callbackUrl?: string;
 }
-export interface CreatePaymentResponse {
+export interface ICreatePaymentRequestParams {
+    amount: number;
+    currency?: string;
+    orderId: string;
+    callbackUrl?: string;
+    nonce?: string;
+}
+export interface ICreatePaymentResponse {
     _id: string;
     amount: number;
     orderId: string;
-    currency: string;
-    transactionId: string;
+    currency?: string;
+    transactionRefId: string;
     qr: string;
-    url: string;
 }
-export interface PollingResponse {
-    _id: string;
-    appId: string;
+export interface ICreateTokenRequestParams {
+    amount: number;
+    currency?: string;
+    orderId: string;
+    callbackUrl?: string;
+    nonce?: string;
+}
+export interface ICreateTokenResponse {
     orderId: string;
+    token: string;
+}
+export interface IPollingRequest {
     amount: number;
-    currency: string;
-    method?: string;
-    vendor?: string;
+    currency?: string;
+    orderId: string;
     callbackUrl?: string;
-    callbackUrlStatus?: 'PENDING' | 'SUCCESS' | 'FAILED';
-    callbackAt?: Date;
-    disbursementStatus?: 'NONE' | 'PENDING' | 'COMPLETED' | 'FAILED' | 'CANCELLED';
-    disburseAt?: Date;
-    items: {
-        name: string;
-        amount: number;
-        quantity: number;
-    }[];
-    merchantId: string;
+    nonce?: string;
+}
+export interface IPollingResponse {
+    orderId: string;
+    transactionRefId: string;
     status: 'PENDING' | 'SUCCESS' | 'FAILED' | 'EXPIRED';
-    createdAt: Date;
-    transactionRefId?: string;
-    qr?: string;
-    redirectUrl?: string;
 }
 export interface PolliongResult {
     success: boolean;
-    transaction: PollingResponse;
+    transaction: IPollingResponse;
 }
 export interface SDKOptions {
     pollInterval?: number;
@@ -50,6 +53,7 @@ export interface SDKOptions {
 }
 export declare class MMPaySDK {
     private POLL_INTERVAL_MS;
+    private tokenKey;
     private publishableKey;
     private baseUrl;
     private merchantName;
@@ -60,6 +64,11 @@ export declare class MMPaySDK {
     private pendingApiResponse;
     private pendingPaymentPayload;
     private readonly QR_SIZE;
+    /**
+     * constructor
+     * @param publishableKey
+     * @param options
+     */
     constructor(publishableKey: string, options?: SDKOptions);
     /**
      * _callApi
@@ -69,28 +78,56 @@ export declare class MMPaySDK {
      */
     private _callApi;
     /**
-     * createPaymentRequest
-     * @param {PaymentData} payload
-     * @returns
+     * _callApiTokenRequest
+     * @param {ICreateTokenRequestParams} payload
+     * @param {number} payload.amount
+     * @param {string} payload.currency
+     * @param {string} payload.orderId
+     * @param {string} payload.nonce
+     * @param {string} payload.callbackUrl
+     * @returns {Promise<ICreateTokenResponse>}
      */
-    createPaymentRequest(payload: PaymentData): Promise<CreatePaymentResponse>;
+    private _callApiTokenRequest;
     /**
-     * _createAndRenderModal
-     * @param {string} contentHtml
-     * @param isTerminal
-     * @returns
+     * _callApiPaymentRequest
+     * @param {ICreatePaymentRequestParams} payload
+     * @param {number} payload.amount
+     * @param {string} payload.currency
+     * @param {string} payload.orderId
+     * @param {string} payload.nonce
+     * @param {string} payload.callbackUrl
+     * @returns {Promise<ICreatePaymentResponse>}
      */
-    private _createAndRenderModal;
+    private _callApiPaymentRequest;
+    /**
+     * createPayment
+     * @param {ICorePayParams} params
+     * @param {number} params.amount
+     * @param {string} params.orderId
+     * @param {string} params.callbackUrl
+     * @returns {Promise<ICreatePaymentResponse>}
+     */
+    createPayment(params: ICorePayParams): Promise<ICreatePaymentResponse>;
     /**
      * showPaymentModal
-     * @param {PaymentData} payload
+     * @param {ICorePayParams} params
+     * @param {number} params.amount
+     * @param {string} params.orderId
+     * @param {string} params.callbackUrl
      * @param {Function} onComplete
      */
-    showPaymentModal(payload: PaymentData, onComplete: (result: PolliongResult) => void): Promise<void>;
+    showPaymentModal(params: ICorePayParams, onComplete: (result: PolliongResult) => void): Promise<void>;
+    /**
+     * _createAndRenderModal
+     * @param {string} contentHtml
+     * @param {boolean} isTerminal
+     * @returns
+     */
+    private _createAndRenderModal;
     /**
      * _renderQrModalContent
-     * @param {CreatePaymentResponse} apiResponse
-     * @param {PaymentData} payload
+     * @param {ICreatePaymentResponse} apiResponse
+     * @param {CreatePaymentRequest} payload
      * @param {string} merchantName
      */
     private _renderQrModalContent;
@@ -111,7 +148,7 @@ export declare class MMPaySDK {
     private _reRenderPendingModalInstance;
     /**
      * Cleans up the modal and stops polling.
-     * @param restoreBodyScroll
+     * @param {boolean} restoreBodyScroll
      */
     private _cleanupModal;
     /**
@@ -122,7 +159,12 @@ export declare class MMPaySDK {
     private _injectQrScript;
     /**
      * _startPolling
-     * @param {string} _id
+     * @param {IPollingRequest} payload
+     * @param {number} payload.amount
+     * @param {string} payload.currency
+     * @param {string} payload.orderId
+     * @param {string} payload.nonce
+     * @param {string} payload.callbackUrl
      * @param {Function} onComplete
      */
     private _startPolling;