@paydock/client-sdk 1.79.2-beta → 1.80.13-beta

package/bundles/widget.umd.js

@@ -532,6 +532,7 @@
       WALLET_GATEWAY["FLYPAY"] = "Flypay";
       WALLET_GATEWAY["PAYPAL"] = "Paypal";
       WALLET_GATEWAY["MASTERCARD"] = "MasterCard";
+      WALLET_GATEWAY["AFTERPAY"] = "Afterpay";
   })(WALLET_GATEWAY || (WALLET_GATEWAY = {}));
   var WALLET_TYPE;
   (function (WALLET_TYPE) {
@@ -539,6 +540,7 @@
       WALLET_TYPE["APPLE"] = "apple";
       WALLET_TYPE["FLYPAY"] = "flypay";
       WALLET_TYPE["PAYPAL"] = "paypal";
+      WALLET_TYPE["AFTERPAY"] = "afterpay";
   })(WALLET_TYPE || (WALLET_TYPE = {}));
 
   /**
@@ -2390,6 +2392,51 @@
       return HtmlWidget;
   }(HtmlMultiWidget);
 
+  /**
+   * @type {object}
+   * @param {string} CLICK=click
+   * @param {string} POPUP_REDIRECT=popup_redirect
+   * @param {string} ERROR=error
+   * @param {string} ACCEPTED=accepted
+   * @param {string} FINISH=finish
+   * @param {string} CLOSE=close
+   */
+  var CHECKOUT_BUTTON_EVENT = {
+    CLICK: 'click',
+    POPUP_REDIRECT: 'popupRedirect',
+    REDIRECT: 'redirect',
+    ERROR: 'error',
+    REFERRED: 'referred',
+    DECLINED: 'declined',
+    CANCELLED: 'cancelled',
+    ACCEPTED: 'accepted',
+    FINISH: 'finish',
+    CLOSE: 'close'
+  };
+  /**
+   * @type {object}
+   * @param {string} CONTEXTUAL=contextual
+   * @param {string} REDIRECT=redirect
+   */
+  var CHECKOUT_MODE;
+  (function (CHECKOUT_MODE) {
+    CHECKOUT_MODE["CONTEXTUAL"] = "contextual";
+    CHECKOUT_MODE["REDIRECT"] = "redirect";
+  })(CHECKOUT_MODE || (CHECKOUT_MODE = {}));
+  /**
+   * @type {object}
+   * @param {string} ZIPMONEY=Zipmoney
+   * @param {string} PAYPAL=PaypalClassic
+   * @param {string} AFTERPAY=Afterpay
+   */
+  var GATEWAY_TYPE;
+  (function (GATEWAY_TYPE) {
+    GATEWAY_TYPE["ZIPMONEY"] = "Zipmoney";
+    GATEWAY_TYPE["PAYPAL"] = "PaypalClassic";
+    GATEWAY_TYPE["AFTERPAY"] = "Afterpay";
+  })(GATEWAY_TYPE || (GATEWAY_TYPE = {}));
+  var CHECKOUT_BTN_LOG_PREFIX = '[Paydock:CheckoutButton]';
+
   var HttpCore = function () {
       function HttpCore() {
           classCallCheck(this, HttpCore);
@@ -2473,37 +2520,37 @@
       }
 
       createClass(Builder, [{
-          key: "getLink",
+          key: 'getLink',
           value: function getLink() {
               return EXTERNAL_CHECKOUT_LINK;
           }
       }, {
-          key: "setDescriptions",
+          key: 'setDescriptions',
           value: function setDescriptions(text) {
               this.body.description = text;
           }
       }, {
-          key: "setMeta",
+          key: 'setMeta',
           value: function setMeta(meta) {
               for (var key in meta) {
                   if (!meta.hasOwnProperty(key)) continue;
-                  if (SUPPORTED_CHECKOUT_META_COLLECTION.indexOf(key) !== -1) this.body.meta[key] = meta[key];else console.warn("ExternalCheckout::setMeta: unsupported meta key " + key);
+                  if (SUPPORTED_CHECKOUT_META_COLLECTION.indexOf(key) !== -1) this.body.meta[key] = meta[key];else console.warn('ExternalCheckout::setMeta: unsupported meta key ' + key);
               }
           }
       }, {
-          key: "getConfigs",
+          key: 'getConfigs',
           value: function getConfigs() {
               return this.body;
           }
       }, {
-          key: "send",
+          key: 'send',
           value: function send(publicKey, cb) {
               var errorCb = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : function (err, code) {};
 
               this.create(publicKey, this.getConfigs(), function (data, status) {
                   cb(data);
               }, function (err, status) {
-                  if (typeof err.message === "undefined") errorCb(status + ": unknown error", 'unknown_error');else errorCb(err.message, err.code);
+                  if (typeof err.message === 'undefined') errorCb(status + ': unknown error', 'unknown_error');else errorCb(err.message, err.code);
               });
           }
       }]);
@@ -2536,7 +2583,7 @@
               this.get(accessToken, function (data, status) {
                   cb(data);
               }, function (err, status) {
-                  if (typeof err.message === "undefined") errorCb(status + ': unknown error');else errorCb(err.message);
+                  if (typeof err.message === 'undefined') errorCb(status + ': unknown error');else errorCb(err.message);
               });
           }
       }]);
@@ -2836,143 +2883,394 @@
       return Background;
   }();
 
