@deuna/react-native-sdk 1.0.2 → 1.0.4

package/lib/typescript/deuna-sdk-react-native/src/types/interfaces/callbacks.d.ts

@@ -15,11 +15,16 @@ interface OnInstallmentSelectedPayload {
     cardBin: string;
     installmentPlanOptionId: string;
 }
+interface Dimensions {
+    height: number;
+    width: number;
+}
 interface BaseCallbacks {
     onSuccess?: (data: Json) => void;
     onError?: (data: OnError) => void;
     onClosed?: (action: ClosedAction) => void;
     onEventDispatch?: (event: string, payload: Json) => void;
+    onResize?: (dimensions: Dimensions) => void;
 }
 export interface PaymentWidgetCallbacks extends BaseCallbacks {
     onCardBinDetected?: (data: OnCardBinDetected) => void;
@@ -33,6 +38,9 @@ export interface ElementsWidgetCallbacks extends BaseCallbacks {
 export interface NextActionWidgetCallbacks extends BaseCallbacks {
 }
 export interface VoucherWidgetCallbacks extends BaseCallbacks {
+    onCardBinDetected?: (data: OnCardBinDetected) => void;
+    onInstallmentSelected?: (data: OnInstallmentSelectedPayload) => void;
+    onPaymentProcessing?: () => void;
 }
 export {};
 //# sourceMappingURL=callbacks.d.ts.map

package/lib/typescript/deuna-sdk-react-native/src/types/interfaces/callbacks.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"callbacks.d.ts","sourceRoot":"","sources":["../../../../../../src/types/interfaces/callbacks.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,YAAY,GAAG,YAAY,GAAG,cAAc,CAAC;AAEzD,MAAM,MAAM,IAAI,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;AAEvC,MAAM,WAAW,OAAO;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE;QACR,IAAI,EAAE,MAAM,CAAC;QACb,OAAO,EAAE,MAAM,CAAC;KACjB,CAAC;CACH;AAED,UAAU,iBAAiB;IACzB,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,UAAU,4BAA4B;IACpC,OAAO,EAAE,MAAM,CAAC;IAChB,uBAAuB,EAAE,MAAM,CAAC;CACjC;AAED,UAAU,aAAa;IACrB,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACjC,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAClC,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IAC1C,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,KAAK,IAAI,CAAC;CAC1D;AAED,MAAM,WAAW,sBAAuB,SAAQ,aAAa;IAC3D,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACtD,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,4BAA4B,KAAK,IAAI,CAAC;IACrE,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAC;CAClC;AAED,MAAM,WAAW,uBAAwB,SAAQ,aAAa;IAC5D,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACtD,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,4BAA4B,KAAK,IAAI,CAAC;CACtE;AAED,MAAM,WAAW,yBAA0B,SAAQ,aAAa;CAAG;AAEnE,MAAM,WAAW,sBAAuB,SAAQ,aAAa;CAAG"}
+{"version":3,"file":"callbacks.d.ts","sourceRoot":"","sources":["../../../../../../src/types/interfaces/callbacks.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,YAAY,GAAG,YAAY,GAAG,cAAc,CAAC;AAEzD,MAAM,MAAM,IAAI,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;AAEvC,MAAM,WAAW,OAAO;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE;QACR,IAAI,EAAE,MAAM,CAAC;QACb,OAAO,EAAE,MAAM,CAAC;KACjB,CAAC;CACH;AAED,UAAU,iBAAiB;IACzB,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,UAAU,4BAA4B;IACpC,OAAO,EAAE,MAAM,CAAC;IAChB,uBAAuB,EAAE,MAAM,CAAC;CACjC;AAED,UAAU,UAAU;IAClB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf;AACD,UAAU,aAAa;IACrB,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACjC,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAClC,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IAC1C,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,KAAK,IAAI,CAAC;IACzD,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,IAAI,CAAC;CAC7C;AAED,MAAM,WAAW,sBAAuB,SAAQ,aAAa;IAC3D,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACtD,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,4BAA4B,KAAK,IAAI,CAAC;IACrE,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAC;CAClC;AAED,MAAM,WAAW,uBAAwB,SAAQ,aAAa;IAC5D,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACtD,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,4BAA4B,KAAK,IAAI,CAAC;CACtE;AAED,MAAM,WAAW,yBAA0B,SAAQ,aAAa;CAAG;AAEnE,MAAM,WAAW,sBAAuB,SAAQ,aAAa;IAC3D,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACtD,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,4BAA4B,KAAK,IAAI,CAAC;IACrE,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAC;CAClC"}

package/lib/typescript/deuna-sdk-react-native/src/types/interfaces/initWidgetBase.d.ts

@@ -67,6 +67,7 @@ export interface InitWidgetBase {
     userInfo?: Partial<UserInfo>;
     behavior?: BehaviorWidget;
     domain?: string;
+    platform?: string;
     hidePayButton?: boolean;
     callbacks?: PaymentWidgetCallbacks & ElementsWidgetCallbacks & NextActionWidgetCallbacks & VoucherWidgetCallbacks;
 }

package/lib/typescript/deuna-sdk-react-native/src/types/interfaces/initWidgetBase.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"initWidgetBase.d.ts","sourceRoot":"","sources":["../../../../../../src/types/interfaces/initWidgetBase.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,yBAAyB,EACzB,sBAAsB,EACtB,sBAAsB,EACvB,MAAM,aAAa,CAAC;AAErB,KAAK,WAAW,CAAC,CAAC,IAAI;KACnB,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,SAAS,MAAM,GAAG,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAChE,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE1C,UAAU,QAAQ;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,UAAU,gBAAgB;IACxB,KAAK,EAAE;QACL,SAAS,EAAE,MAAM,CAAC;QAClB,cAAc,EAAE,MAAM,CAAC;QACvB,eAAe,EAAE,MAAM,CAAC;QACxB,IAAI,EAAE,MAAM,CAAC;QACb,QAAQ,EAAE,MAAM,CAAC;QACjB,MAAM,EAAE,MAAM,CAAC;QACf,oBAAoB,EAAE,MAAM,CAAC;KAC9B,CAAC;IACF,cAAc,EAAE;QACd,kBAAkB,EAAE,OAAO,CAAC;QAC5B,eAAe,EAAE,OAAO,CAAC;KAC1B,CAAC;IACF,KAAK,EAAE;QACL,iBAAiB,EAAE,OAAO,CAAC;KAC5B,CAAC;IACF,eAAe,EAAE,cAAc,EAAE,CAAC;CACnC;AAED,UAAU,cAAc;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE;QACL,gBAAgB,EAAE,OAAO,CAAC;QAC1B,cAAc,EAAE,OAAO,CAAC;QAExB,MAAM,EAAE,GAAG,EAAE,CAAC;KACf,CAAC;CACH;AACD,MAAM,MAAM,YAAY,GAAG,UAAU,GAAG,UAAU,CAAC;AAEnD,MAAM,WAAW,oBAAoB;IACnC,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,MAAM,WAAW,cAAc;IAC7B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE;QACf,UAAU,CAAC,EAAE,kBAAkB,CAAC;QAChC,MAAM,CAAC,EAAE,cAAc,CAAC;QACxB,YAAY,CAAC,EAAE,oBAAoB,CAAC;QACpC,QAAQ,CAAC,EAAE,8BAA8B,CAAC;KAC3C,CAAC;CACH;AAED,MAAM,WAAW,kBAAkB;IACjC,aAAa,CAAC,EAAE;QACd,QAAQ,EAAE,MAAM,CAAC;KAClB,CAAC;IACF,IAAI,CAAC,EAAE,YAAY,CAAC;CACrB;AAED,MAAM,WAAW,cAAc;IAC7B,IAAI,CAAC,EAAE,YAAY,CAAC;CACrB;AAED,MAAM,WAAW,cAAc;IAC7B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,gBAAgB,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,CAAC;IACjD,QAAQ,CAAC,EAAE,OAAO,CAAC,QAAQ,CAAC,CAAC;IAC7B,QAAQ,CAAC,EAAE,cAAc,CAAC;IAC1B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,SAAS,CAAC,EAAE,sBAAsB,GAChC,uBAAuB,GACvB,yBAAyB,GACzB,sBAAsB,CAAC;CAC1B;AAGD,KAAK,kCAAkC,GAAG,SAAS,GAAG,YAAY,CAAC;AACnE,MAAM,WAAW,8BAA8B;IAC7C,IAAI,EAAE,kCAAkC,CAAC;CAC1C"}
+{"version":3,"file":"initWidgetBase.d.ts","sourceRoot":"","sources":["../../../../../../src/types/interfaces/initWidgetBase.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,11 +1,12 @@
 {
   "name": "@deuna/react-native-sdk",
-  "version": "1.0.2",
+  "version": "1.0.4",
   "description": "React Native SDK",
   "source": "./src/index.tsx",
   "main": "./lib/module/index.js",
   "types": "./lib/typescript/deuna-sdk-react-native/src/index.d.ts",
   "peerDependencies": {
+    "expo-web-browser": "*",
     "react": "*",
     "react-native": "*",
     "react-native-webview": "*"
@@ -56,14 +57,14 @@
   ],
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/darwinmorocho-deuna/deuna-sdk-react-native.git"
+    "url": "git+https://github.com/deuna-developers/deuna-sdk-react-native.git"
   },
-  "author": "DEUNA <dmorocho@deuna.com> (https://github.com/darwinmorocho-deuna)",
+  "author": "DEUNA (https://github.com/deuna-developers)",
   "license": "MIT",
   "bugs": {
-    "url": "https://github.com/darwinmorocho-deuna/deuna-sdk-react-native/issues"
+    "url": "https://github.com/deuna-developers/deuna-sdk-react-native/issues"
   },
-  "homepage": "https://github.com/darwinmorocho-deuna/deuna-sdk-react-native#readme",
+  "homepage": "https://github.com/deuna-developers/deuna-sdk-react-native#readme",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
   },
@@ -82,6 +83,7 @@
     "eslint": "^9.22.0",
     "eslint-config-prettier": "^10.1.1",
     "eslint-plugin-prettier": "^5.2.3",
+    "expo-web-browser": "14.1.6",
     "jest": "^29.7.0",
     "prettier": "^3.0.3",
     "react": "18.3.1",

package/src/DeunaSDK.ts

@@ -1,5 +1,6 @@
 import {
   BaseDeuna,
+  ClosedAction,
   CustomStyles,
   GetStateFn,
   InitElementsWidgetParams,
@@ -18,27 +19,34 @@ import {
   VoucherWidgetCallbacks,
 } from './types';
 import {
-  BaseWebViewController,
   DeunaWebViewController,
   WebViewDelegate,
 } from './controllers/BaseWebViewController';
 import { PaymentWidgetController } from './controllers/PaymentWidgetController';
-import { OpenInNewTabController } from './controllers/OpenInNewTabController';
-import { getWidgetController } from './helpers/getController';
-import { Completer } from './helpers/Completer';
+import { buildDeunaWidgetController } from './helpers/buildDeunaWidgetController';
 import { ElementsWidgetController } from './controllers/ElementsWidgetController';
 import { DownloadType, Mode, OnDownloadFile } from './interfaces/types';
-import { Platform } from 'react-native';
 import { DeviceFingerprintController } from './controllers/DeviceFingerprintController';
-import { DEVICE_FINGERPRINT_URL } from './interfaces/constants';
+import {
+  DEVICE_FINGERPRINT_URL,
+  DOMAINS_MUST_BE_USE_CROSS_PLATFORM_BROWSER,
+} from './interfaces/constants';
+import { SubmitStrategy } from './helpers/SubmitStrategy';
+import { getSubmitStrategy } from './helpers/getSubmitStrategy';
+import { WebViewManager } from './helpers/ViewManager';
+import {
+  ExternalUrlBrowser,
+  ExternalUrlHelper,
+} from './helpers/ExternalUrlHelper';
 
 export class DeunaSDK extends BaseDeuna {
-  constructor(private readonly config: InitializeParams) {
+  constructor(
+    readonly config: InitializeParams,
+    readonly onDestroyed?: () => void
+  ) {
     super();
   }
 
-  mode: Mode | null = null;
-
   setCustomStyleFn?: SetCustomStyle | undefined;
   refetchOrderFn?: RefetchOrder | undefined;
   getStateFn?: GetStateFn | undefined;
@@ -47,22 +55,12 @@ export class DeunaSDK extends BaseDeuna {
   closeFn?: (() => void) | undefined;
 
   private listeners: Set<() => void> = new Set();
-  webViewController: DeunaWebViewController | null = null;
-  newTabWebViewController: BaseWebViewController | null = null;
-  deviceFingerprintController: DeviceFingerprintController | null = null;
 
-  modalDismissPromise: Completer<void> | null = null;
-  newTabModalDismissPromise: Completer<void> | null = null;
+  deunaWidgetManager = new WebViewManager<DeunaWebViewController>();
+  externalUrlHelper = new ExternalUrlHelper();
 
-  private get safeWebViewController(): DeunaWebViewController {
-    if (!this.webViewController) {
-      const errorMessage =
-        'A variant of the init method must be called first. Please call initPaymentWidget, initVoucherWidget, or another init method before using this functionality.';
-      console.error(errorMessage);
-      throw new Error(errorMessage);
-    }
-    return this.webViewController;
-  }
+  deviceFingerprintController: DeviceFingerprintController | null = null;
+  submitStrategy: SubmitStrategy | null = null;
 
   /**
    * Generates a device fingerprint, creates a invisible webview to get the device fingerprint
@@ -102,12 +100,11 @@ export class DeunaSDK extends BaseDeuna {
     mode?: Mode;
   }): void => {
     const { controller, mode } = params;
-    this.mode = mode ?? Mode.MODAL;
-    if (this.mode === Mode.MODAL && Platform.OS === 'ios') {
-      this.modalDismissPromise = new Completer<void>();
-    }
-    this.webViewController = controller;
-    this.webViewController.delegate = this.buildDelegate();
+    this.deunaWidgetManager.initialize({
+      controller,
+      mode: mode ?? Mode.MODAL,
+      delegate: this.buildDelegate(),
+    });
     this.notifyListeners();
   };
 
@@ -123,7 +120,7 @@ export class DeunaSDK extends BaseDeuna {
     }
   ) {
     this.setWidgetController({
-      controller: getWidgetController(this.config, {
+      controller: buildDeunaWidgetController(this.config, {
         widget: 'payment',
         ...props,
       }),
@@ -140,7 +137,7 @@ export class DeunaSDK extends BaseDeuna {
     props: InitElementsWidgetParams & { mode?: Mode; sessionId?: string }
   ) {
     this.setWidgetController({
-      controller: getWidgetController(this.config, {
+      controller: buildDeunaWidgetController(this.config, {
         widget: 'elements',
         ...props,
       }),
@@ -155,7 +152,7 @@ export class DeunaSDK extends BaseDeuna {
    */
   async initNextAction(props: InitNextActionWidgetParams & { mode: Mode }) {
     this.setWidgetController({
-      controller: getWidgetController(this.config, {
+      controller: buildDeunaWidgetController(this.config, {
         widget: 'nextAction',
         ...props,
       }),
@@ -175,7 +172,7 @@ export class DeunaSDK extends BaseDeuna {
     }
   ) {
     this.setWidgetController({
-      controller: getWidgetController(this.config, {
+      controller: buildDeunaWidgetController(this.config, {
         widget: 'voucher',
         ...props,
       }),
@@ -184,60 +181,80 @@ export class DeunaSDK extends BaseDeuna {
   }
 
   isValid = async (): Promise<boolean> => {
-    return this.safeWebViewController.isValid();
+    return this.deunaWidgetManager.controller.isValid();
   };
 
   submit = async (): Promise<SubmitResult> => {
-    return this.safeWebViewController.submit();
+    this.getStateFn = () => this.getWidgetState();
+    const submitStrategy = await getSubmitStrategy(this);
+
+    if (!submitStrategy) {
+      return this.deunaWidgetManager.controller.submit();
+    }
+
+    this.submitStrategy = submitStrategy;
+    this.notifyListeners();
+    return this.submitStrategy.submit();
   };
 
   setCustomStyle = async (style: Partial<CustomStyles>): Promise<void> => {
-    return this.safeWebViewController.setCustomStyle(style);
+    return this.deunaWidgetManager.controller.setCustomStyle(style);
   };
 
   refetchOrder = async (): Promise<Json | null> => {
-    return this.safeWebViewController.refetchOrder();
+    return this.deunaWidgetManager.controller.refetchOrder();
   };
 
   getWidgetState = async (): Promise<State> => {
-    return this.safeWebViewController.getWidgetState();
+    return this.deunaWidgetManager.controller.getWidgetState();
   };
 
   /**
    * Closes the DEUNA widget and releases the resources
    */
   close = async (): Promise<void> => {
-    if (this.webViewController instanceof PaymentWidgetController) {
-      this.webViewController.callbacks.onClosed?.(
-        this.webViewController.closedAction
-      );
-    } else if (this.webViewController instanceof ElementsWidgetController) {
-      this.webViewController.callbacks.onClosed?.(
-        this.webViewController.closedAction
-      );
+    if (!this.deunaWidgetManager.isInitialized) {
+      return;
     }
-    this.onCloseNewTab();
-    await this.newTabModalDismissPromise?.wait;
-    this.newTabWebViewController?.dispose();
-
-    this.webViewController?.dispose();
-    // reset all prop
-    this.newTabWebViewController = null;
-    this.webViewController = null;
-    this.mode = null;
-    this.notifyListeners();
 
-    // if the widget was shown in modal mode, wait for the modal to be dismissed
-    await this.modalDismissPromise?.wait;
-    this.modalDismissPromise = null;
-  };
+    try {
+      let onClosedCallback: ((action: ClosedAction) => void) | undefined;
+      const closedAction = this.deunaWidgetManager.controller.closedAction;
 
-  onModalDismissed = () => {
-    this.modalDismissPromise?.complete();
-  };
+      if (
+        this.deunaWidgetManager.controller instanceof PaymentWidgetController
+      ) {
+        onClosedCallback =
+          this.deunaWidgetManager.controller.callbacks.onClosed;
+      } else if (
+        this.deunaWidgetManager.controller instanceof ElementsWidgetController
+      ) {
+        onClosedCallback =
+          this.deunaWidgetManager.controller.callbacks.onClosed;
+      }
+
+      // If the external url was opened in a Safari View Controller or a Custom Chrome Tab
+      // we need to wait until the browser is dismissed
+      await this.externalUrlHelper.waitForClose();
+
+      // Destroy the main webview and dismiss the modal
+      this.deunaWidgetManager.destroy();
+
+      // Close the submit strategy if it exists
+      await this.submitStrategy?.deunaSDK.close();
+      this.submitStrategy = null;
 
-  onNewTabDismissed = () => {
-    this.newTabModalDismissPromise?.complete();
+      // Notify listeners that the widget has been closed
+      this.notifyListeners();
+
+      // Notify the user that the widget has been closed
+      this.onDestroyed?.();
+
+      // Notify the widget that the user has closed the widget
+      onClosedCallback?.(closedAction);
+    } catch (error) {
+      console.error('Error closing the widget', error);
+    }
   };
 
   addListener = (listener: () => void) => {
@@ -253,21 +270,22 @@ export class DeunaSDK extends BaseDeuna {
   };
 
   private notifyDownloadFile = (url: string) => {
-    if (this.safeWebViewController instanceof PaymentWidgetController) {
-      this.safeWebViewController.callbacks.onDownloadFile?.({
+    if (this.deunaWidgetManager.controller instanceof PaymentWidgetController) {
+      this.deunaWidgetManager.controller.callbacks.onDownloadFile?.({
         type: DownloadType.URL,
         data: url,
       });
     }
   };
 
-  onCloseNewTab = () => {
-    if (this.webViewController) {
-      this.webViewController.redirectUrl = null;
+  /**
+   * Closes the external URL Webview
+   */
+  onCloseExternalUrl = async () => {
+    if (this.externalUrlHelper.externalUrlWebViewController) {
+      await this.externalUrlHelper.closeWebView();
+      this.notifyListeners();
     }
-    this.newTabWebViewController?.dispose();
-    this.newTabWebViewController = null;
-    this.notifyListeners();
   };
 
   /**
@@ -278,19 +296,33 @@ export class DeunaSDK extends BaseDeuna {
    */
   buildDelegate = (): WebViewDelegate => {
     return {
-      onOpenInNewTab: (url) => {
-        this.newTabWebViewController = new OpenInNewTabController(url);
-        if (Platform.OS === 'ios') {
-          this.newTabModalDismissPromise = new Completer<void>();
+      onOpenExternalUrl: (url) => {
+        try {
+          const host = new URL(url).host;
+          let browser = ExternalUrlBrowser.WEB_VIEW;
+          // Check if the URL is from a domain that must be opened in a cross platform browser (SafariView or Chrome Custom Tab)
+          for (const domain of DOMAINS_MUST_BE_USE_CROSS_PLATFORM_BROWSER) {
+            if (host.includes(domain)) {
+              browser = ExternalUrlBrowser.CROSS_PLATFORM_BROWSER;
+              break;
+            }
+          }
+
+          this.externalUrlHelper.openUrl({
+            url,
+            browser,
+            delegate: {
+              onCloseExternalUrl: this.onCloseExternalUrl,
+              onFileDownload: this.notifyDownloadFile,
+            },
+          });
+          this.notifyListeners();
+        } catch (error) {
+          console.error('Error opening external URL', error);
         }
-        this.newTabWebViewController.delegate = {
-          onFileDownload: this.notifyDownloadFile,
-          onNewTabWindowClose: this.onCloseNewTab,
-        };
-        this.notifyListeners();
       },
+      onCloseExternalUrl: this.onCloseExternalUrl,
       onCloseButtonPressed: this.close, // Close the payment widget when the user presses the close button
-      onCloseSubWebView: this.onCloseNewTab, // Close the new tab web view when the DEUNA widget emits an error event or when the purchase is successful
       onFileDownload: this.notifyDownloadFile, // Notify the user when a request to download a file is made
     };
   };

package/src/components/DeunaWidget.tsx

@@ -3,10 +3,9 @@ import { useEffect, useRef, useState } from 'react';
 
 import { DeunaSDK } from '../DeunaSDK';
 import { DeunaWebView } from './DeunaWebView';
-import { NewTabWebView } from './NewTabWebView';
-import { DeunaWebViewController } from '../controllers/BaseWebViewController';
 import { Mode } from '../interfaces/types';
 import { DeviceFingerprintWebView } from './DeviceFingerprintWebView';
+import { ExternalUrlWebView } from './ExternalUrlWebView';
 
 interface DeunaWidgetProps {
   instance: DeunaSDK;
@@ -15,7 +14,46 @@ interface DeunaWidgetProps {
 export const DeunaWidget = (props: DeunaWidgetProps) => {
   const { instance } = props;
   const instanceRef = useRef(instance);
-  const [mode, setMode] = useState<Mode | null>(instance.mode);
+  const [showPaymentStrategy, setShowPaymentStrategy] = useState(false);
+
+  useEffect(() => {
+    instanceRef.current = instance;
+  }, [instance]);
+
+  useEffect(() => {
+    const listener = () => {
+      setShowPaymentStrategy(instanceRef.current.submitStrategy !== null);
+    };
+
+    instanceRef.current.addListener(listener);
+
+    return () => {
+      instanceRef.current.removeListener(listener);
+    };
+  }, []);
+
+  return (
+    <>
+      <DeunaWidgetContainer
+        key="MainDeunaWidget"
+        instance={instanceRef.current}
+      />
+      {showPaymentStrategy && (
+        <DeunaWidgetContainer
+          key="PaymentStrategy"
+          instance={instanceRef.current.submitStrategy!.deunaSDK}
+        />
+      )}
+    </>
+  );
+};
+
+const DeunaWidgetContainer = (props: DeunaWidgetProps) => {
+  const { instance } = props;
+  const instanceRef = useRef(instance);
+  const [isVisible, setIsVisible] = useState(
+    instanceRef.current.deunaWidgetManager.isInitialized
+  );
 
   useEffect(() => {
     instanceRef.current = instance;
@@ -25,74 +63,76 @@ export const DeunaWidget = (props: DeunaWidgetProps) => {
   // has changed
   useEffect(() => {
     const listener = () => {
-      setMode(instanceRef.current.mode);
+      setIsVisible(instanceRef.current.deunaWidgetManager.isInitialized);
     };
 
     instanceRef.current.addListener(listener);
 
     return () => {
       instanceRef.current.removeListener(listener);
-      instanceRef.current.webViewController?.dispose();
+      if (instanceRef.current.deunaWidgetManager.isInitialized) {
+        instanceRef.current.deunaWidgetManager.controller?.dispose();
+      }
     };
   }, []);
 
-  const isModal = mode === Mode.MODAL;
-  const isEmbedded = mode === Mode.EMBEDDED;
-
   /**
    * This function is used to close the widget
    */
   const onClose = () => {
-    const controller = instanceRef.current
-      .webViewController as DeunaWebViewController;
+    const controller = instanceRef.current.deunaWidgetManager.controller;
     controller.closedAction = 'userAction';
     instanceRef.current.close();
   };
 
   // render the widget if mode is not null
+  const viewManager = instanceRef.current.deunaWidgetManager;
+  const controller = viewManager.isInitialized ? viewManager.controller : null;
+
+  const isModal = isVisible && viewManager.mode === Mode.MODAL;
+  const isEmbedded = isVisible && viewManager.mode === Mode.EMBEDDED;
+
   return (
     <>
-      <Modal
-        presentationStyle="pageSheet"
-        animationType="slide"
-        onRequestClose={onClose}
-        onDismiss={instanceRef.current.onModalDismissed}
-        visible={isModal}
-      >
-        {isModal && (
+      {isModal && (
+        <Modal
+          presentationStyle="pageSheet"
+          animationType="slide"
+          onRequestClose={onClose}
+        >
           <SafeAreaView style={styles.container}>
             <View style={styles.container}>
               <DeunaWebView
-                url={instanceRef.current.webViewController?.url ?? ''}
-                onWebView={instanceRef.current.webViewController?.setWebView}
-                onMessage={instanceRef.current.webViewController?.onMessage}
-                onLoad={instanceRef.current.webViewController?.onLoad}
-                onError={instanceRef.current.webViewController?.onError}
+                url={controller?.url ?? ''}
+                onWebView={controller?.setWebView}
+                onMessage={controller?.onMessage}
+                onLoad={controller?.onLoad}
+                onError={controller?.onError}
                 onShouldStartLoadWithRequest={
-                  instanceRef.current.webViewController
-                    ?.onShouldStartLoadWithRequest
+                  controller?.onShouldStartLoadWithRequest
                 }
               />
-              <NewTabWebView instance={instanceRef.current} />
+              <ExternalUrlWebView instance={instanceRef.current} />
             </View>
           </SafeAreaView>
-        )}
-      </Modal>
+        </Modal>
+      )}
 
-      {isEmbedded && <NewTabWebView instance={instanceRef.current} />}
+      {isEmbedded && <ExternalUrlWebView instance={instanceRef.current} />}
 
       {isEmbedded && (
         <DeunaWebView
-          url={instanceRef.current.webViewController?.url ?? ''}
-          onWebView={instanceRef.current.webViewController?.setWebView}
-          onMessage={instanceRef.current.webViewController?.onMessage}
-          onLoad={instanceRef.current.webViewController?.onLoad}
-          onError={instanceRef.current.webViewController?.onError}
+          url={controller?.url ?? ''}
+          onWebView={controller?.setWebView}
+          onMessage={controller?.onMessage}
+          onLoad={controller?.onLoad}
+          onError={controller?.onError}
           onShouldStartLoadWithRequest={
-            instanceRef.current.webViewController?.onShouldStartLoadWithRequest
+            controller?.onShouldStartLoadWithRequest
           }
         />
       )}
+
       <DeviceFingerprintWebView instance={instanceRef.current} />
     </>
   );

package/src/components/ExternalUrlWebView.tsx

@@ -0,0 +1,65 @@
+import { useEffect, useRef, useState } from 'react';
+import { DeunaSDK } from '../DeunaSDK';
+import { Modal, SafeAreaView, StyleSheet } from 'react-native';
+import { DeunaWebView } from './DeunaWebView';
+
+interface ExternalUrlWebViewProps {
+  instance: DeunaSDK;
+}
+
+export const ExternalUrlWebView = (props: ExternalUrlWebViewProps) => {
+  const { instance } = props;
+  const instanceRef = useRef<DeunaSDK>(instance);
+  const [visible, setVisible] = useState(false);
+
+  useEffect(() => {
+    instanceRef.current = instance;
+  }, [instance]);
+
+  // Listen when the DeunaSDK instance configuration
+  // has changed
+  useEffect(() => {
+    const ref = instanceRef.current;
+    const listener = () => {
+      const isVisible = !!ref.externalUrlHelper.externalUrlWebViewController;
+      setVisible(isVisible);
+    };
+
+    instanceRef.current.addListener(listener);
+
+    return () => {
+      ref.removeListener(listener);
+      ref.externalUrlHelper.externalUrlWebViewController?.dispose();
+    };
+  }, []);
+
+  const externalUrlWebViewController =
+    instanceRef.current.externalUrlHelper.externalUrlWebViewController;
+
+  return (
+    <>
+      {visible && (
+        <Modal
+          presentationStyle="pageSheet"
+          animationType="slide"
+          onRequestClose={instanceRef.current.onCloseExternalUrl}
+        >
+          <SafeAreaView style={styles.container}>
+            <DeunaWebView
+              url={externalUrlWebViewController?.url ?? ''}
+              onWebView={externalUrlWebViewController?.setWebView}
+              onMessage={externalUrlWebViewController?.onMessage}
+              onLoad={externalUrlWebViewController?.onLoad}
+              onError={externalUrlWebViewController?.onError}
+              onShouldStartLoadWithRequest={
+                externalUrlWebViewController?.onShouldStartLoadWithRequest
+              }
+            />
+          </SafeAreaView>
+        </Modal>
+      )}
+    </>
+  );
+};
+
+const styles = StyleSheet.create({ container: { flex: 1 } });