vk-payments 0.2.13 → 0.2.15

package/fesm5/vk-payments.js

@@ -1,7 +1,7 @@
 import { Injectable, ɵɵdefineInjectable, ɵɵinject, EventEmitter, Component, Input, Output, ViewChild, NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { Router, RouterModule } from '@angular/router';
+import { Router, RouterModule, ActivatedRoute } from '@angular/router';
 import { __values, __awaiter, __generator } from 'tslib';
 import { HttpHeaders, HttpClient, HttpClientModule } from '@angular/common/http';
 import sha256 from 'sha256';
@@ -2675,7 +2675,8 @@ var GoCuotasComponent = /** @class */ (function () {
         this.installments = 0;
         this.currentInstallments = [
             { value: 2, label: '2 Cuotas' },
-            { value: 3, label: '3 Cuotas' }
+            { value: 3, label: '3 Cuotas' },
+            { value: 4, label: '4 Cuotas' }
         ]; // Opciones para "Cantidad de cuotas"
         this.totalAmount = Number(this.paymentAmount);
     };
@@ -3313,10 +3314,12 @@ if (false) {
  * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 var ModoComponent = /** @class */ (function () {
-    function ModoComponent(modoApi) {
+    function ModoComponent(modoApi, route) {
         this.modoApi = modoApi;
+        this.route = route;
         this.statusPay = new EventEmitter();
         this.isLoading = false;
+        this.executionEnv = 'desktop';
     }
     /**
      * @return {?}
@@ -3325,7 +3328,47 @@ var ModoComponent = /** @class */ (function () {
      * @return {?}
      */
     function () {
-        this.loadModoScript();
+        this.detectEnvironment();
+        if (this.executionEnv === 'desktop') {
+            this.loadModoScript();
+        }
+    };
+    /**
+     * @private
+     * @return {?}
+     */
+    ModoComponent.prototype.detectEnvironment = /**
+     * @private
+     * @return {?}
+     */
+    function () {
+        try {
+            /** @type {?} */
+            var params = this.route.snapshot.params;
+            /** @type {?} */
+            var guid = params['guid'];
+            /** @type {?} */
+            var platform = (/** @type {?} */ (params['platform']));
+            if (platform === 'iOS' || platform === 'Android' || guid === 'app') {
+                this.executionEnv = 'native-app';
+                this.devicePlatform = platform;
+                console.log("MODO Payment: Entorno detectado -> Nativo (" + (this.devicePlatform || 'app') + ")");
+                return;
+            }
+        }
+        catch (error) {
+            console.warn('MODO Payment: No se pudo leer los parámetros de la ruta. Se continuará con la detección por User Agent.');
+        }
+        /** @type {?} */
+        var userAgent = navigator.userAgent || navigator.vendor || ((/** @type {?} */ (window))).opera;
+        if (/android/i.test(userAgent) || /iPad|iPhone|iPod/.test(userAgent)) {
+            this.executionEnv = 'mobile-browser';
+            console.log('MODO Payment: Entorno detectado -> Navegador Móvil');
+        }
+        else {
+            this.executionEnv = 'desktop';
+            console.log('MODO Payment: Entorno detectado -> Desktop');
+        }
     };
     /**
      * @return {?}
@@ -3335,8 +3378,7 @@ var ModoComponent = /** @class */ (function () {
      */
     function () {
         return __awaiter(this, void 0, void 0, function () {
-            var initialData_1, modalObject, error_1;
-            var _this = this;
+            var initialData, error_1;
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
@@ -3346,49 +3388,23 @@ var ModoComponent = /** @class */ (function () {
                         _a.trys.push([1, 3, , 4]);
                         return [4 /*yield*/, this.createModoPayment()];
                     case 2:
-                        initialData_1 = _a.sent();
+                        initialData = _a.sent();
                         this.isLoading = false;
-                        modalObject = {
-                            version: '2',
-                            qrString: initialData_1.qrString,
-                            checkoutId: initialData_1.checkoutId,
-                            deeplink: {
-                                url: initialData_1.deeplink,
-                                callbackURL: this.callbackUrl,
-                                callbackURLSuccess: this.callbackUrlSuccess
-                            },
-                            callbackURL: this.callbackUrl,
-                            refreshData: (/**
-                             * @return {?}
-                             */
-                            function () { return _this.createModoPayment(); }),
-                            onSuccess: (/**
-                             * @return {?}
-                             */
-                            function () {
-                                _this.statusPay.emit({ success: true, paymentId: initialData_1.checkoutId });
-                            }),
-                            onFailure: (/**
-                             * @return {?}
-                             */
-                            function () {
-                                _this.statusPay.emit({ success: false, paymentId: initialData_1.checkoutId });
-                            }),
-                            onCancel: (/**
-                             * @return {?}
-                             */
-                            function () {
-                                console.log('Pago cancelado por el usuario en el celular.');
-                            }),
-                            onClose: (/**
-                             * @return {?}
-                             */
-                            function () {
-                                console.log('Modal de MODO cerrado.');
-                            }),
-                        };
-                        // 3. Inicia el SDK de MODO
-                        ModoSDK.modoInitPayment(modalObject);
+                        switch (this.executionEnv) {
+                            case 'native-app':
+                                // Llama a la función nativa para abrir en un navegador externo
+                                this.openOnNativeNavigator(initialData.deeplink);
+                                break;
+                            case 'mobile-browser':
+                                // Abre el deeplink en una nueva pestaña
+                                window.open(initialData.deeplink, '_blank');
+                                break;
+                            case 'desktop':
+                            default:
+                                // Abrir el modal del SDK
+                                this.initModoSdkModal(initialData);
+                                break;
+                        }
                         return [3 /*break*/, 4];
                     case 3:
                         error_1 = _a.sent();
@@ -3402,18 +3418,92 @@ var ModoComponent = /** @class */ (function () {
         });
     };
     /**
-     * Esta función se encarga de llamar a tu backend.
-     * Se usa tanto para la carga inicial como para el refresco del SDK.
+     * @private
+     * @param {?} url
+     * @return {?}
      */
+    ModoComponent.prototype.openOnNativeNavigator = /**
+     * @private
+     * @param {?} url
+     * @return {?}
+     */
+    function (url) {
+        try {
+            if (this.devicePlatform === 'iOS') {
+                ((/** @type {?} */ (window))).webkit.messageHandlers.externalURL.postMessage(url);
+            }
+            else if (this.devicePlatform === 'Android') {
+                ((/** @type {?} */ (window))).externalURL.postMessage(url);
+            }
+            else {
+                // Fallback si por alguna razón no se detectó la plataforma pero sí el entorno nativo
+                window.open(url, '_blank');
+            }
+        }
+        catch (e) {
+            console.error('Error al intentar invocar el message handler nativo:', e);
+        }
+    };
+    /**
+     * @private
+     * @param {?} initialData
+     * @return {?}
+     */
+    ModoComponent.prototype.initModoSdkModal = /**
+     * @private
+     * @param {?} initialData
+     * @return {?}
+     */
+    function (initialData) {
+        var _this = this;
+        /** @type {?} */
+        var modalObject = {
+            version: '2',
+            qrString: initialData.qrString,
+            checkoutId: initialData.checkoutId,
+            deeplink: {
+                url: initialData.deeplink,
+                callbackURL: this.callbackUrl,
+                callbackURLSuccess: this.callbackUrlSuccess
+            },
+            callbackURL: this.callbackUrl,
+            refreshData: (/**
+             * @return {?}
+             */
+            function () { return _this.createModoPayment(); }),
+            onSuccess: (/**
+             * @return {?}
+             */
+            function () {
+                _this.statusPay.emit({ success: true, paymentId: initialData.checkoutId });
+            }),
+            onFailure: (/**
+             * @return {?}
+             */
+            function () {
+                _this.statusPay.emit({ success: false, paymentId: initialData.checkoutId });
+            }),
+            onCancel: (/**
+             * @return {?}
+             */
+            function () {
+                console.log('Pago cancelado por el usuario en el celular.');
+            }),
+            onClose: (/**
+             * @return {?}
+             */
+            function () {
+                console.log('Modal de MODO cerrado.');
+            }),
+        };
+        // 3. Inicia el SDK de MODO
+        ModoSDK.modoInitPayment(modalObject);
+    };
     /**
-     * Esta función se encarga de llamar a tu backend.
-     * Se usa tanto para la carga inicial como para el refresco del SDK.
      * @private
      * @return {?}
      */
     ModoComponent.prototype.createModoPayment = /**
-     * Esta función se encarga de llamar a tu backend.
-     * Se usa tanto para la carga inicial como para el refresco del SDK.
      * @private
      * @return {?}
      */
@@ -3475,7 +3565,8 @@ var ModoComponent = /** @class */ (function () {
     ];
     /** @nocollapse */
     ModoComponent.ctorParameters = function () { return [
-        { type: ModoApiService }
+        { type: ModoApiService },
+        { type: ActivatedRoute }
     ]; };
     ModoComponent.propDecorators = {
         accessToken: [{ type: Input }],
@@ -3514,11 +3605,26 @@ if (false) {
     ModoComponent.prototype.statusPay;
     /** @type {?} */
     ModoComponent.prototype.isLoading;
+    /**
+     * @type {?}
+     * @private
+     */
+    ModoComponent.prototype.executionEnv;
+    /**
+     * @type {?}
+     * @private
+     */
+    ModoComponent.prototype.devicePlatform;
     /**
      * @type {?}
      * @private
      */
     ModoComponent.prototype.modoApi;
+    /**
+     * @type {?}
+     * @private
+     */
+    ModoComponent.prototype.route;
 }
 
 /**