-  var TYPE = {
-      EXTERNAL_CHECKOUT_TOKEN: 'external_checkout_token',
-      CHECKOUT_TOKEN: 'checkout_token',
-      BANK_ACCOUNT: 'bank_account',
-      CARD: 'card'
-  };
-  var LINK$1 = '/v1/payment_sources/tokens';
-  var Builder$1 = function (_HttpCore) {
-      inherits(Builder, _HttpCore);
-
-      function Builder(gatewayID, body) {
-          var type = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : TYPE.CARD;
-          classCallCheck(this, Builder);
+  var BaseRunner = function () {
+      function BaseRunner() {
+          classCallCheck(this, BaseRunner);
 
-          var _this = possibleConstructorReturn(this, (Builder.__proto__ || Object.getPrototypeOf(Builder)).call(this));
+          this.widgetEnv = new Env(WIDGET_URL);
+      }
 
-          _this.body = {
-              gateway_id: gatewayID,
-              type: type
-          };
-          switch (type) {
-              case TYPE.CARD:
-              case TYPE.BANK_ACCOUNT:
-                  delete body.gateway_id;
-                  delete body.type;
-                  delete body.checkout_token;
-                  _this.body = _extends(_this.body, body);
-                  break;
-              case TYPE.CHECKOUT_TOKEN:
-              case TYPE.EXTERNAL_CHECKOUT_TOKEN:
-                  _this.body.checkout_token = body;
-                  break;
-              default:
-                  throw new Error('Unsupported type of PaymentSourceToken');
+      createClass(BaseRunner, [{
+          key: 'error',
+          value: function error(_error, code, callback) {
+              callback(true);
           }
-          return _this;
+      }, {
+          key: 'setEnv',
+          value: function setEnv(env, alias) {
+              this.widgetEnv.setEnv(env, alias);
+          }
+      }]);
+      return BaseRunner;
+  }();
+
+  var RUNNER_EVENT;
+  (function (RUNNER_EVENT) {
+      RUNNER_EVENT["SUCCESS"] = "success";
+      RUNNER_EVENT["DECLINED"] = "declined";
+      RUNNER_EVENT["CLOSE"] = "close";
+      RUNNER_EVENT["REFERRED"] = "referred";
+      RUNNER_EVENT["ERROR"] = "error";
+  })(RUNNER_EVENT || (RUNNER_EVENT = {}));
+  function ContextualRunner() {
+      var Runner = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : BaseRunner;
+
+      return function (_Runner) {
+          inherits(_class, _Runner);
+
+          function _class() {
+              var _ref;
+
+              classCallCheck(this, _class);
+
+              for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+                  args[_key] = arguments[_key];
+              }
+
+              var _this = possibleConstructorReturn(this, (_ref = _class.__proto__ || Object.getPrototypeOf(_class)).call.apply(_ref, [this].concat(args)));
+
+              _this.background = new Background();
+              _this.background.onTrigger(TRIGGER$1.FOCUS, function () {
+                  return _this.continue();
+              });
+              _this.background.onTrigger(TRIGGER$1.CLOSE, function () {
+                  return _this.stop();
+              });
+              return _this;
+          }
+
+          createClass(_class, [{
+              key: 'continue',
+              value: function _continue() {}
+          }, {
+              key: 'stop',
+              value: function stop() {}
+          }, {
+              key: 'error',
+              value: function error(_error, code, callback) {
+                  callback(true);
+              }
+          }, {
+              key: 'setSuspendedRedirectUri',
+              value: function setSuspendedRedirectUri(uri) {
+                  this.suspendedRedirectUri = uri;
+              }
+          }, {
+              key: 'setBackgroundTitle',
+              value: function setBackgroundTitle(text) {
+                  this.background.setBackdropTitle(text);
+              }
+          }, {
+              key: 'setBackgroundDescription',
+              value: function setBackgroundDescription(text) {
+                  this.background.setBackdropDescription(text);
+              }
+          }, {
+              key: 'turnOffBackdrop',
+              value: function turnOffBackdrop() {
+                  this.background.turnOffControl();
+                  this.background.turnOffLoader();
+              }
+          }]);
+          return _class;
+      }(Runner);
+  }
+
+  var DISPATCHER_LINK = '/dispatcher';
+  var DISPATCHER_ELEMENT_ID = 'paydock-dispatcher';
+  var Dispatcher = function () {
+      function Dispatcher(messageSource) {
+          classCallCheck(this, Dispatcher);
+
+          this.messageSource = messageSource;
+          this.env = new Env(WIDGET_URL);
       }
 
-      createClass(Builder, [{
-          key: 'getLink',
-          value: function getLink() {
-              return LINK$1;
+      createClass(Dispatcher, [{
+          key: 'restartDispatcher',
+          value: function restartDispatcher() {
+              var dispatcher = document.getElementById(DISPATCHER_ELEMENT_ID);
+              if (dispatcher && dispatcher.parentNode) dispatcher.parentNode.removeChild(dispatcher);
+              var iFrame = document.createElement('iframe');
+              iFrame.setAttribute('src', this.env.getConf().url + DISPATCHER_LINK);
+              iFrame.id = DISPATCHER_ELEMENT_ID;
+              iFrame.style.display = 'none';
+              document.body.appendChild(iFrame);
           }
       }, {
-          key: 'send',
-          value: function send(accessToken, cb) {
-              var errorCb = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : function (err) {};
+          key: 'on',
+          value: function on(name, cb) {
+              var _this = this;
 
-              this.create(accessToken, this.getConfigs(), function (data, status) {
-                  return cb(data);
-              }, function (err, status) {
-                  if (typeof err.message === "undefined") errorCb('unknown error');else errorCb(err.message);
+              Event.subscribe('message', window, function (event) {
+                  var data = null;
+                  try {
+                      data = JSON.parse(event.data);
+                  } catch (e) {}
+                  if (!data || data.message_source !== _this.messageSource || data.event !== name) return;
+                  cb(data);
               });
           }
       }, {
-          key: 'getConfigs',
-          value: function getConfigs() {
-              return this.body;
+          key: 'setEnv',
+          value: function setEnv(env, alias) {
+              this.env.setEnv(env, alias);
+              this.restartDispatcher();
           }
       }]);
-      return Builder;
-  }(HttpCore);
-
-  var EVENT$1 = {
-      SUCCESS: 'success',
-      DECLINED: 'declined',
-      CLOSE: 'close',
-      REFERRED: 'referred',
-      ERROR: 'error'
-  };
-
-  var Runner = function () {
-      function Runner() {
-          var _this = this;
+      return Dispatcher;
+  }();
 
-          classCallCheck(this, Runner);
+  var EVENT_CLOSE = 'close';
+  var ERROR_STYLES = "<style>\n        .error-wrapper {\n            color: #ff0000;\n            display: flex;\n            justify-content: center;\n            align-items: center;\n            height: 100%;\n        }\n        </style>";
+  var ERROR_TEMPLATE = "<div class=\"error-wrapper\"><div>{{error}}</div></div>";
+  var Popup = function () {
+      function Popup() {
+          classCallCheck(this, Popup);
 
-          this.customRedirectUti = null;
-          this.background = new Background();
-          this.background.onTrigger(TRIGGER$1.FOCUS, function () {
-              return _this.continue();
-          });
-          this.background.onTrigger(TRIGGER$1.CLOSE, function () {
-              return _this.stop();
-          });
-          this.widgetEnv = new Env(WIDGET_URL);
+          this.configs = {
+              width: 500,
+              height: 500,
+              scrollbars: true,
+              resizable: true,
+              top: 0,
+              left: 0
+          };
+          this.eventEmitter = new EventEmitter();
       }
 
-      createClass(Runner, [{
-          key: 'continue',
-          value: function _continue() {}
+      createClass(Popup, [{
+          key: "isExist",
+          value: function isExist() {
+              return !!(this.getElement() && !this.getElement().closed);
+          }
       }, {
-          key: 'next',
-          value: function next(checkoutData, params) {}
+          key: "getElement",
+          value: function getElement() {
+              return this.window;
+          }
       }, {
-          key: 'stop',
-          value: function stop() {}
+          key: "init",
+          value: function init() {
+              var _this = this;
+
+              if (!Browser.isSupportPopUp()) return this.window = window;
+              var configs = this.getConfigs();
+              this.window = window.open('about:blank', '_blank', "noopener=false,width=" + configs.width + ",height=" + configs.height + ",top=" + configs.top + ",left=" + configs.left + ",scrollbars=" + (configs.scrollbars ? 'yes' : 'no') + ",resizable=" + (configs.resizable ? 'yes' : 'no'));
+              this.showLoader();
+              var timer = setInterval(function () {
+                  if (!_this.isExist()) {
+                      clearInterval(timer);
+                      _this.eventEmitter.emit(EVENT_CLOSE, {});
+                  }
+              }, 200);
+          }
       }, {
-          key: 'error',
-          value: function error(_error, code, callback) {
-              callback(true);
+          key: "redirect",
+          value: function redirect(url) {
+              if (!this.isExist()) return;
+              this.window.location.href = url;
           }
       }, {
-          key: 'setCustomRedirectUri',
-          value: function setCustomRedirectUri(uri) {
-              this.customRedirectUti = uri;
+          key: "close",
+          value: function close() {
+              if (!this.isExist() || !this.getElement().close) return;
+              this.getElement().close();
+              this.window = null;
           }
       }, {
-          key: 'setEnv',
-          value: function setEnv(env, alias) {
-              this.widgetEnv.setEnv(env, alias);
+          key: "focus",
+          value: function focus() {
+              if (!this.isExist() || !this.getElement().focus) return;
+              this.getElement().focus();
+          }
+      }, {
+          key: "setConfigs",
+          value: function setConfigs(configs) {
+              this.configs = _extends(this.configs, configs);
           }
       }, {
-          key: 'setBackgroundTitle',
-          value: function setBackgroundTitle(text) {
-              this.background.setBackdropTitle(text);
+          key: "getNetConfigs",
+          value: function getNetConfigs() {
+              return _extends({}, this.configs);
           }
       }, {
-          key: 'setBackgroundDescription',
-          value: function setBackgroundDescription(text) {
-              this.background.setBackdropDescription(text);
+          key: "getConfigs",
+          value: function getConfigs() {
+              var configs = this.getNetConfigs();
+              configs.left = window.screenX + (window.screen.width / 2 - configs.width / 2);
+              configs.top = window.screenY + (window.screen.height / 2 - configs.height / 2);
+              return configs;
           }
       }, {
-          key: 'turnOffBackdrop',
-          value: function turnOffBackdrop() {
-              this.background.turnOffControl();
-              this.background.turnOffLoader();
+          key: "onClose",
+          value: function onClose(cb) {
+              this.eventEmitter.subscribe(EVENT_CLOSE, cb);
+          }
+      }, {
+          key: "initError",
+          value: function initError(error) {
+              this.getElement().document.write(".");
+              var body = this.getElement().document.body || this.getElement().document.getElementsByTagName('body')[0];
+              body.innerHTML = ERROR_STYLES + ERROR_TEMPLATE.replace('{{error}}', error);
+          }
+      }, {
+          key: "showLoader",
+          value: function showLoader() {
+              this.getElement().document.write(".");
+              var body = this.getElement().document.body || this.getElement().document.getElementsByTagName('body')[0];
+              body.innerHTML = STYLE$1 + TEMPLATE;
+              if (this.env !== ENV.STAGING || this.env !== ENV.STAGING_1 || this.env !== ENV.STAGING_2 || this.env !== ENV.STAGING_3 || this.env !== ENV.STAGING_4 || this.env !== ENV.STAGING_5 || this.env !== ENV.STAGING_6 || this.env !== ENV.STAGING_7 || this.env !== ENV.STAGING_8 || this.env !== ENV.STAGING_9 || this.env !== ENV.STAGING_10 || this.env !== ENV.STAGING_11 || this.env !== ENV.STAGING_12 || this.env !== ENV.STAGING_13 || this.env !== ENV.STAGING_14 || this.env !== ENV.STAGING_15) return;
+              var clickCount = 0;
+              Event.subscribe('click', body, function () {
+                  clickCount++;
+                  if (clickCount !== 5) return;
+                  body.innerHTML = EXTRA_STYLE + EXTRA_TEMPLATE;
+              });
+          }
+      }, {
+          key: "setEnv",
+          value: function setEnv(env) {
+              this.env = env;
           }
       }]);
-      return Runner;
+      return Popup;
   }();
 
-  var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
-
-  function commonjsRequire () {
-  	throw new Error('Dynamic requires are not currently supported by rollup-plugin-commonjs');
-  }
+  var PopupRunner = function (_ContextualRunner) {
+      inherits(PopupRunner, _ContextualRunner);
+
+      function PopupRunner(publicKey) {
+          classCallCheck(this, PopupRunner);
+
+          var _this = possibleConstructorReturn(this, (PopupRunner.__proto__ || Object.getPrototypeOf(PopupRunner)).call(this));
+
+          _this.publicKey = publicKey;
+          _this.checkout = null;
+          _this.dispatcher = new Dispatcher('checkout.paydock');
+          setTimeout(function () {
+              return _this.dispatcher.restartDispatcher();
+          }, 200);
+          _this.popup = new Popup();
+          return _this;
+      }
+
+      createClass(PopupRunner, [{
+          key: 'run',
+          value: function run() {
+              if (this.isRunning()) return;
+              this.popup.init();
+              this.background.initControl();
+          }
+      }, {
+          key: 'isRunning',
+          value: function isRunning() {
+              return this.popup.isExist();
+          }
+      }, {
+          key: 'next',
+          value: function next(checkoutData) {
+              this.checkout = checkoutData;
+              if (!Browser.isSupportPopUp()) window.localStorage.setItem('paydock_checkout_token', JSON.stringify(this.checkout));
+              this.popup.redirect(this.checkout.link);
+          }
+      }, {
+          key: 'continue',
+          value: function _continue() {
+              this.popup.focus();
+          }
+      }, {
+          key: 'stop',
+          value: function stop() {
+              this.popup.close();
+          }
+      }, {
+          key: 'onStop',
+          value: function onStop(cb) {
+              var _this2 = this;
+
+              this.popup.onClose(function () {
+                  _this2.background.clear();
+                  _this2.checkout = null;
+                  cb();
+              });
+          }
+      }, {
+          key: 'onCheckout',
+          value: function onCheckout(event, cb) {
+              var _this3 = this;
+
+              this.dispatcher.on(event, function (data) {
+                  if (_this3.checkout && _this3.checkout.reference_id === data.reference_id) {
+                      _this3.background.clear();
+                      cb(_this3.checkout);
+                  } else if (!Browser.isSupportPopUp()) {
+                      var item = window.localStorage.getItem('paydock_checkout_token');
+                      if (!item) return;
+                      var checkout = JSON.parse(item);
+                      if (checkout && checkout.reference_id === data.reference_id) {
+                          window.localStorage.removeItem('paydock_checkout_token');
+                          _this3.checkout = checkout;
+                          _this3.background.clear();
+                          cb(_this3.checkout);
+                      }
+                  }
+              });
+          }
+      }, {
+          key: 'setEnv',
+          value: function setEnv(env, alias) {
+              get(PopupRunner.prototype.__proto__ || Object.getPrototypeOf(PopupRunner.prototype), 'setEnv', this).call(this, env, alias);
+              this.dispatcher.setEnv(env, alias);
+              this.popup.setEnv(env);
+          }
+      }]);
+      return PopupRunner;
+  }(ContextualRunner());
+
+  function RedirectRunner() {
+      var Runner = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : BaseRunner;
+
+      return function (_Runner) {
+          inherits(_class, _Runner);
+
+          function _class() {
+              classCallCheck(this, _class);
+              return possibleConstructorReturn(this, (_class.__proto__ || Object.getPrototypeOf(_class)).apply(this, arguments));
+          }
+
+          createClass(_class, [{
+              key: 'setRedirectUrl',
+              value: function setRedirectUrl(url) {
+                  this.merchantRedirectUrl = url;
+              }
+          }, {
+              key: 'getRedirectUrl',
+              value: function getRedirectUrl() {
+                  return this.merchantRedirectUrl;
+              }
+          }, {
+              key: 'error',
+              value: function error(_error, code, callback) {
+                  callback(false);
+              }
+          }]);
+          return _class;
+      }(Runner);
+  }
+
+  function isContextualRunner(runner) {
+      return 'run' in runner;
+  }
+  function isRedirectRunner(runner) {
+      return 'setRedirectUrl' in runner;
+  }
+
+  var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
+
+  function commonjsRequire () {
+  	throw new Error('Dynamic requires are not currently supported by rollup-plugin-commonjs');
+  }
 
   function unwrapExports (x) {
   	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
@@ -4007,49 +4305,77 @@
 
   unwrapExports(zipmoney);
 
-  var ECHO_LINK = '/v1/echo';
-  var REDIRECT_URL_SUSPENDED = '/checkout/zipmoney';
-  var ZipmoneyRunner = function (_Runner) {
-      inherits(ZipmoneyRunner, _Runner);
+  var ECHO_URI = '/v1/echo';
+  var LOG_PREFIX = '[CheckoutButton:Zipmoney]';
+  var ZipmoneyRunner = function (_BaseRunner) {
+      inherits(ZipmoneyRunner, _BaseRunner);
 
-      function ZipmoneyRunner(publicKey) {
+      function ZipmoneyRunner() {
           classCallCheck(this, ZipmoneyRunner);
 
           var _this = possibleConstructorReturn(this, (ZipmoneyRunner.__proto__ || Object.getPrototypeOf(ZipmoneyRunner)).call(this));
 
-          _this.publicKey = publicKey;
-          _this.checkout = null;
+          _this.apiEnv = new Env(API_URL);
+          return _this;
+      }
+
+      createClass(ZipmoneyRunner, [{
+          key: 'setEnv',
+          value: function setEnv(env, alias) {
+              get(ZipmoneyRunner.prototype.__proto__ || Object.getPrototypeOf(ZipmoneyRunner.prototype), 'setEnv', this).call(this, env, alias);
+              this.apiEnv.setEnv(env, alias);
+          }
+      }, {
+          key: 'getCheckoutUri',
+          value: function getCheckoutUri(redirectUri) {
+              return this.apiEnv.getConf().url + ECHO_URI + '?' + Url.serialize({
+                  json_body: JSON.stringify({
+                      redirect_uri: redirectUri
+                  })
+              });
+          }
+      }]);
+      return ZipmoneyRunner;
+  }(BaseRunner);
+
+  var ZIPMONEY_PROXY_REDIRECT_URL = '/checkout/zipmoney/response';
+  var ZIPMONEY_DEFAULT_SUSPENDED_URL = '/checkout/zipmoney/suspended';
+  var ZIPMONEY_MESSAGE_SOURCE = 'zipmoney.checkout.paydock';
+
+  var ZipmoneyContextualRunner = function (_ContextualRunner) {
+      inherits(ZipmoneyContextualRunner, _ContextualRunner);
+
+      function ZipmoneyContextualRunner() {
+          classCallCheck(this, ZipmoneyContextualRunner);
+
+          var _this = possibleConstructorReturn(this, (ZipmoneyContextualRunner.__proto__ || Object.getPrototypeOf(ZipmoneyContextualRunner)).call(this));
+
           _this.runs = false;
           _this.eventEmitter = new EventEmitter();
-          _this.echoEnv = new Env(API_URL);
           return _this;
       }
 
-      createClass(ZipmoneyRunner, [{
-          key: "run",
+      createClass(ZipmoneyContextualRunner, [{
+          key: 'run',
           value: function run() {
               this.runs = true;
               this.background.initLoader();
           }
       }, {
-          key: "isRunning",
+          key: 'isRunning',
           value: function isRunning() {
               return this.runs;
           }
       }, {
-          key: "next",
+          key: 'next',
           value: function next(checkoutData) {
               var _this2 = this;
 
               this.background.clear();
               this.checkout = checkoutData;
-              var checkoutLink = String(ECHO_LINK);
-              checkoutLink = Url.extendSearchParams(checkoutLink, AccessToken.validateJWT(this.publicKey) ? 'access_token' : 'public_key', this.publicKey);
-              checkoutLink = Url.extendSearchParams(checkoutLink, 'json_body', encodeURIComponent(JSON.stringify({
-                  redirect_uri: this.checkout.link
-              })));
+              var checkoutUri = this.getCheckoutUri(this.checkout.link);
               Zip.Checkout.init({
-                  checkoutUri: this.echoEnv.getConf().url + checkoutLink,
+                  checkoutUri: checkoutUri,
                   onComplete: function onComplete(args) {
                       return _this2.eventHandler(args);
                   },
@@ -4059,26 +4385,36 @@
               });
           }
       }, {
-          key: "stop",
+          key: 'getSuccessRedirectUri',
+          value: function getSuccessRedirectUri() {
+              return this.suspendedRedirectUri ? this.suspendedRedirectUri : this.widgetEnv.getConf().url + String(ZIPMONEY_DEFAULT_SUSPENDED_URL);
+          }
+      }, {
+          key: 'getErrorRedirectUri',
+          value: function getErrorRedirectUri() {
+              return this.getSuccessRedirectUri();
+          }
+      }, {
+          key: 'stop',
           value: function stop() {
-              get(ZipmoneyRunner.prototype.__proto__ || Object.getPrototypeOf(ZipmoneyRunner.prototype), "stop", this).call(this);
+              get(ZipmoneyContextualRunner.prototype.__proto__ || Object.getPrototypeOf(ZipmoneyContextualRunner.prototype), 'stop', this).call(this);
               this.runs = false;
               var element = document.querySelector('.zipmoney-overlay');
               if (element) element.remove();
-              this.eventEmitter.emit(EVENT$1.CLOSE, {});
+              this.eventEmitter.emit(RUNNER_EVENT.CLOSE);
           }
       }, {
-          key: "onStop",
+          key: 'onStop',
           value: function onStop(cb) {
               var _this3 = this;
 
-              this.eventEmitter.subscribe(EVENT$1.CLOSE, function () {
+              this.eventEmitter.subscribe(RUNNER_EVENT.CLOSE, function () {
                   _this3.background.clear();
                   cb();
               });
           }
       }, {
-          key: "onCheckout",
+          key: 'onCheckout',
           value: function onCheckout(event, cb) {
               var _this4 = this;
 
@@ -4087,451 +4423,386 @@
               });
           }
       }, {
-          key: "eventHandler",
+          key: 'eventHandler',
           value: function eventHandler(args) {
               this.runs = false;
               switch (args.state) {
-                  case 'approved':
-                      this.eventEmitter.emit(EVENT$1.CLOSE, {});
-                      this.eventEmitter.emit(EVENT$1.SUCCESS, {});
+                  case "approved" /* APPROVED */:
+                      this.eventEmitter.emit(RUNNER_EVENT.CLOSE);
+                      this.eventEmitter.emit(RUNNER_EVENT.SUCCESS);
                       break;
-                  case 'declined':
-                      this.eventEmitter.emit(EVENT$1.CLOSE, {});
-                      this.eventEmitter.emit(EVENT$1.DECLINED, {});
+                  case "declined" /* DECLINED */:
+                      this.eventEmitter.emit(RUNNER_EVENT.CLOSE);
+                      this.eventEmitter.emit(RUNNER_EVENT.DECLINED);
                       break;
-                  case 'cancelled':
-                      this.eventEmitter.emit(EVENT$1.CLOSE, {});
+                  case "cancelled" /* CANCELLED */:
+                      this.eventEmitter.emit(RUNNER_EVENT.CLOSE);
                       break;
-                  case 'referred':
-                      this.eventEmitter.emit(EVENT$1.CLOSE, {});
-                      this.eventEmitter.emit(EVENT$1.REFERRED, {});
+                  case "referred" /* REFERRED */:
+                      this.eventEmitter.emit(RUNNER_EVENT.CLOSE);
+                      this.eventEmitter.emit(RUNNER_EVENT.REFERRED);
                       break;
                   default:
-                      console.warn('Unknown gateway status');
+                      console.warn(LOG_PREFIX + ' Unknown gateway status.');
                       break;
               }
           }
-      }, {
-          key: "getSuccessRedirectUri",
-          value: function getSuccessRedirectUri() {
-              return this.customRedirectUti ? this.customRedirectUti : this.widgetEnv.getConf().url + String(REDIRECT_URL_SUSPENDED);
-          }
-      }, {
-          key: "getErrorRedirectUri",
-          value: function getErrorRedirectUri() {
-              return this.getSuccessRedirectUri();
-          }
-      }, {
-          key: "setEnv",
-          value: function setEnv(env, alias) {
-              get(ZipmoneyRunner.prototype.__proto__ || Object.getPrototypeOf(ZipmoneyRunner.prototype), "setEnv", this).call(this, env, alias);
-              this.echoEnv.setEnv(env, alias);
-          }
       }]);
-      return ZipmoneyRunner;
-  }(Runner);
-
-  var EXTERNAL_CHECKOUT_LINK$1 = '/v1/gateways/:gateway_id';
-  var Info = function (_HttpCore) {
-      inherits(Info, _HttpCore);
-
-      function Info(gatewayID) {
-          classCallCheck(this, Info);
-
-          var _this = possibleConstructorReturn(this, (Info.__proto__ || Object.getPrototypeOf(Info)).call(this));
-
-          _this.gatewayID = gatewayID;
-          return _this;
-      }
-
-      createClass(Info, [{
-          key: 'getLink',
-          value: function getLink() {
-              return String(EXTERNAL_CHECKOUT_LINK$1).replace(':gateway_id', this.gatewayID);
-          }
-      }, {
-          key: 'sendRequest',
-          value: function sendRequest(publicKey, cb) {
-              var errorCb = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : function (err) {};
-
-              this.get(publicKey, function (data, status) {
-                  cb(data);
-              }, function (err, status) {
-                  if (typeof err.message === "undefined") errorCb(status + ': unknown error');else errorCb(err.message);
-              });
-          }
-      }], [{
-          key: 'sendRequest',
-          value: function sendRequest(gatewayID, publicKey, env, cb) {
-              var errorCb = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : function (err) {};
-
-              var info = new this(gatewayID);
-              info.setEnv(env);
-              info.sendRequest(publicKey, cb, errorCb);
-          }
-      }]);
-      return Info;
-  }(HttpCore);
-
-  var GATEWAY_TYPE = {
-      ZIPMONEY: 'Zipmoney',
-      PAYPAL: 'PaypalClassic',
-      AFTERPAY: 'Afterpay'
-  };
-
-  var DISPATCHER_LINK = '/dispatcher';
-  var DISPATCHER_ELEMENT_ID = 'paydock-dispatcher';
-  var Dispatcher = function () {
-      function Dispatcher(messageSource) {
-          classCallCheck(this, Dispatcher);
+      return ZipmoneyContextualRunner;
+  }(ContextualRunner(ZipmoneyRunner));
+
+  var STORAGE_DISPATCHER_URI = '/storage-dispatcher';
+  var STORAGE_DISPATCHER_ID = 'pd-storage-dispatcher';
+  var LOG_PREFIX$1 = '[Paydock:StorageDispatcher]';
+  var StorageDataIntent;
+  (function (StorageDataIntent) {
+      StorageDataIntent["WIDGET_SESSION"] = "widget-session";
+  })(StorageDataIntent || (StorageDataIntent = {}));
+  var StorageDispatcher = function () {
+      function StorageDispatcher(messageSource) {
+          classCallCheck(this, StorageDispatcher);
 
           this.messageSource = messageSource;
+          this.defaultPayload = {
+              destination: 'widget.paydock'
+          };
           this.env = new Env(WIDGET_URL);
+          this.defaultPayload.source = messageSource;
       }
 
-      createClass(Dispatcher, [{
-          key: 'restartDispatcher',
-          value: function restartDispatcher() {
-              var dispatcher = document.getElementById(DISPATCHER_ELEMENT_ID);
-              if (dispatcher) dispatcher.parentNode.removeChild(dispatcher);
+      createClass(StorageDispatcher, [{
+          key: 'create',
+          value: function create() {
+              if (this.dispatcherFrame) this.destroy();
               var iFrame = document.createElement('iframe');
-              iFrame.setAttribute('src', this.env.getConf().url + DISPATCHER_LINK);
-              iFrame.id = DISPATCHER_ELEMENT_ID;
+              iFrame.setAttribute('src', this.env.getConf().url + STORAGE_DISPATCHER_URI);
+              iFrame.setAttribute('id', STORAGE_DISPATCHER_ID);
               iFrame.style.display = 'none';
               document.body.appendChild(iFrame);
+              console.info(LOG_PREFIX$1 + ' initialized.');
+              return iFrame;
           }
       }, {
-          key: 'on',
-          value: function on(name, cb) {
-              var _this = this;
-
-              Event.subscribe('message', window, function (event) {
-                  var data = null;
-                  try {
-                      data = JSON.parse(event.data);
-                  } catch (e) {}
-                  if (!data || data.message_source !== _this.messageSource || data.event !== name) return;
-                  cb(data);
-              });
+          key: 'destroy',
+          value: function destroy() {
+              if (this.dispatcherFrame && this.dispatcherFrame.parentNode) {
+                  this.dispatcherFrame.parentNode.removeChild(this.dispatcherFrame);
+                  this.dispatcherFrame = undefined;
+              }
+          }
+      }, {
+          key: 'push',
+          value: function push(payload) {
+              var _a;
+              if (!this.dispatcherFrame) {
+                  console.error(LOG_PREFIX$1 + ' dispatcher is not initialized.');
+                  return;
+              }
+              var body = _extends(_extends({}, this.defaultPayload), payload);
+              (_a = this.dispatcherFrame.contentWindow) === null || _a === void 0 ? void 0 : _a.postMessage(body, this.env.getConf().url);
           }
       }, {
           key: 'setEnv',
           value: function setEnv(env, alias) {
               this.env.setEnv(env, alias);
-              this.restartDispatcher();
+              this.dispatcherFrame = this.create();
           }
       }]);
-      return Dispatcher;
+      return StorageDispatcher;
   }();
 
-  var EVENT_CLOSE = 'close';
-  var ERROR_STYLES = "<style>\n        .error-wrapper {\n            color: #ff0000;\n            display: flex;\n            justify-content: center;\n            align-items: center;\n            height: 100%;\n        }\n        </style>";
-  var ERROR_TEMPLATE = "<div class=\"error-wrapper\"><div>{{error}}</div></div>";
-  var Popup = function () {
-      function Popup() {
-          classCallCheck(this, Popup);
+  var ZipmoneyRedirectRunner = function (_RedirectRunner) {
+      inherits(ZipmoneyRedirectRunner, _RedirectRunner);
 
-          this.configs = {
-              width: 500,
-              height: 500,
-              scrollbars: true,
-              resizable: true,
-              top: 0,
-              left: 0
-          };
-          this.eventEmitter = new EventEmitter();
+      function ZipmoneyRedirectRunner() {
+          classCallCheck(this, ZipmoneyRedirectRunner);
+
+          var _this = possibleConstructorReturn(this, (ZipmoneyRedirectRunner.__proto__ || Object.getPrototypeOf(ZipmoneyRedirectRunner)).call(this));
+
+          _this.storageDispatcher = new StorageDispatcher(ZIPMONEY_MESSAGE_SOURCE);
+          return _this;
       }
 
-      createClass(Popup, [{
-          key: "isExist",
-          value: function isExist() {
-              return !!(this.getElement() && !this.getElement().closed);
+      createClass(ZipmoneyRedirectRunner, [{
+          key: 'getProxyRedirectUrl',
+          value: function getProxyRedirectUrl() {
+              return this.widgetEnv.getConf().url + ZIPMONEY_PROXY_REDIRECT_URL;
           }
       }, {
-          key: "getElement",
-          value: function getElement() {
-              return this.window;
+          key: 'next',
+          value: function next(checkout, params) {
+              var widgetSessionData = {
+                  merchant_redirect_url: this.getRedirectUrl(),
+                  checkout_token: checkout.token,
+                  public_key: params.public_key,
+                  gateway_id: params.gateway_id
+              };
+              this.storageDispatcher.push({ intent: StorageDataIntent.WIDGET_SESSION, data: widgetSessionData });
+              var checkoutUri = this.getCheckoutUri(checkout.link);
+              Zip.Checkout.init({
+                  checkoutUri: checkoutUri,
+                  redirect: true
+              });
           }
-      }, {
-          key: "init",
-          value: function init() {
-              var _this = this;
+          // for backward compatibility
 
-              if (!Browser.isSupportPopUp()) return this.window = window;
-              var configs = this.getConfigs();
-              this.window = window.open('about:blank', '_blank', "width=" + configs.width + ",height=" + configs.height + ",top=" + configs.top + ",left=" + configs.left + ",scrollbars=" + (configs.scrollbars ? 'yes' : 'no') + ",resizable=" + (configs.resizable ? 'yes' : 'no'));
-              this.showLoader();
-              var timer = setInterval(function () {
-                  if (!_this.isExist()) {
-                      clearInterval(timer);
-                      _this.eventEmitter.emit(EVENT_CLOSE, {});
-                  }
-              }, 200);
-          }
-      }, {
-          key: "redirect",
-          value: function redirect(url) {
-              if (!this.isExist()) return;
-              this.window.location.href = url;
-          }
       }, {
-          key: "close",
-          value: function close() {
-              if (!this.isExist() || !this.getElement().close) return;
-              this.getElement().close();
-              this.window = null;
-          }
-      }, {
-          key: "focus",
-          value: function focus() {
-              if (!this.isExist() || !this.getElement().focus) return;
-              this.getElement().focus();
-          }
-      }, {
-          key: "setConfigs",
-          value: function setConfigs(configs) {
-              this.configs = _extends(this.configs, configs);
-          }
-      }, {
-          key: "getNetConfigs",
-          value: function getNetConfigs() {
-              return _extends({}, this.configs);
-          }
-      }, {
-          key: "getConfigs",
-          value: function getConfigs() {
-              var configs = this.getNetConfigs();
-              configs.left = window.screenX + (window.screen.width / 2 - configs.width / 2);
-              configs.top = window.screenY + (window.screen.height / 2 - configs.height / 2);
-              return configs;
+          key: 'getSuccessRedirectUri',
+          value: function getSuccessRedirectUri() {
+              return this.getProxyRedirectUrl();
           }
+          // for backward compatibility
+
       }, {
-          key: "onClose",
-          value: function onClose(cb) {
-              this.eventEmitter.subscribe(EVENT_CLOSE, cb);
+          key: 'getErrorRedirectUri',
+          value: function getErrorRedirectUri() {
+              return this.getProxyRedirectUrl();
           }
       }, {
-          key: "initError",
-          value: function initError(error) {
-              this.getElement().document.write(".");
-              var body = this.getElement().document.body || this.getElement().document.getElementsByTagName('body')[0];
-              body.innerHTML = ERROR_STYLES + ERROR_TEMPLATE.replace('{{error}}', error);
+          key: 'setEnv',
+          value: function setEnv(env, alias) {
+              get(ZipmoneyRedirectRunner.prototype.__proto__ || Object.getPrototypeOf(ZipmoneyRedirectRunner.prototype), 'setEnv', this).call(this, env, alias);
+              this.storageDispatcher.setEnv(env, alias);
           }
-      }, {
-          key: "showLoader",
-          value: function showLoader() {
-              this.getElement().document.write(".");
-              var body = this.getElement().document.body || this.getElement().document.getElementsByTagName('body')[0];
-              body.innerHTML = STYLE$1 + TEMPLATE;
-              if (this.env !== ENV.STAGING || this.env !== ENV.STAGING_1 || this.env !== ENV.STAGING_2 || this.env !== ENV.STAGING_3 || this.env !== ENV.STAGING_4 || this.env !== ENV.STAGING_5 || this.env !== ENV.STAGING_6 || this.env !== ENV.STAGING_7 || this.env !== ENV.STAGING_8 || this.env !== ENV.STAGING_9 || this.env !== ENV.STAGING_10 || this.env !== ENV.STAGING_11 || this.env !== ENV.STAGING_12 || this.env !== ENV.STAGING_13 || this.env !== ENV.STAGING_14 || this.env !== ENV.STAGING_15) return;
-              var clickCount = 0;
-              Event.subscribe('click', body, function () {
-                  clickCount++;
-                  if (clickCount !== 5) return;
-                  body.innerHTML = EXTRA_STYLE + EXTRA_TEMPLATE;
-              });
+      }]);
+      return ZipmoneyRedirectRunner;
+  }(RedirectRunner(ZipmoneyRunner));
+
+  var REDIRECT_URI_SUCCESS = '/checkout/success';
+  var REDIRECT_URI_ERROR = '/checkout/error';
+  var PaypalRunner = function (_PopupRunner) {
+      inherits(PaypalRunner, _PopupRunner);
+
+      function PaypalRunner() {
+          classCallCheck(this, PaypalRunner);
+          return possibleConstructorReturn(this, (PaypalRunner.__proto__ || Object.getPrototypeOf(PaypalRunner)).apply(this, arguments));
+      }
+
+      createClass(PaypalRunner, [{
+          key: 'getSuccessRedirectUri',
+          value: function getSuccessRedirectUri() {
+              return this.widgetEnv.getConf().url + Url.extendSearchParams(REDIRECT_URI_SUCCESS, 'merchant', encodeURIComponent(window.location.href));
           }
       }, {
-          key: "setEnv",
-          value: function setEnv(env) {
-              this.env = env;
+          key: 'getErrorRedirectUri',
+          value: function getErrorRedirectUri() {
+              return this.widgetEnv.getConf().url + Url.extendSearchParams(REDIRECT_URI_ERROR, 'merchant', encodeURIComponent(window.location.href));
           }
       }]);
-      return Popup;
-  }();
-
-  var PopupRunner = function (_Runner) {
-      inherits(PopupRunner, _Runner);
+      return PaypalRunner;
+  }(PopupRunner);
 
-      function PopupRunner(publicKey) {
-          classCallCheck(this, PopupRunner);
+  var REDIRECT_URI_SUCCESS$1 = '/checkout/afterpay/merchant/{{merchant}}/success';
+  var REDIRECT_URI_ERROR$1 = '/checkout/afterpay/merchant/{{merchant}}/error';
+  var CHECKOUT_URL = '/checkout/afterpay/init';
 
-          var _this = possibleConstructorReturn(this, (PopupRunner.__proto__ || Object.getPrototypeOf(PopupRunner)).call(this));
+  var AfterpayRunner = function (_PopupRunner) {
+      inherits(AfterpayRunner, _PopupRunner);
 
-          _this.publicKey = publicKey;
-          _this.checkout = null;
-          _this.dispatcher = new Dispatcher('checkout.paydock');
-          setTimeout(function () {
-              return _this.dispatcher.restartDispatcher();
-          }, 200);
-          _this.popup = new Popup();
-          return _this;
+      function AfterpayRunner() {
+          classCallCheck(this, AfterpayRunner);
+          return possibleConstructorReturn(this, (AfterpayRunner.__proto__ || Object.getPrototypeOf(AfterpayRunner)).apply(this, arguments));
       }
 
-      createClass(PopupRunner, [{
-          key: "run",
-          value: function run() {
-              if (this.isRunning()) return;
-              this.popup.init();
-              this.background.initControl();
+      createClass(AfterpayRunner, [{
+          key: 'getSuccessRedirectUri',
+          value: function getSuccessRedirectUri() {
+              return this.widgetEnv.getConf().url + REDIRECT_URI_SUCCESS$1.replace('{{merchant}}', encodeURIComponent(window.btoa(window.location.href)));
           }
       }, {
-          key: "isRunning",
-          value: function isRunning() {
-              return this.popup.isExist();
+          key: 'getErrorRedirectUri',
+          value: function getErrorRedirectUri() {
+              return this.widgetEnv.getConf().url + REDIRECT_URI_ERROR$1.replace('{{merchant}}', encodeURIComponent(window.btoa(window.location.href)));
           }
       }, {
-          key: "next",
-          value: function next(checkoutData) {
+          key: 'next',
+          value: function next(checkoutData, params) {
               this.checkout = checkoutData;
               if (!Browser.isSupportPopUp()) window.localStorage.setItem('paydock_checkout_token', JSON.stringify(this.checkout));
-              this.popup.redirect(this.checkout.link);
-          }
-      }, {
-          key: "continue",
-          value: function _continue() {
-              this.popup.focus();
+              this.popup.redirect(this.getRedirectUrl(this.checkout, params));
           }
       }, {
-          key: "stop",
-          value: function stop() {
-              this.popup.close();
+          key: 'error',
+          value: function error(_error, code, callback) {
+              if (!code || code && code !== 'invalid_amount') return callback(true);
+              this.popup.initError(_error);
+              return callback(false);
           }
       }, {
-          key: "onStop",
-          value: function onStop(cb) {
-              var _this2 = this;
-
-              this.popup.onClose(function () {
-                  _this2.background.clear();
-                  _this2.checkout = null;
-                  cb();
+          key: 'run',
+          value: function run() {
+              if (this.isRunning()) return;
+              this.popup.setConfigs({
+                  width: 420,
+                  height: 715
               });
+              this.popup.init();
+              this.background.initControl();
           }
       }, {
-          key: "onCheckout",
-          value: function onCheckout(event, cb) {
-              var _this3 = this;
-
-              this.dispatcher.on(event, function (data) {
-                  if (_this3.checkout && _this3.checkout.reference_id === data.reference_id) {
-                      _this3.background.clear();
-                      cb(_this3.checkout);
-                  } else if (!Browser.isSupportPopUp()) {
-                      var item = window.localStorage.getItem('paydock_checkout_token');
-                      if (!item) return;
-                      var checkout = JSON.parse(item);
-                      if (checkout && checkout.reference_id === data.reference_id) {
-                          window.localStorage.removeItem('paydock_checkout_token');
-                          _this3.checkout = checkout;
-                          _this3.background.clear();
-                          cb(_this3.checkout);
-                      }
-                  }
-              });
-          }
-      }, {
-          key: "setEnv",
-          value: function setEnv(env, alias) {
-              get(PopupRunner.prototype.__proto__ || Object.getPrototypeOf(PopupRunner.prototype), "setEnv", this).call(this, env, alias);
-              this.dispatcher.setEnv(env, alias);
-              this.popup.setEnv(env);
+          key: 'getRedirectUrl',
+          value: function getRedirectUrl(checkout, params) {
+              return this.widgetEnv.getConf().url + CHECKOUT_URL + '?' + Url.serialize(_extends(_extends({}, params), { token: checkout.reference_id, env: checkout.mode === 'live' ? 'live' : 'test' }));
           }
       }]);
-      return PopupRunner;
-  }(Runner);
+      return AfterpayRunner;
+  }(PopupRunner);
 
-  var REDIRECT_URI_SUCCESS = '/checkout/success';
-  var REDIRECT_URI_ERROR = '/checkout/error';
-  var PaypalRunner = function (_PopupRunner) {
-      inherits(PaypalRunner, _PopupRunner);
+  var TYPE = {
+      EXTERNAL_CHECKOUT_TOKEN: 'external_checkout_token',
+      CHECKOUT_TOKEN: 'checkout_token',
+      BANK_ACCOUNT: 'bank_account',
+      CARD: 'card'
+  };
+  var LINK$1 = '/v1/payment_sources/tokens';
+  var Builder$1 = function (_HttpCore) {
+      inherits(Builder, _HttpCore);
 
-      function PaypalRunner() {
-          classCallCheck(this, PaypalRunner);
-          return possibleConstructorReturn(this, (PaypalRunner.__proto__ || Object.getPrototypeOf(PaypalRunner)).apply(this, arguments));
+      function Builder(gatewayID, body) {
+          var type = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : TYPE.CARD;
+          classCallCheck(this, Builder);
+
+          var _this = possibleConstructorReturn(this, (Builder.__proto__ || Object.getPrototypeOf(Builder)).call(this));
+
+          _this.body = {
+              gateway_id: gatewayID,
+              type: type
+          };
+          switch (type) {
+              case TYPE.CARD:
+              case TYPE.BANK_ACCOUNT:
+                  delete body.gateway_id;
+                  delete body.type;
+                  delete body.checkout_token;
+                  _this.body = _extends(_this.body, body);
+                  break;
+              case TYPE.CHECKOUT_TOKEN:
+              case TYPE.EXTERNAL_CHECKOUT_TOKEN:
+                  _this.body.checkout_token = body;
+                  break;
+              default:
+                  throw new Error('Unsupported type of PaymentSourceToken');
+          }
+          return _this;
       }
 
-      createClass(PaypalRunner, [{
-          key: "getSuccessRedirectUri",
-          value: function getSuccessRedirectUri() {
-              return this.widgetEnv.getConf().url + Url.extendSearchParams(REDIRECT_URI_SUCCESS, 'merchant', encodeURIComponent(window.location.href));
+      createClass(Builder, [{
+          key: 'getLink',
+          value: function getLink() {
+              return LINK$1;
+          }
+      }, {
+          key: 'send',
+          value: function send(accessToken, cb) {
+              var errorCb = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : function (err) {};
+
+              this.create(accessToken, this.getConfigs(), function (data, status) {
+                  return cb(data);
+              }, function (err, status) {
+                  if (typeof err.message === "undefined") errorCb('unknown error');else errorCb(err.message);
+              });
           }
       }, {
-          key: "getErrorRedirectUri",
-          value: function getErrorRedirectUri() {
-              return this.widgetEnv.getConf().url + Url.extendSearchParams(REDIRECT_URI_ERROR, 'merchant', encodeURIComponent(window.location.href));
+          key: 'getConfigs',
+          value: function getConfigs() {
+              return this.body;
           }
       }]);
-      return PaypalRunner;
-  }(PopupRunner);
+      return Builder;
+  }(HttpCore);
 
-  var REDIRECT_URI_SUCCESS$1 = '/checkout/afterpay/merchant/{{merchant}}/success';
-  var REDIRECT_URI_ERROR$1 = '/checkout/afterpay/merchant/{{merchant}}/error';
-  var CHECKOUT_URL = '/checkout/afterpay/init';
+  var CheckoutContextualHandler = function () {
+      function CheckoutContextualHandler(background, runner, eventEmitter, params) {
+          var _this = this;
 
-  var AfterpayRunner = function (_PopupRunner) {
-      inherits(AfterpayRunner, _PopupRunner);
+          classCallCheck(this, CheckoutContextualHandler);
 
-      function AfterpayRunner() {
-          classCallCheck(this, AfterpayRunner);
-          return possibleConstructorReturn(this, (AfterpayRunner.__proto__ || Object.getPrototypeOf(AfterpayRunner)).apply(this, arguments));
+          this.background = background;
+          this.runner = runner;
+          this.eventEmitter = eventEmitter;
+          this.params = params;
+          this.runner.onStop(function () {
+              _this.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.CLOSE);
+          });
       }
 
-      createClass(AfterpayRunner, [{
-          key: "getSuccessRedirectUri",
-          value: function getSuccessRedirectUri() {
-              return this.widgetEnv.getConf().url + REDIRECT_URI_SUCCESS$1.replace('{{merchant}}', encodeURIComponent(window.btoa(window.location.href)));
-          }
-      }, {
-          key: "getErrorRedirectUri",
-          value: function getErrorRedirectUri() {
-              return this.widgetEnv.getConf().url + REDIRECT_URI_ERROR$1.replace('{{merchant}}', encodeURIComponent(window.btoa(window.location.href)));
-          }
-      }, {
-          key: "next",
-          value: function next(checkoutData, params) {
-              this.checkout = checkoutData;
-              if (!Browser.isSupportPopUp()) window.localStorage.setItem('paydock_checkout_token', JSON.stringify(this.checkout));
-              this.popup.redirect(this.getRedirectUrl(params));
+      createClass(CheckoutContextualHandler, [{
+          key: 'init',
+          value: function init(env) {
+              var _this2 = this;
+
+              this.setEnv(env);
+              this.runner.onCheckout(RUNNER_EVENT.SUCCESS, function (checkout) {
+                  _this2.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.ACCEPTED, {});
+                  _this2.background.initLoader();
+                  _this2.runner.stop();
+                  _this2.checkToken(checkout.token, function () {
+                      _this2.createOneTimeToken(checkout.token);
+                  });
+              });
+              this.runner.onCheckout(RUNNER_EVENT.ERROR, function () {
+                  _this2.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.ERROR);
+                  console.error(CHECKOUT_BTN_LOG_PREFIX + ' Error from checkout server.');
+                  _this2.runner.stop();
+              });
+              this.runner.onCheckout(RUNNER_EVENT.REFERRED, function () {
+                  _this2.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.REFERRED);
+                  _this2.runner.stop();
+              });
+              this.runner.onCheckout(RUNNER_EVENT.DECLINED, function () {
+                  _this2.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.DECLINED);
+                  _this2.runner.stop();
+              });
+              this.eventEmitter.subscribe(CHECKOUT_BUTTON_EVENT.ERROR, function () {
+                  _this2.runner.stop();
+              });
+              this.eventEmitter.subscribe(CHECKOUT_BUTTON_EVENT.FINISH, function (data) {
+                  _this2.background.clear();
+              });
           }
       }, {
-          key: "error",
-          value: function error(_error, code, callback) {
-              if (!code || code && code !== 'invalid_amount') return callback(true);
-              this.popup.initError(_error);
-              return callback(false);
+          key: 'setEnv',
+          value: function setEnv(env) {
+              this.env = env;
           }
       }, {
-          key: "run",
-          value: function run() {
-              if (this.isRunning()) return;
-              this.popup.setConfigs({
-                  width: 420,
-                  height: 715
+          key: 'checkToken',
+          value: function checkToken(token, cb) {
+              var _this3 = this;
+
+              var checker = new Checker(token);
+              checker.setEnv(this.env);
+              checker.send(this.params.accessToken, function (details) {
+                  _this3.details = details;
+                  cb();
+              }, function () {
+                  _this3.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.ERROR, {});
+                  console.error(CHECKOUT_BTN_LOG_PREFIX + ' Error during creating payment source token.');
               });
-              this.popup.init();
-              this.background.initControl();
           }
       }, {
-          key: "getRedirectUrl",
-          value: function getRedirectUrl(params) {
-              return this.widgetEnv.getConf().url + CHECKOUT_URL + '?' + Url.serialize(_extends(_extends({}, params), { token: this.checkout.reference_id, env: this.checkout.mode === 'live' ? 'live' : 'test' }));
+          key: 'createOneTimeToken',
+          value: function createOneTimeToken(token) {
+              var _this4 = this;
+
+              var paymentSourceToken = new Builder$1(this.params.gatewayId, token, TYPE.CHECKOUT_TOKEN);
+              paymentSourceToken.setEnv(this.env);
+              paymentSourceToken.send(this.params.accessToken, function (token) {
+                  _this4.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.FINISH, {
+                      payment_source_token: token,
+                      checkout_email: _this4.details.checkout_email,
+                      checkout_holder: _this4.details.checkout_holder,
+                      gateway_type: _this4.details.gateway_type
+                  });
+              }, function () {
+                  _this4.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.ERROR, {});
+                  console.error(CHECKOUT_BTN_LOG_PREFIX + ' Error during creating payment source token.');
+              });
           }
       }]);
-      return AfterpayRunner;
-  }(PopupRunner);
+      return CheckoutContextualHandler;
+  }();
 
-  /**
-   *
-   * @type {object}
-   * @param {string} CLICK=click
-   * @param {string} POPUP_REDIRECT=popup_redirect
-   * @param {string} ERROR=error
-   * @param {string} ACCEPTED=accepted
-   * @param {string} FINISH=finish
-   * @param {string} CLOSE=close
-   */
-  var CHECKOUT_BUTTON_EVENT = {
-      CLICK: 'click',
-      POPUP_REDIRECT: 'popupRedirect',
-      ERROR: 'error',
-      REFERRED: 'referred',
-      DECLINED: 'declined',
-      CANCELLED: 'cancelled',
-      ACCEPTED: 'accepted',
-      FINISH: 'finish',
-      CLOSE: 'close'
-  };
   /**
    * Class CheckoutButton transform usual button into checkout
    *
@@ -4542,138 +4813,75 @@
    * @param {string} [gatewayId=default] - PayDock's gatewayId. By default or if put 'default', it will use the selected default gateway
    * @param {string} [type=PaypalClassic] - Type of gateway (PaypalClassic, Zipmoney)
    * @example
-   * var widget = new CheckoutButton('#button', 'aceessToken','gatewayId');
+   * var widget = new CheckoutButton('#button', 'accessToken','gatewayId');
    **/
   var CheckoutButton = function () {
-      function CheckoutButton(selector, aceessToken) {
-          var _this = this;
-
+      function CheckoutButton(selector, accessToken) {
           var gatewayId = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'default';
           var gatewayType = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : GATEWAY_TYPE.PAYPAL;
+          var mode = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : CHECKOUT_MODE.CONTEXTUAL;
           classCallCheck(this, CheckoutButton);
 
-          this.aceessToken = aceessToken;
+          this.accessToken = accessToken;
           this.gatewayId = gatewayId;
           this.gatewayType = gatewayType;
-          this.details = null;
+          this.mode = mode;
+          this.window = window;
           this.meta = {};
           this.env = DEFAULT_ENV;
           this.eventEmitter = new EventEmitter();
           this.container = new Container(selector);
-          this.background = new Background();
-          switch (gatewayType) {
-              case GATEWAY_TYPE.PAYPAL:
-                  this.runner = new PaypalRunner(aceessToken);
-                  break;
-              case GATEWAY_TYPE.AFTERPAY:
-                  this.runner = new AfterpayRunner(aceessToken);
-                  break;
-              case GATEWAY_TYPE.ZIPMONEY:
-                  this.runner = new ZipmoneyRunner(aceessToken);
-                  break;
-          }
-          this.initCheckout();
-          this.initCheckoutHandlers();
-          this.runner.onStop(function () {
-              _this.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.CLOSE, {});
-          });
+          this.initCheckout(this.container);
+          this.chooseRunner(gatewayType, mode);
       }
 
       createClass(CheckoutButton, [{
-          key: "buildAdditionalParams",
+          key: 'chooseRunner',
+          value: function chooseRunner(gatewayType, mode) {
+              var Runner = this.getRunnerByMode(gatewayType, mode);
+              this.runner = new Runner(this.accessToken);
+              if (isContextualRunner(this.runner)) {
+                  this.background = new Background();
+                  this.checkoutHandler = new CheckoutContextualHandler(this.background, this.runner, this.eventEmitter, { accessToken: this.accessToken, gatewayId: this.gatewayId });
+                  this.checkoutHandler.init(this.env);
+              } else {
+                  this.background = undefined;
+                  this.checkoutHandler = undefined;
+              }
+          }
+      }, {
+          key: 'buildAdditionalParams',
           value: function buildAdditionalParams() {
               return {};
           }
       }, {
-          key: "initCheckout",
-          value: function initCheckout() {
-              var _this2 = this;
+          key: 'initCheckout',
+          value: function initCheckout(container) {
+              var _this = this;
 
-              this.container.on('click', function (event) {
-                  if (_this2.runner.isRunning()) return;
-                  _this2.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.CLICK, {});
-                  _this2.runner.run();
-                  var externalCheckout = new Builder(_this2.gatewayId, _this2.runner.getSuccessRedirectUri(), _this2.runner.getErrorRedirectUri());
-                  externalCheckout.setMeta(_this2.meta);
-                  externalCheckout.setEnv(_this2.env);
-                  externalCheckout.send(_this2.aceessToken, function (checkout) {
-                      _this2.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.POPUP_REDIRECT, {});
-                      _this2.runner.next(checkout, _this2.buildAdditionalParams());
+              container.on('click', function (event) {
+                  if (isContextualRunner(_this.runner)) {
+                      if (_this.runner.isRunning()) return;else _this.runner.run();
+                  } else if (isRedirectRunner(_this.runner)) {
+                      if (!_this.runner.getRedirectUrl()) throw Error(CHECKOUT_BTN_LOG_PREFIX + ' The merchant redirect URL should is required in the \'' + _this.mode + '\' mode.');
+                  }
+                  _this.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.CLICK);
+                  var externalCheckout = new Builder(_this.gatewayId, _this.runner.getSuccessRedirectUri(), _this.runner.getErrorRedirectUri());
+                  externalCheckout.setMeta(_this.meta);
+                  externalCheckout.setEnv(_this.env);
+                  externalCheckout.send(_this.accessToken, function (checkout) {
+                      var buttonEvent = isContextualRunner(_this.runner) ? CHECKOUT_BUTTON_EVENT.POPUP_REDIRECT : CHECKOUT_BUTTON_EVENT.REDIRECT;
+                      _this.eventEmitter.emit(buttonEvent);
+                      _this.runner.next(checkout, _this.buildAdditionalParams());
                   }, function (error, code) {
-                      _this2.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.ERROR, {});
-                      _this2.runner.error(error, code, function (close) {
-                          if (close) _this2.close();
+                      console.error(CHECKOUT_BTN_LOG_PREFIX + ' ' + error);
+                      _this.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.ERROR, { error: error, code: code });
+                      _this.runner.error(error, code, function (close) {
+                          if (close) _this.close();
                       });
                   });
               });
           }
-      }, {
-          key: "initCheckoutHandlers",
-          value: function initCheckoutHandlers() {
-              var _this3 = this;
-
-              this.runner.onCheckout(EVENT$1.SUCCESS, function (checkout) {
-                  _this3.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.ACCEPTED, {});
-                  _this3.background.initLoader();
-                  _this3.close();
-                  _this3.checkToken(checkout.token, function () {
-                      _this3.createOneTimeToken(checkout.token);
-                  });
-              });
-              this.runner.onCheckout(EVENT$1.ERROR, function () {
-                  _this3.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.ERROR, {});
-                  console.error('Error from checkout server');
-                  _this3.close();
-              });
-              this.runner.onCheckout(EVENT$1.REFERRED, function () {
-                  _this3.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.REFERRED, {});
-                  _this3.close();
-              });
-              this.runner.onCheckout(EVENT$1.DECLINED, function () {
-                  _this3.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.DECLINED, {});
-                  _this3.close();
-              });
-              this.eventEmitter.subscribe(CHECKOUT_BUTTON_EVENT.ERROR, function () {
-                  _this3.background.clear();
-              });
-              this.eventEmitter.subscribe(CHECKOUT_BUTTON_EVENT.FINISH, function () {
-                  _this3.background.clear();
-              });
-          }
-      }, {
-          key: "checkToken",
-          value: function checkToken(token, cb) {
-              var _this4 = this;
-
-              var checker = new Checker(token);
-              checker.setEnv(this.env);
-              checker.send(this.aceessToken, function (details) {
-                  _this4.details = details;
-                  cb();
-              }, function () {
-                  _this4.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.ERROR, {});
-                  console.error('Error during creating payment source token');
-              });
-          }
-      }, {
-          key: "createOneTimeToken",
-          value: function createOneTimeToken(token) {
-              var _this5 = this;
-
-              var paymentSourceToken = new Builder$1(this.gatewayId, token, TYPE.CHECKOUT_TOKEN);
-              paymentSourceToken.setEnv(this.env);
-              paymentSourceToken.send(this.aceessToken, function (token) {
-                  _this5.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.FINISH, {
-                      payment_source_token: token,
-                      checkout_email: _this5.details.checkout_email,
-                      checkout_holder: _this5.details.checkout_holder,
-                      gateway_type: _this5.details.gateway_type
-                  });
-              }, function () {
-                  _this5.eventEmitter.emit(CHECKOUT_BUTTON_EVENT.ERROR, {});
-                  console.error('Error during creating payment source token');
-              });
-          }
           /**
            * This callback will be called for each event in payment source widget
            *
@@ -4692,18 +4900,20 @@
            */
 
       }, {
-          key: "on",
+          key: 'on',
           value: function on(name, handler) {
               this.eventEmitter.subscribe(name, handler);
           }
           /**
-           * Close popup window forcibly
+           * Close popup window forcibly.
+           * Only for 'contextual' mode.
+           *
            */
 
       }, {
-          key: "close",
+          key: 'close',
           value: function close() {
-              this.runner.stop();
+              if (this.assertMethodSupport(this.runner, CHECKOUT_MODE.CONTEXTUAL)) this.runner.stop();
           }
           /**
            * After finish event of checkout button, data (dataType) will be insert to input (selector)
@@ -4713,7 +4923,7 @@
            */
 
       }, {
-          key: "onFinishInsert",
+          key: 'onFinishInsert',
           value: function onFinishInsert(selector, dataType) {
               this.on(CHECKOUT_BUTTON_EVENT.FINISH, function (event) {
                   Event.insertToInput(selector, dataType, event);
@@ -4733,12 +4943,13 @@
            */
 
       }, {
-          key: "setMeta",
+          key: 'setMeta',
           value: function setMeta(meta) {
               this.meta = _extends(this.meta, meta);
           }
           /**
-           * Method for setting backdrop description
+           * Method for setting backdrop description.
+           * Only for 'contextual' mode.
            *
            * @example
            * button.setBackdropDescription('Custom description');
@@ -4747,12 +4958,13 @@
            */
 
       }, {
-          key: "setBackdropDescription",
+          key: 'setBackdropDescription',
           value: function setBackdropDescription(text) {
-              this.runner.setBackgroundDescription(text);
+              if (this.assertMethodSupport(this.runner, CHECKOUT_MODE.CONTEXTUAL)) this.runner.setBackgroundDescription(text);
           }
           /**
-           * Method for setting backdrop title
+           * Method for setting backdrop title.
+           * Only for 'contextual' mode.
            *
            * @example
            * button.setBackdropTitle('Custom title');
@@ -4761,24 +4973,43 @@
            */
 
       }, {
-          key: "setBackdropTitle",
+          key: 'setBackdropTitle',
           value: function setBackdropTitle(text) {
-              this.runner.setBackgroundTitle(text);
+              if (this.assertMethodSupport(this.runner, CHECKOUT_MODE.CONTEXTUAL)) this.runner.setBackgroundTitle(text);
           }
           /**
-           * Method for setting suspended redirect uri. Redirect after referred checkout
-           *
+           * Method for setting suspended redirect uri. Redirect after referred checkout.
+           * Only for 'contextual' mode.
            *
            * @param {uri} string - uri for redirect (by default)
            */
 
       }, {
-          key: "setSuspendedRedirectUri",
+          key: 'setSuspendedRedirectUri',
           value: function setSuspendedRedirectUri(uri) {
-              this.runner.setCustomRedirectUri(uri);
+              if (this.assertMethodSupport(this.runner, CHECKOUT_MODE.CONTEXTUAL)) this.runner.setSuspendedRedirectUri(uri);
+          }
+          /**
+           * Method for setting the merchant redirect URL.
+           * Merchant's customers redirect after successfull checkout.
+           * Only for 'redirect' mode.
+           *
+           * @param {url} string - redirect url
+           */
+
+      }, {
+          key: 'setRedirectUrl',
+          value: function setRedirectUrl(url) {
+              if (this.assertMethodSupport(this.runner, CHECKOUT_MODE.REDIRECT)) this.runner.setRedirectUrl(url);
+          }
+      }, {
+          key: 'getSuccessRedirectUri',
+          value: function getSuccessRedirectUri() {
+              return this.runner.getSuccessRedirectUri();
           }
           /**
            * Method for disable backdrop on the page.
+           * Only for 'contextual' mode.
            *
            * @example
            * button.turnOffBackdrop();
@@ -4786,32 +5017,65 @@
            */
 
       }, {
-          key: "turnOffBackdrop",
+          key: 'turnOffBackdrop',
           value: function turnOffBackdrop() {
               this.turnOffControlBackdrop();
               this.turnOffLoaderBackdrop();
           }
       }, {
-          key: "turnOffControlBackdrop",
+          key: 'turnOffControlBackdrop',
           value: function turnOffControlBackdrop() {
-              this.runner.turnOffBackdrop();
+              if (this.assertMethodSupport(this.runner, CHECKOUT_MODE.CONTEXTUAL)) this.runner.turnOffBackdrop();
           }
       }, {
-          key: "turnOffLoaderBackdrop",
+          key: 'turnOffLoaderBackdrop',
           value: function turnOffLoaderBackdrop() {
-              this.background.turnOffLoader();
+              var _a;
+              (_a = this.background) === null || _a === void 0 ? void 0 : _a.turnOffLoader();
           }
       }, {
-          key: "setEnv",
+          key: 'setEnv',
           value: function setEnv(env, alias) {
+              var _a;
               this.env = env;
+              this.alias = alias;
+              (_a = this.checkoutHandler) === null || _a === void 0 ? void 0 : _a.setEnv(env);
               this.runner.setEnv(env, alias);
           }
       }, {
-          key: "getEnv",
+          key: 'getEnv',
           value: function getEnv() {
               return this.env;
           }
+      }, {
+          key: 'getRunnerByMode',
+          value: function getRunnerByMode(gatewayType, mode) {
+              if (gatewayType === GATEWAY_TYPE.PAYPAL) {
+                  if (mode === CHECKOUT_MODE.REDIRECT) throw Error(CHECKOUT_BTN_LOG_PREFIX + ' Gateway \'' + gatewayType + '\' do not support \'' + mode + '\' mode');
+                  return PaypalRunner;
+              } else if (gatewayType === GATEWAY_TYPE.AFTERPAY) {
+                  if (mode === CHECKOUT_MODE.REDIRECT) throw Error(CHECKOUT_BTN_LOG_PREFIX + ' Gateway \'' + gatewayType + '\' do not support \'' + mode + '\' mode');
+                  return AfterpayRunner;
+              } else if (gatewayType === GATEWAY_TYPE.ZIPMONEY) {
+                  return mode === CHECKOUT_MODE.CONTEXTUAL ? ZipmoneyContextualRunner : ZipmoneyRedirectRunner;
+              } else {
+                  throw Error(CHECKOUT_BTN_LOG_PREFIX + ' Unsupported gateway.');
+              }
+          }
+      }, {
+          key: 'assertMethodSupport',
+          value: function assertMethodSupport(runner, mode) {
+              var warnMessage = CHECKOUT_BTN_LOG_PREFIX + ' The method is not supported in the \'' + mode + '\' mode.';
+              switch (mode) {
+                  case CHECKOUT_MODE.CONTEXTUAL:
+                      if (isContextualRunner(runner)) return true;else console.warn(warnMessage);
+                      break;
+                  case CHECKOUT_MODE.REDIRECT:
+                      if (isRedirectRunner(runner)) return true;else console.warn(warnMessage);
+                      break;
+              }
+              return false;
+          }
       }]);
       return CheckoutButton;
   }();
@@ -4826,6 +5090,7 @@
    * @param {string} selector - Selector of html element.
    * @param {string} publicKey - PayDock users public key
    * @param {string} [gatewayId=default] - PayDock's gatewayId. By default or if put 'default', it will use the selected default gateway
+   * @param {string} [gatewayId=default] - Checkout mode, it could be set to 'contextual' or 'redirect'. By default it 'contextual'
    * @example
    * var widget = new ZipmoneyCheckoutButton('#button', 'publicKey','gatewayId');
    **/
@@ -4834,12 +5099,14 @@
 
       function ZipmoneyCheckoutButton(selector, publicKey) {
           var gatewayId = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'default';
+          var mode = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : CHECKOUT_MODE.CONTEXTUAL;
           classCallCheck(this, ZipmoneyCheckoutButton);
 
-          var _this = possibleConstructorReturn(this, (ZipmoneyCheckoutButton.__proto__ || Object.getPrototypeOf(ZipmoneyCheckoutButton)).call(this, selector, publicKey, gatewayId, GATEWAY_TYPE.ZIPMONEY));
+          var _this = possibleConstructorReturn(this, (ZipmoneyCheckoutButton.__proto__ || Object.getPrototypeOf(ZipmoneyCheckoutButton)).call(this, selector, publicKey, gatewayId, GATEWAY_TYPE.ZIPMONEY, mode));
 
           _this.publicKey = publicKey;
           _this.gatewayId = gatewayId;
+          _this.mode = mode;
           return _this;
       }
       /**
@@ -4849,14 +5116,42 @@
        * This can be provided, even if using in-context checkout (sdk). By default, the standard styled page will be used.
        * If using in-context (sdk) we will not automatically redirect to this URI.
        *
-        * @param {uri} string - uri for redirect (by default)
+        * @param {uri} string - uri for suspended redirect (by default)
        */
 
 
       createClass(ZipmoneyCheckoutButton, [{
-          key: "setSuspendedRedirectUri",
+          key: 'setSuspendedRedirectUri',
           value: function setSuspendedRedirectUri(uri) {
-              get(ZipmoneyCheckoutButton.prototype.__proto__ || Object.getPrototypeOf(ZipmoneyCheckoutButton.prototype), "setSuspendedRedirectUri", this).call(this, uri);
+              get(ZipmoneyCheckoutButton.prototype.__proto__ || Object.getPrototypeOf(ZipmoneyCheckoutButton.prototype), 'setSuspendedRedirectUri', this).call(this, uri);
+          }
+          /**
+           * Method for setting the merchant redirect URL.
+           * The merchant's customers would be redirected to the specified URL
+           * at the end of ZipMoney checkout flow.
+           *
+           * Once the redirect URL would be set, the checkout flow would be immediately switched
+           * from 'contextual' mode to the 'redirect' mode.
+           * The merchant's customer would be automatically redirected to this URL after the checkout is complete.
+           *
+           * @param {url} string - URL for redirect
+           */
+
+      }, {
+          key: 'setRedirectUrl',
+          value: function setRedirectUrl(url) {
+              if (isContextualRunner(this.runner)) {
+                  get(ZipmoneyCheckoutButton.prototype.__proto__ || Object.getPrototypeOf(ZipmoneyCheckoutButton.prototype), 'chooseRunner', this).call(this, GATEWAY_TYPE.ZIPMONEY, CHECKOUT_MODE.REDIRECT);
+                  get(ZipmoneyCheckoutButton.prototype.__proto__ || Object.getPrototypeOf(ZipmoneyCheckoutButton.prototype), 'setEnv', this).call(this, this.env, this.alias);
+              }
+              get(ZipmoneyCheckoutButton.prototype.__proto__ || Object.getPrototypeOf(ZipmoneyCheckoutButton.prototype), 'setRedirectUrl', this).call(this, url);
+          }
+      }, {
+          key: 'buildAdditionalParams',
+          value: function buildAdditionalParams() {
+              var defaultParams = get(ZipmoneyCheckoutButton.prototype.__proto__ || Object.getPrototypeOf(ZipmoneyCheckoutButton.prototype), 'buildAdditionalParams', this).call(this);
+              var params = _extends(_extends({}, defaultParams), { public_key: this.publicKey, gateway_id: this.gatewayId });
+              return params;
           }
       }]);
       return ZipmoneyCheckoutButton;
@@ -4902,7 +5197,7 @@
 
 
       createClass(AfterpayCheckoutButton, [{
-          key: "showEnhancedTrackingProtectionPopup",
+          key: 'showEnhancedTrackingProtectionPopup',
           value: function showEnhancedTrackingProtectionPopup(doShow) {
               var _Browser$getBrowserIn = Browser.getBrowserInfo(),
                   name = _Browser$getBrowserIn.name,
@@ -4911,9 +5206,9 @@
               if (doShow && name === 'Firefox' && +version >= 100) this.showETP = true;
           }
       }, {
-          key: "buildAdditionalParams",
+          key: 'buildAdditionalParams',
           value: function buildAdditionalParams() {
-              var params = get(AfterpayCheckoutButton.prototype.__proto__ || Object.getPrototypeOf(AfterpayCheckoutButton.prototype), "buildAdditionalParams", this).call(this);
+              var params = get(AfterpayCheckoutButton.prototype.__proto__ || Object.getPrototypeOf(AfterpayCheckoutButton.prototype), 'buildAdditionalParams', this).call(this);
               if (this.showETP) {
                   params.show_etp = true;
               }
@@ -6531,6 +6826,124 @@
       return ApiInternal;
   }(ApiBase);
 
+  var AfterPayWalletService = function (_WalletService) {
+      inherits(AfterPayWalletService, _WalletService);
+
+      function AfterPayWalletService(token, meta) {
+          classCallCheck(this, AfterPayWalletService);
+          return possibleConstructorReturn(this, (AfterPayWalletService.__proto__ || Object.getPrototypeOf(AfterPayWalletService)).call(this, token, meta));
+      }
+
+      createClass(AfterPayWalletService, [{
+          key: 'load',
+          value: function load(container) {
+              this.mount(container);
+          }
+      }, {
+          key: 'mount',
+          value: function mount(container) {
+              var _this2 = this;
+
+              var _a, _b, _c, _d;
+              var customStyles = {};
+              if (((_a = this.meta) === null || _a === void 0 ? void 0 : _a.style) && _typeof((_b = this.meta) === null || _b === void 0 ? void 0 : _b.style) === 'object') customStyles = JSON.parse(JSON.stringify(((_c = this.meta) === null || _c === void 0 ? void 0 : _c.style['afterpay']) || ((_d = this.meta) === null || _d === void 0 ? void 0 : _d.style)));
+              var afterpayButton = this.getButton(customStyles);
+              afterpayButton.onclick = function () {
+                  return _this2.onAfterPayButtonClicked();
+              };
+              var buttonWalletStyle = this.getButtonStyle(customStyles);
+              container.getElement().appendChild(afterpayButton);
+              container.getElement().appendChild(buttonWalletStyle);
+          }
+      }, {
+          key: 'onAfterPayButtonClicked',
+          value: function onAfterPayButtonClicked() {
+              var _this3 = this;
+
+              return new Promise(function () {
+                  var _a, _b;
+                  var afterpayJS = document.createElement('script');
+                  var countryCode = (_a = _this3.meta) === null || _a === void 0 ? void 0 : _a.country;
+                  afterpayJS.type = 'text/javascript';
+                  afterpayJS.src = ((_b = _this3.meta) === null || _b === void 0 ? void 0 : _b.gateway_mode) === 'live' ? 'https://portal.afterpay.com/afterpay.js' : 'https://portal.sandbox.afterpay.com/afterpay.js';
+                  afterpayJS.async = true;
+                  afterpayJS.defer = true;
+                  afterpayJS.onload = function () {
+                      window.AfterPay.initialize({ countryCode: countryCode });
+                      _this3.getCheckoutSession().then(function (response) {
+                          window.AfterPay.redirect({
+                              token: response.ref_token
+                          });
+                      }).catch(function (err) {
+                          window.AfterPay.close();
+                          _this3.eventEmitter.emit(WALLET_EVENT.UNAVAILABLE, {
+                              err: err
+                          });
+                      });
+                  };
+                  document.head.appendChild(afterpayJS);
+              });
+          }
+      }, {
+          key: 'getCheckoutSession',
+          value: function getCheckoutSession() {
+              var _this4 = this;
+
+              return new Promise(function (resolve, reject) {
+                  return _this4.eventEmitter.emit(WALLET_EVENT.CALLBACK, {
+                      data: {
+                          request_type: 'CREATE_SESSION',
+                          wallet_type: WALLET_TYPE.AFTERPAY
+                      },
+                      onSuccess: function onSuccess(res) {
+                          resolve(res);
+                      },
+                      onError: function onError(message) {
+                          reject(message);
+                      }
+                  });
+              });
+          }
+      }, {
+          key: 'getButton',
+          value: function getButton(customStyles) {
+              var afterpayButton = document.createElement('button');
+              afterpayButton.classList.add("afterpay-checkout-btn");
+              afterpayButton.setAttribute('type', 'button');
+              afterpayButton.innerHTML = '\n            <div class="afterpay-checkout-btn__wrapper">\n                <svg viewBox="0 0 390 94"\n                    height="' + this.getHeight(customStyles) + '"\n                    xmlns="http://www.w3.org/2000/svg">\n                    <g fill="currentColor">\n                        <path\n                            d="M388.6 21.4l-34.8 71.8h-14.4l13-26.8-20.5-45h14.8l13.2 30.1 14.3-30.1zM41 46.9c0-8.6-6.2-14.6-13.9-14.6s-13.9 6.1-13.9 14.6c0 8.4 6.2 14.6 13.9 14.6 7.6 0 13.9-6.1 13.9-14.6m.1 25.5v-6.6c-3.8 4.6-9.4 7.4-16.1 7.4C11 73.2.4 62 .4 46.9c0-15 11-26.4 24.9-26.4 6.5 0 12 2.9 15.8 7.3v-6.4h12.5v51H41.1zM114.6 61.1c-4.4 0-5.6-1.6-5.6-5.9V32.5h8.1V21.4H109V8.9H96.1v12.4H79.5v-5.1c0-4.3 1.6-5.9 6.1-5.9h2.8V.4h-6.2C71.6.4 66.6 3.9 66.6 14.5v6.8h-7.1v11.1h7.1v39.9h12.9V32.5h16.6v25c0 10.4 4 14.9 14.4 14.9h6.6V61.1h-2.5zM160.7 42.3c-.9-6.6-6.3-10.6-12.6-10.6s-11.5 3.9-12.9 10.6h25.5zm-25.6 7.9c.9 7.5 6.3 11.8 13.2 11.8 5.4 0 9.6-2.6 12-6.6h13.2c-3.1 10.8-12.7 17.7-25.5 17.7-15.4 0-26.2-10.8-26.2-26.2 0-15.4 11.4-26.5 26.5-26.5 15.2 0 26.2 11.2 26.2 26.5 0 1.1-.1 2.2-.3 3.3h-39.1zM256.2 46.9c0-8.3-6.2-14.6-13.9-14.6s-13.9 6.1-13.9 14.6c0 8.4 6.2 14.6 13.9 14.6 7.6 0 13.9-6.4 13.9-14.6m-40.4 46.3V21.4h12.5V28c3.8-4.7 9.4-7.5 16.1-7.5 13.8 0 24.6 11.3 24.6 26.3s-11 26.4-24.9 26.4c-6.4 0-11.7-2.6-15.4-6.8v26.8h-12.9zM314.2 46.9c0-8.6-6.2-14.6-13.9-14.6-7.6 0-13.9 6.1-13.9 14.6 0 8.4 6.2 14.6 13.9 14.6s13.9-6.1 13.9-14.6m.1 25.5v-6.6c-3.8 4.6-9.4 7.4-16.1 7.4-14 0-24.6-11.2-24.6-26.3 0-15 11-26.4 24.9-26.4 6.5 0 12 2.9 15.8 7.3v-6.4h12.5v51h-12.5zM193.2 26.4s3.2-5.9 11-5.9c3.3 0 5.5 1.2 5.5 1.2v13s-4.7-2.9-9.1-2.3c-4.3.6-7.1 4.6-7.1 9.9v30.2h-13v-51H193v4.9h.2z" />\n                    </g>\n                </svg>\n                <svg viewBox="0 0 107 96"\n                    height="' + this.getHeight(customStyles) + '"\n                    xmlns="http://www.w3.org/2000/svg">\n                    <path\n                        d="M99 19.5L84.2 11l-15-8.6c-10-5.7-22.4 1.5-22.4 13v1.9c0 1.1.6 2 1.5 2.6l7 4c1.9 1.1 4.4-.3 4.4-2.5v-4.6c0-2.3 2.5-3.7 4.4-2.6l13.8 7.9L91.6 30c2 1.1 2 4 0 5.1L77.9 43l-13.8 7.9c-2 1.1-4.4-.3-4.4-2.6V46c0-11.5-12.4-18.7-22.4-13l-15 8.6-14.8 8.5c-10 5.7-10 20.2 0 26l14.8 8.5 15 8.6c10 5.7 22.4-1.5 22.4-13v-1.9c0-1.1-.6-2-1.5-2.6l-7-4c-1.9-1.1-4.4.3-4.4 2.5v4.6c0 2.3-2.5 3.7-4.4 2.6l-13.8-7.9-13.7-7.9c-2-1.1-2-4 0-5.1l13.7-7.9 13.8-7.9c2-1.1 4.4.3 4.4 2.6v2.3c0 11.5 12.4 18.7 22.4 13l15-8.6L99 45.5c10.1-5.8 10.1-20.2 0-26"\n                        fill="currentColor" />\n                </svg>\n            </div>\n        ';
+              return afterpayButton;
+          }
+      }, {
+          key: 'getButtonStyle',
+          value: function getButtonStyle(customStyles) {
+              var styleSheet = document.createElement('style');
+              var buttonColor = this.generateButtonColor(customStyles.button_type);
+              styleSheet.innerText = '\n            .afterpay-checkout-btn {\n                outline: none;\n                border: none;\n                border-radius: ' + this.getHeight(customStyles) + ';\n                padding: 0;\n                margin: 0;\n                transition: all 300ms;\n                cursor: pointer;\n            }\n\n            .afterpay-checkout-btn:active {\n                opacity: 0.7;\n            }\n\n            .afterpay-checkout-btn__wrapper {\n                display: flex;\n                align-items: center;\n                padding: 10px 20px;\n                color: ' + buttonColor.color + ';\n                background-color: ' + buttonColor.background + ';\n                border-radius: ' + this.getHeight(customStyles) + ';\n            }\n        ';
+              return styleSheet;
+          }
+      }, {
+          key: 'generateButtonColor',
+          value: function generateButtonColor(button_type) {
+              switch (button_type) {
+                  case 'black':
+                      return { color: '#B2FCE3', background: '#000' };
+                  case 'mint':
+                      return { color: '#000', background: '#B2FCE3' };
+                  default:
+                      return { color: '#fff', background: '#000' };
+              }
+          }
+      }, {
+          key: 'getHeight',
+          value: function getHeight(customStyles) {
+              if (!customStyles.height) return '40px';
+              if (Number.isNaN(Number(customStyles.height))) return customStyles.height;
+              return customStyles.height + 'px';
+          }
+      }]);
+      return AfterPayWalletService;
+  }(WalletService);
+
   /**
    * List of available event's name in the wallet button lifecycle
    * @const EVENT
@@ -6541,7 +6954,7 @@
    * @param {string} PAYMENT_SUCCESSFUL=paymentSuccessful
    * @param {string} PAYMENT_ERROR=paymentError
    */
-  var EVENT$2 = {
+  var EVENT$1 = {
       UNAVAILABLE: "unavailable",
       UPDATE: "update",
       PAYMENT_SUCCESSFUL: "paymentSuccessful",
@@ -6553,19 +6966,22 @@
    * @interface IWalletMeta
    *
    * @type {object}
-   * @param {string} [amount_label] Label shown next to the total amount to be paid. Required for [Stripe, ApplePay, GooglePay]. N/A for [FlyPay, PayPal].
-   * @param {string} [country] Country of the user. 2 letter ISO code format. Required for [Stripe, ApplePay, GooglePay]. N/A for [FlyPay, PayPal].
+   * @param {string} [amount_label] Label shown next to the total amount to be paid. Required for [Stripe, ApplePay, GooglePay]. N/A for [FlyPay, PayPal, Afterpay].
+   * @param {string} [country] Country of the user. 2 letter ISO code format. Required for [Stripe, ApplePay, GooglePay, Afterpay]. N/A for [FlyPay, PayPal].
    * @param {string} [pay_later] Used to enable Pay Later feature in PayPal Smart Checkout WalletButton integration when available. Optional for [PayPal]. N/A for other wallets.
    * @param {boolean} [show_billing_address] Used to hide/show the billing address on ApplePay and GooglePay popups. Default value is false. Optional for [ApplePay, GooglePay]. N/A for other wallets.
    * @param {boolean} [request_payer_name] Used mainly for fraud purposes - recommended set to true. Optional for [Stripe]. N/A for other wallets.
    * @param {boolean} [request_payer_email] Used mainly for fraud purposes - recommended set to true. Optional for [Stripe]. N/A for other wallets.
    * @param {boolean} [request_payer_phone] Used mainly for fraud purposes - recommended set to true. Optional for [Stripe]. N/A for other wallets.
-   * @param {boolean} [request_shipping] Used to request or not shipping address in the Wallet checkout, being able to handle amount changes via the `update` event. Optional for [FlyPay, PayPal, ApplePay, GooglePay]. N/A for [Stripe].
+   * @param {boolean} [request_shipping] Used to request or not shipping address in the Wallet checkout, being able to handle amount changes via the `update` event. Optional for [FlyPay, PayPal, ApplePay, GooglePay]. N/A for [Stripe, Afterpay].
    * @param {IApplePayShippingOption[] | IPayPalShippingOption[]} [shipping_options] Used to provide available shipping options.(To use shipping_options the request_shipping flag should be true). Optional for [ApplePay]. N/A for the other wallets.
    * @param {string} [merchant_name] Merchant Name used for GooglePay integration via MPGS. Required for [GooglePay]. N/A for other wallets.
    * @param {object} [raw_data_initialization] Used to provide values to initialize wallet with raw data. Optional for [ApplePay]. N/A for the other wallets.
-   * @param {object} [style] Used to style PayPal buttons, check possible values at https://developer.paypal.com/docs/business/checkout/reference/style-guide. Also used at ApplePay to select button type. Optional for [PayPal, ApplePay]. N/A for [Stripe, FlyPay].
-   * @param {object} [style.button_type] Used to select ApplePay button type (e.g: 'buy','donate', etc), check possible values at https://developer.apple.com/documentation/apple_pay_on_the_web/displaying_apple_pay_buttons_using_css. Optional for [ApplePay]. N/A for other wallets.
+   * @param {object} [style] Used to style PayPal buttons, check possible values at https://developer.paypal.com/docs/business/checkout/reference/style-guide. Also used at ApplePay, GooglePay and Afterpay to select button type.
+   * Optional for [PayPal, ApplePay, GooglePay, Afterpay]. N/A for [Stripe, FlyPay].
+   * @param {object} [style.button_type] Used to select ApplePay button type (e.g: 'buy','donate', etc), check possible values at https://developer.apple.com/documentation/apple_pay_on_the_web/displaying_apple_pay_buttons_using_css.
+   * Also select button type for GooglePay (check GooglePayStyles) and Afterpay (check AfterpayStyles). Optional for [ApplePay, GooglePay, Afterpay]. N/A for other wallets.
+   * @param {object} [style.height] Used to select Afterpay button height. Optional for [Afterpay]. N/A for other wallets.
    * @param {array} [wallets] By default if this is not sent or empty, we will try to show either Apple Pay or Google Pay buttons. This can be limited sending the following array in this field: ['apple','google]. Optional for [Stripe, ApplePay, GooglePay]. N/A for other wallets.
    */
   /**
@@ -6635,6 +7051,9 @@
               case WALLET_GATEWAY.MASTERCARD:
                   this.service = new MastercardWalletService('', _extends(_extends({}, meta), { credentials: tokenMeta.gateway.credentials, amount: tokenMeta.charge.amount, currency: tokenMeta.charge.currency, gateway_mode: tokenMeta.gateway.mode }));
                   break;
+              case WALLET_GATEWAY.AFTERPAY:
+                  this.service = new AfterPayWalletService(chargeToken, _extends(_extends({}, meta), { id: tokenMeta.charge.id, gateway_mode: tokenMeta.gateway.mode, amount: tokenMeta.charge.amount, currency: tokenMeta.charge.currency, reference: tokenMeta.charge.reference }));
+                  break;
           }
       }
       /**
@@ -6661,7 +7080,7 @@
                   this.setupServiceCallbacks();
                   this.service.load(this.container);
               } catch (err) {
-                  this.eventEmitter.emit(EVENT$2.UNAVAILABLE, null);
+                  this.eventEmitter.emit(EVENT$1.UNAVAILABLE, null);
                   throw err;
               }
           }
@@ -6781,7 +7200,7 @@
           value: function on(eventName, cb) {
               var _this = this;
 
-              if (eventName === EVENT$2.UPDATE) this.hasUpdateHandler = true;
+              if (eventName === EVENT$1.UPDATE) this.hasUpdateHandler = true;
               if (typeof cb === 'function') return this.eventEmitter.subscribe(eventName, cb);
               return new Promise(function (resolve) {
                   return _this.eventEmitter.subscribe(eventName, function (res) {
@@ -6813,9 +7232,9 @@
           value: function onUnavailable(handler) {
               var _this2 = this;
 
-              if (typeof handler === 'function') return this.eventEmitter.subscribe(EVENT$2.UNAVAILABLE, handler);
+              if (typeof handler === 'function') return this.eventEmitter.subscribe(EVENT$1.UNAVAILABLE, handler);
               return new Promise(function (resolve) {
-                  return _this2.eventEmitter.subscribe(EVENT$2.UNAVAILABLE, function () {
+                  return _this2.eventEmitter.subscribe(EVENT$1.UNAVAILABLE, function () {
                       return resolve();
                   });
               });
@@ -6842,9 +7261,9 @@
               var _this3 = this;
 
               this.hasUpdateHandler = true;
-              if (typeof handler === 'function') return this.eventEmitter.subscribe(EVENT$2.UPDATE, handler);
+              if (typeof handler === 'function') return this.eventEmitter.subscribe(EVENT$1.UPDATE, handler);
               return new Promise(function (resolve) {
-                  return _this3.eventEmitter.subscribe(EVENT$2.UPDATE, function (data) {
+                  return _this3.eventEmitter.subscribe(EVENT$1.UPDATE, function (data) {
                       return resolve(data);
                   });
               });
@@ -6869,9 +7288,9 @@
           value: function onPaymentSuccessful(handler) {
               var _this4 = this;
 
-              if (typeof handler === 'function') return this.eventEmitter.subscribe(EVENT$2.PAYMENT_SUCCESSFUL, handler);
+              if (typeof handler === 'function') return this.eventEmitter.subscribe(EVENT$1.PAYMENT_SUCCESSFUL, handler);
               return new Promise(function (resolve) {
-                  return _this4.eventEmitter.subscribe(EVENT$2.PAYMENT_SUCCESSFUL, function (data) {
+                  return _this4.eventEmitter.subscribe(EVENT$1.PAYMENT_SUCCESSFUL, function (data) {
                       return resolve(data);
                   });
               });
@@ -6896,9 +7315,9 @@
           value: function onPaymentInReview(handler) {
               var _this5 = this;
 
-              if (typeof handler === 'function') return this.eventEmitter.subscribe(EVENT$2.PAYMENT_IN_REVIEW, handler);
+              if (typeof handler === 'function') return this.eventEmitter.subscribe(EVENT$1.PAYMENT_IN_REVIEW, handler);
               return new Promise(function (resolve) {
-                  return _this5.eventEmitter.subscribe(EVENT$2.PAYMENT_IN_REVIEW, function (data) {
+                  return _this5.eventEmitter.subscribe(EVENT$1.PAYMENT_IN_REVIEW, function (data) {
                       return resolve(data);
                   });
               });
@@ -6923,9 +7342,9 @@
           value: function onPaymentError(handler) {
               var _this6 = this;
 
-              if (typeof handler === 'function') return this.eventEmitter.subscribe(EVENT$2.PAYMENT_ERROR, handler);
+              if (typeof handler === 'function') return this.eventEmitter.subscribe(EVENT$1.PAYMENT_ERROR, handler);
               return new Promise(function (resolve) {
-                  return _this6.eventEmitter.subscribe(EVENT$2.PAYMENT_ERROR, function (err) {
+                  return _this6.eventEmitter.subscribe(EVENT$1.PAYMENT_ERROR, function (err) {
                       return resolve(err);
                   });
               });
@@ -6947,7 +7366,7 @@
               var _this7 = this;
 
               this.service.on(WALLET_EVENT.UNAVAILABLE, function (eventData) {
-                  return _this7.eventEmitter.emit(EVENT$2.UNAVAILABLE, { event: EVENT$2.UNAVAILABLE, data: eventData });
+                  return _this7.eventEmitter.emit(EVENT$1.UNAVAILABLE, { event: EVENT$1.UNAVAILABLE, data: eventData });
               });
           }
       }, {
@@ -6956,7 +7375,7 @@
               var _this8 = this;
 
               this.service.on(WALLET_EVENT.UPDATE, function (eventData) {
-                  return _this8.hasUpdateHandler ? _this8.eventEmitter.emit(EVENT$2.UPDATE, { event: EVENT$2.UPDATE, data: eventData }) : _this8.update({ success: true });
+                  return _this8.hasUpdateHandler ? _this8.eventEmitter.emit(EVENT$1.UPDATE, { event: EVENT$1.UPDATE, data: eventData }) : _this8.update({ success: true });
               });
           }
       }, {
@@ -6988,7 +7407,7 @@
 
                   _this10.api.charge().walletCapture(data).then(function (captureResult) {
                       if (typeof onSuccess === 'function') onSuccess();
-                      var event = captureResult.status === 'inreview' ? EVENT$2.PAYMENT_IN_REVIEW : EVENT$2.PAYMENT_SUCCESSFUL;
+                      var event = captureResult.status === 'inreview' ? EVENT$1.PAYMENT_IN_REVIEW : EVENT$1.PAYMENT_SUCCESSFUL;
                       _this10.eventEmitter.emit(event, {
                           event: event,
                           data: _extends(_extends({}, captureResult), data.customer && {
@@ -6999,7 +7418,7 @@
                       });
                   }, function (err) {
                       if (typeof onError === 'function') onError(err);
-                      _this10.eventEmitter.emit(EVENT$2.PAYMENT_ERROR, { event: EVENT$2.PAYMENT_ERROR, data: err });
+                      _this10.eventEmitter.emit(EVENT$1.PAYMENT_ERROR, { event: EVENT$1.PAYMENT_ERROR, data: err });
                   });
               });
           }
@@ -7009,7 +7428,7 @@
               var _this11 = this;
 
               this.service.on(WALLET_EVENT.PAYMENT_SUCCESS, function (eventData) {
-                  return _this11.eventEmitter.emit(EVENT$2.PAYMENT_SUCCESSFUL, { event: EVENT$2.PAYMENT_SUCCESSFUL, data: eventData });
+                  return _this11.eventEmitter.emit(EVENT$1.PAYMENT_SUCCESSFUL, { event: EVENT$1.PAYMENT_SUCCESSFUL, data: eventData });
               });
           }
       }, {
@@ -7018,7 +7437,7 @@
               var _this12 = this;
 
               this.service.on(WALLET_EVENT.PAYMENT_IN_REVIEW, function (eventData) {
-                  return _this12.eventEmitter.emit(EVENT$2.PAYMENT_IN_REVIEW, { event: EVENT$2.PAYMENT_IN_REVIEW, data: eventData });
+                  return _this12.eventEmitter.emit(EVENT$1.PAYMENT_IN_REVIEW, { event: EVENT$1.PAYMENT_IN_REVIEW, data: eventData });
               });
           }
       }, {
@@ -7027,7 +7446,7 @@
               var _this13 = this;
 
               this.service.on(WALLET_EVENT.PAYMENT_ERROR, function (eventData) {
-                  return _this13.eventEmitter.emit(EVENT$2.PAYMENT_ERROR, { event: EVENT$2.PAYMENT_ERROR, data: eventData });
+                  return _this13.eventEmitter.emit(EVENT$1.PAYMENT_ERROR, { event: EVENT$1.PAYMENT_ERROR, data: eventData });
               });
           }
       }]);
@@ -7446,18 +7865,24 @@
           value: function initializeIFrames(initializationUrl, secondaryUrl, title) {
               var hideAuthorization = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : true;
 
+              var container = this.container.getElement();
+              if (!container) return;
               var divAuthorization = document.createElement("div");
               divAuthorization.setAttribute("id", "paydock_authorization_iframe");
-              this.container.getElement().appendChild(divAuthorization);
+              container.appendChild(divAuthorization);
               this.browserAndChallengeContainer = new Container("#paydock_authorization_iframe");
               this.iFrameAuthorization = new IFrame(this.browserAndChallengeContainer);
               this.iFrameAuthorization.load(initializationUrl, { title: title });
-              var divSecondaryURL = document.createElement("div");
-              divSecondaryURL.setAttribute("id", "paydock_secondary_iframe");
-              this.container.getElement().appendChild(divSecondaryURL);
-              this.monitoringContainer = new Container("#paydock_secondary_iframe");
-              this.iFrameSecondaryUrl = new IFrame(this.monitoringContainer);
-              this.iFrameSecondaryUrl.load(secondaryUrl, { title: title });
+              if (secondaryUrl) {
+                  var divSecondaryURL = document.createElement("div");
+                  divSecondaryURL.setAttribute("id", "paydock_secondary_iframe");
+                  container.appendChild(divSecondaryURL);
+                  this.monitoringContainer = new Container("#paydock_secondary_iframe");
+                  this.iFrameSecondaryUrl = new IFrame(this.monitoringContainer);
+                  this.iFrameSecondaryUrl.load(secondaryUrl, { title: title });
+              } else {
+                  this.iFrameSecondaryUrl = undefined;
+              }
               this.hideIframes(hideAuthorization);
           }
       }, {
@@ -7465,10 +7890,11 @@
           value: function hideIframes() {
               var hideAuthorization = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
 
+              var _a;
               for (var prop in hiddenStyle) {
                   if (!hiddenStyle.hasOwnProperty(prop)) continue;
                   if (hideAuthorization) this.iFrameAuthorization.setStyle(prop, hiddenStyle[prop]);
-                  this.iFrameSecondaryUrl.setStyle(prop, hiddenStyle[prop]);
+                  (_a = this.iFrameSecondaryUrl) === null || _a === void 0 ? void 0 : _a.setStyle(prop, hiddenStyle[prop]);
               }
           }
       }, {
@@ -7520,8 +7946,9 @@
               if (this.resultRead) return;
               this.resultRead = true;
               this.api.charge().standalone3dsHandle().then(function (result) {
+                  var _a;
                   _this2.iFrameAuthorization.remove();
-                  _this2.iFrameSecondaryUrl.remove();
+                  (_a = _this2.iFrameSecondaryUrl) === null || _a === void 0 ? void 0 : _a.remove();
                   if (result.status === PROCESS_STANDALONE_3DS_STATUS.SUCCESS) _this2.eventEmitter.emit(GPAYMENTS_EVENT.AUTH_SUCCESS, _this2.parseResultData(result, charge3dsId));else _this2.eventEmitter.emit(GPAYMENTS_EVENT.AUTH_ERROR, _this2.parseResultData(result, charge3dsId));
               }, function (err) {
                   _this2.eventEmitter.emit(GPAYMENTS_EVENT.ERROR, _this2.parseError(err, charge3dsId));
@@ -7564,18 +7991,19 @@
 
               var charge_3ds_id = _ref4.charge_3ds_id;
 
+              var _a;
               this.iFrameAuthorization.remove();
-              this.iFrameSecondaryUrl.remove();
+              (_a = this.iFrameSecondaryUrl) === null || _a === void 0 ? void 0 : _a.remove();
               this.api.charge().standalone3dsProcess({ charge_3ds_id: charge_3ds_id }).then(function (authenticationResult) {
                   var _a, _b;
                   if (authenticationResult.status === "success" /* SUCCESS */) _this4.eventEmitter.emit(GPAYMENTS_EVENT.AUTH_SUCCESS, _this4.parseHandleResponse(authenticationResult, charge_3ds_id));else if (authenticationResult.status === "pending" /* PENDING */) {
                           if ((_a = authenticationResult === null || authenticationResult === void 0 ? void 0 : authenticationResult.result) === null || _a === void 0 ? void 0 : _a.challenge) {
                               _this4.eventEmitter.emit(GPAYMENTS_EVENT.CHALLENGE, _this4.parseHandleResponse(authenticationResult, charge_3ds_id));
-                              _this4.initializeIFrames(authenticationResult.result.challenge_url, 'authenticationResult.result.secondary_url', 'Authentication Challenge', false);
-                              _this4.doPolling(authenticationResult.result.secondary_url, charge_3ds_id);
+                              _this4.initializeIFrames(authenticationResult.result.challenge_url, undefined, 'Authentication Challenge', false);
+                              if (authenticationResult.result.secondary_url) _this4.doPolling(authenticationResult.result.secondary_url, charge_3ds_id);
                           } else if ((_b = authenticationResult === null || authenticationResult === void 0 ? void 0 : authenticationResult.result) === null || _b === void 0 ? void 0 : _b.decoupled_challenge) {
                               _this4.eventEmitter.emit(GPAYMENTS_EVENT.DECOUPLED, _this4.parseHandleResponse(authenticationResult, charge_3ds_id));
-                              _this4.doPolling(authenticationResult.result.secondary_url, charge_3ds_id);
+                              if (authenticationResult.result.secondary_url) _this4.doPolling(authenticationResult.result.secondary_url, charge_3ds_id);
                           }
                       } else return _this4.eventEmitter.emit(GPAYMENTS_EVENT.AUTH_ERROR, _this4.parseHandleResponse(authenticationResult, charge_3ds_id));
               }, function (err) {
@@ -8086,7 +8514,7 @@
    * @param {string} CHECKOUT_COMPLETED=checkoutCompleted
    * @param {string} CHECKOUT_ERROR=checkoutError
    */
-  var EVENT$3;
+  var EVENT$2;
   (function (EVENT) {
       EVENT["CHECKOUT_BUTTON_LOADED"] = "checkoutButtonLoaded";
       EVENT["CHECKOUT_BUTTON_CLICKED"] = "checkoutButtonClicked";
@@ -8094,7 +8522,7 @@
       EVENT["CHECKOUT_READY"] = "checkoutReady";
       EVENT["CHECKOUT_COMPLETED"] = "checkoutCompleted";
       EVENT["CHECKOUT_ERROR"] = "checkoutError";
-  })(EVENT$3 || (EVENT$3 = {}));
+  })(EVENT$2 || (EVENT$2 = {}));
   var STYLE$2 = {
       BUTTON_TEXT_COLOR: 'button_text_color',
       PRIMARY_COLOR: 'primary_color',
@@ -8161,20 +8589,20 @@
               var _this = this;
 
               var widgetId = this.link.getParams().widget_id;
-              this.iFrameEvent.on(EVENT$3.CHECKOUT_READY, widgetId, function (_ref) {
+              this.iFrameEvent.on(EVENT$2.CHECKOUT_READY, widgetId, function (_ref) {
                   var data = _ref.data;
 
-                  _this.eventEmitter.emit(EVENT$3.CHECKOUT_READY, data);
+                  _this.eventEmitter.emit(EVENT$2.CHECKOUT_READY, data);
               });
-              this.iFrameEvent.on(EVENT$3.CHECKOUT_COMPLETED, widgetId, function (_ref2) {
+              this.iFrameEvent.on(EVENT$2.CHECKOUT_COMPLETED, widgetId, function (_ref2) {
                   var data = _ref2.data;
 
-                  _this.eventEmitter.emit(EVENT$3.CHECKOUT_COMPLETED, data);
+                  _this.eventEmitter.emit(EVENT$2.CHECKOUT_COMPLETED, data);
               });
-              this.iFrameEvent.on(EVENT$3.CHECKOUT_ERROR, widgetId, function (_ref3) {
+              this.iFrameEvent.on(EVENT$2.CHECKOUT_ERROR, widgetId, function (_ref3) {
                   var data = _ref3.data;
 
-                  _this.eventEmitter.emit(EVENT$3.CHECKOUT_ERROR, data);
+                  _this.eventEmitter.emit(EVENT$2.CHECKOUT_ERROR, data);
               });
               if (this.autoResize) this.useAutoResize(true);
           }
@@ -8202,10 +8630,10 @@
               clickToPayAllCards.setAttribute('style', VisaSRCStyles.clickToPayAllCardsStyle);
               clickToPayAllCards.src = this.link.getBaseUrl() + ('' + GenerateCardSchemesLogo((_a = this.meta.customizations) === null || _a === void 0 ? void 0 : _a.card_schemes, true));
               checkoutButton.onclick = function () {
-                  _this2.eventEmitter.emit(EVENT$3.CHECKOUT_BUTTON_CLICKED, {});
+                  _this2.eventEmitter.emit(EVENT$2.CHECKOUT_BUTTON_CLICKED, {});
                   _this2.iFrame.load(_this2.link.getUrl(), { title: 'Visa SRC checkout' });
                   _this2.iFrame.getElement().onload = function () {
-                      return _this2.eventEmitter.emit(EVENT$3.IFRAME_LOADED, {});
+                      return _this2.eventEmitter.emit(EVENT$2.IFRAME_LOADED, {});
                   };
               };
               container.appendChild(checkoutButton);
@@ -8213,7 +8641,7 @@
               footerContainer.appendChild(footerText);
               footerContainer.appendChild(clickToPayAllCards);
               this.buttonContainer.getElement().appendChild(container);
-              this.eventEmitter.emit(EVENT$3.CHECKOUT_BUTTON_LOADED, {});
+              this.eventEmitter.emit(EVENT$2.CHECKOUT_BUTTON_LOADED, {});
           }
       }, {
           key: 'getEnv',
@@ -8532,7 +8960,6 @@
   exports.Api = Api;
   exports.CHECKOUT_BUTTON_EVENT = CHECKOUT_BUTTON_EVENT;
   exports.Canvas3ds = Canvas3ds;
-  exports.CheckoutButton = CheckoutButton;
   exports.Configuration = Configuration;
   exports.ELEMENT = ELEMENT;
   exports.EVENT = EVENT;