@morefin/cashier-bootstrapper 0.3.4 → 0.3.6

package/README.md

@@ -37,11 +37,12 @@ new CashierBootstrapper('#cashier-root', {
     terminalId: 'terminal-456',
     userId: 'user-789',
     sessionId: 'session-abc',
+    locale: 'sv_SE',
+    channel: 'ios',
     predefinedAmounts: [100, 200, 300],
     layout: 'default',
     transactionType: ('deposit'|'withdrawal'),
     attributes: {
-      channel: 'web',
       campaign: 'spring-launch',
       isVip: true
     }
@@ -62,7 +63,9 @@ new CashierBootstrapper('#cashier-root', {
 });
 ```
 
-`requestParams.attributes` sends custom cashier data as the `attributes` query parameter. Use it for values the cashier should receive as part of the request payload.
+`requestParams.channel` selects the cashier payment method order channel. Supported values are `windows`, `mac`, `ios`, `android`, and `other`; when omitted, the bootstrapper derives it from the user device.
+
+`requestParams.attributes` sends custom cashier data as the `attributes` query parameter. Use it for values the cashier should receive as part of the request payload. It does not control payment method ordering.
 
 `properties.iframe.attributes` applies plain HTML attributes directly to the rendered `<iframe>`. Use it for DOM concerns such as `data-*`, `loading`, or other iframe element attributes.
 
@@ -150,12 +153,16 @@ interface CashierRequestParams {
   terminalId?: string;
   userId?: string;
   sessionId?: string;
+  locale?: string;
+  channel?: CashierRuntimeChannel | string;
   predefinedAmounts?: number[];
   layout?: string;
   transactionType?: string;
   attributes?: Record<string, unknown>;
 }
 
+type CashierRuntimeChannel = 'windows' | 'mac' | 'ios' | 'android' | 'other';
+
 type CashierEnvironment = 'production' | 'uat';
 
 interface CashierIframeOptions {

package/dist/example-usage.js

@@ -18,6 +18,7 @@ export function example2(container) {
             terminalId: 'terminal-456',
             userId: 'user-789',
             sessionId: 'session-abc',
+            locale: 'sv_SE',
             predefinedAmounts: [100, 200, 300],
             layout: 'default'
         },
@@ -46,6 +47,7 @@ export function example4(container) {
             merchantId: 'merchant-123',
             terminalId: 'terminal-456',
             userId: 'user-789',
+            locale: 'sv_SE',
             predefinedAmounts: [100, 200, 300],
             layout: 'default'
         },

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import { CashierIframeApi, CashierIframeConfig } from './types';
-export type { CashierCallbacks, CashierEnvironment, CashierRequestParams, CashierIframeApi, CashierIframeConfig, CashierIframeProperties, CashierResultCallbackPayload, CashierRedirectPayload, CashierValidationFailedPayload } from './types';
+export type { CashierCallbacks, CashierEnvironment, CashierRequestParams, CashierRuntimeChannel, CashierIframeApi, CashierIframeConfig, CashierIframeProperties, CashierResultCallbackPayload, CashierRedirectPayload, CashierValidationFailedPayload } from './types';
 type FingerprintJSGlobal = {
     load: () => Promise<{
         get: () => Promise<{
@@ -18,6 +18,9 @@ export declare class CashierBootstrapper {
     private redirectOverlayPanel?;
     private redirectOverlayIframe?;
     private overlayPositionSyncHandler?;
+    private managedRedirectTab?;
+    private managedRedirectTabTransactionId?;
+    private managedRedirectTabCheckIntervalId?;
     private origin;
     private ready;
     private readonly fullConfig;
@@ -41,6 +44,10 @@ export declare class CashierBootstrapper {
     private normalizeRedirectTarget;
     private normalizeRedirectMethod;
     private normalizeRedirectParameters;
+    private openManagedRedirectTab;
+    private openManagedRedirectTabWithPost;
+    private trackManagedRedirectTab;
+    private clearManagedRedirectTabWatcher;
     private openPopupWithPost;
     private writePostFormToWindow;
     private submitPostForm;

package/dist/index.js

@@ -2,10 +2,12 @@ const DEFAULT_IFRAME_ALLOW = 'geolocation *;camera *;payment *;clipboard-read *;
 const CASHIER_PATH = '/cashier';
 const FINGERPRINT_CDN = 'https://cdn.jsdelivr.net/npm/@fingerprintjs/fingerprintjs@4/dist/fp.min.js';
 const CASHIER_REDIRECT_EVENT = 'CASHIER_REDIRECT';
+const CASHIER_REDIRECT_TAB_CLOSED_EVENT = 'CASHIER_REDIRECT_TAB_CLOSED';
 const TOP_URL_REPLACE_EVENT = 'TOP_URL_REPLACE';
 const CASHIER_IFRAME_OVERLAY_CLOSE_EVENT = 'CASHIER_IFRAME_OVERLAY_CLOSE';
 const CASHIER_RESULT_EVENT = 'CASHIER_RESULT';
 const CASHIER_VALIDATION_FAILED_EVENT = 'CASHIER_VALIDATION_FAILED';
+const CASHIER_RUNTIME_CHANNELS = ['windows', 'mac', 'ios', 'android', 'other'];
 const CASHIER_ENVIRONMENT_CONFIG = {
     production: {
         host: 'https://api.morefin.com',
@@ -64,6 +66,37 @@ async function generateFingerprint() {
         return undefined;
     }
 }
+function normalizeRuntimeChannel(channel) {
+    if (channel == null) {
+        return undefined;
+    }
+    const normalized = channel.trim().toLowerCase();
+    return CASHIER_RUNTIME_CHANNELS.includes(normalized)
+        ? normalized
+        : undefined;
+}
+function detectRuntimeChannel() {
+    if (typeof navigator === 'undefined') {
+        return undefined;
+    }
+    const userAgent = `${navigator.userAgent ?? ''} ${navigator.appVersion ?? ''}`.toLowerCase();
+    if (userAgent.includes('android')) {
+        return 'android';
+    }
+    if (userAgent.includes('iphone') || userAgent.includes('ipad') || userAgent.includes('ipod')) {
+        return 'ios';
+    }
+    if (userAgent.includes('windows')) {
+        return 'windows';
+    }
+    if (userAgent.includes('mac')) {
+        return 'mac';
+    }
+    return 'other';
+}
+function resolveRuntimeChannel(channel) {
+    return channel == null ? detectRuntimeChannel() : normalizeRuntimeChannel(channel);
+}
 function buildQueryString(requestParams, fingerprint) {
     const query = new URLSearchParams();
     if (requestParams.merchantId != null) {
@@ -78,6 +111,13 @@ function buildQueryString(requestParams, fingerprint) {
     if (requestParams.sessionId != null) {
         query.append('sessionId', String(requestParams.sessionId));
     }
+    if (requestParams.locale != null && requestParams.locale !== '' && requestParams.locale !== 'undefined') {
+        query.append('locale', String(requestParams.locale));
+    }
+    const channel = resolveRuntimeChannel(requestParams.channel);
+    if (channel) {
+        query.append('channel', channel);
+    }
     if (Array.isArray(requestParams.predefinedAmounts)) {
         requestParams.predefinedAmounts.forEach(amount => {
             query.append('predefinedAmounts', String(amount));
@@ -296,6 +336,7 @@ export class CashierBootstrapper {
         const redirectTarget = this.normalizeRedirectTarget(redirectPayload.target);
         const redirectMethod = this.normalizeRedirectMethod(redirectPayload.method);
         const redirectParameters = this.normalizeRedirectParameters(redirectPayload.parameters);
+        const transactionId = this.asString(redirectPayload.transactionId);
         if (typeof redirectUrl !== 'string' || redirectUrl.trim() === '') {
             return;
         }
@@ -315,12 +356,12 @@ export class CashierBootstrapper {
             case 'tab':
                 console.log('[CashierBootstrapper] Handling redirect target "tab".', { redirectUrl, redirectMethod, redirectParameters });
                 if (redirectMethod === 'POST') {
-                    if (!this.openPopupWithPost(redirectUrl, redirectParameters)) {
+                    if (!this.openManagedRedirectTabWithPost(redirectUrl, redirectParameters, transactionId)) {
                         this.submitPostForm(redirectUrl, redirectParameters, '_blank');
                     }
                 }
                 else {
-                    window.open(redirectUrl, '_blank', 'noopener,noreferrer');
+                    this.openManagedRedirectTab(redirectUrl, transactionId);
                 }
                 break;
             case 'window':
@@ -453,6 +494,55 @@ export class CashierBootstrapper {
             return acc;
         }, {});
     }
+    openManagedRedirectTab(url, transactionId) {
+        if (typeof window === 'undefined') {
+            return false;
+        }
+        const popup = window.open(url, '_blank');
+        if (!popup) {
+            return false;
+        }
+        this.trackManagedRedirectTab(popup, transactionId);
+        return true;
+    }
+    openManagedRedirectTabWithPost(url, parameters, transactionId) {
+        if (typeof window === 'undefined') {
+            return false;
+        }
+        const popup = window.open('', '_blank');
+        if (!popup) {
+            return false;
+        }
+        if (!this.writePostFormToWindow(popup, url, parameters)) {
+            return false;
+        }
+        this.trackManagedRedirectTab(popup, transactionId);
+        return true;
+    }
+    trackManagedRedirectTab(tab, transactionId) {
+        this.clearManagedRedirectTabWatcher();
+        this.managedRedirectTab = tab;
+        this.managedRedirectTabTransactionId = transactionId;
+        this.managedRedirectTabCheckIntervalId = setInterval(() => {
+            if (!this.managedRedirectTab?.closed) {
+                return;
+            }
+            const closedTransactionId = this.managedRedirectTabTransactionId;
+            this.managedRedirectTab = null;
+            this.managedRedirectTabTransactionId = undefined;
+            this.clearManagedRedirectTabWatcher();
+            this.postMessage(CASHIER_REDIRECT_TAB_CLOSED_EVENT, {
+                transactionId: closedTransactionId
+            });
+        }, 500);
+    }
+    clearManagedRedirectTabWatcher() {
+        if (this.managedRedirectTabCheckIntervalId === undefined) {
+            return;
+        }
+        clearInterval(this.managedRedirectTabCheckIntervalId);
+        this.managedRedirectTabCheckIntervalId = undefined;
+    }
     openPopupWithPost(url, parameters) {
         if (typeof window === 'undefined') {
             return false;

package/dist/types.d.ts

@@ -6,11 +6,14 @@ export interface CashierRequestParams {
     terminalId?: string;
     userId?: string;
     sessionId?: string;
+    locale?: string;
+    channel?: CashierRuntimeChannel | string;
     predefinedAmounts?: number[];
     layout?: string;
     transactionType?: string;
     attributes?: Record<string, unknown>;
 }
+export type CashierRuntimeChannel = 'windows' | 'mac' | 'ios' | 'android' | 'other';
 export type CashierEnvironment = 'production' | 'uat' | 'local' | 'local4200';
 /**
  * Bootstrap properties configuration

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@morefin/cashier-bootstrapper",
-  "version": "0.3.4",
+  "version": "0.3.6",
   "description": "Bootstrap service for initializing cashier payment page data from API",
   "main": "dist/index.js",
   "module": "dist/index.js",