@paystack/checkout-js 1.19.0 → 1.20.0-dev.10

package/lib/checkout.js

@@ -6407,14 +6407,16 @@ var devConfig = _objectSpread2(_objectSpread2({}, config), {}, {
   paymentBaseUrl: 'https://legacy-staging.paystack.co/',
   paystackApiUrl: 'https://studio-api.paystack.co/',
   pusherKey: '1c7b262ee18455815893',
-  pusherUrl: 'https://s3-eu-west-1.amazonaws.com/pstk-public-files/js/pusher.min.js'
+  pusherUrl: 'https://s3-eu-west-1.amazonaws.com/pstk-public-files/js/pusher.min.js',
+  savedCardsApiUrl: 'https://saved-cards-api.public.paystack.studio/'
 });
 var stagingConfig = _objectSpread2(_objectSpread2({}, config), {}, {
   checkoutUrl: 'https://checkout-studio.paystack.com/',
   paymentBaseUrl: 'https://legacy-staging.paystack.co/',
   paystackApiUrl: 'https://studio-api.paystack.co/',
   pusherKey: '1c7b262ee18455815893',
-  pusherUrl: 'https://s3-eu-west-1.amazonaws.com/pstk-public-files/js/pusher.min.js'
+  pusherUrl: 'https://s3-eu-west-1.amazonaws.com/pstk-public-files/js/pusher.min.js',
+  savedCardsApiUrl: 'https://saved-cards-api.public.paystack.studio/'
 });
 var productionConfig = _objectSpread2(_objectSpread2({}, config), {}, {
   checkoutUrl: 'https://checkout.paystack.com/',
@@ -11645,7 +11647,7 @@ var PayattitudeAPI = {
   }
 };
 
-var paymentMethod$6 = 'payattitude';
+var paymentMethod$7 = 'payattitude';
 var PayattitudeCharge = {
   chargePayattitude: function chargePayattitude(_ref) {
     var _this = this;
@@ -11656,7 +11658,7 @@ var PayattitudeCharge = {
       phoneNumber: phoneNumber
     };
     return PayattitudeAPI.charge(params).then(function (response) {
-      _this.logAPIResponse(response, paymentMethod$6);
+      _this.logAPIResponse(response, paymentMethod$7);
 
       return response;
     });
@@ -11664,7 +11666,7 @@ var PayattitudeCharge = {
   listenForPayattitudeCharge: function listenForPayattitudeCharge(callback) {
     var pusherChannel = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
     var listenerOptions = {
-      paymentMethod: paymentMethod$6,
+      paymentMethod: paymentMethod$7,
       channel: pusherChannel
     };
     return this.listenForCharge(listenerOptions, callback);
@@ -11747,7 +11749,7 @@ var ApplePayAPI = {
   }
 };
 
-var paymentMethod$5 = 'apple pay';
+var paymentMethod$6 = 'apple pay';
 var ApplePayCharge = {
   validateApplePaySession: function validateApplePaySession(_ref) {
     var _this = this;
@@ -11755,7 +11757,7 @@ var ApplePayCharge = {
     var sessionUrl = _ref.sessionUrl,
         displayName = _ref.displayName,
         domainName = _ref.domainName;
-    this.logAttempt(paymentMethod$5);
+    this.logAttempt(paymentMethod$6);
     return ApplePayAPI.validateApplePaySession({
       sessionUrl: sessionUrl,
       displayName: displayName,
@@ -11776,7 +11778,7 @@ var ApplePayCharge = {
       device: this.deviceFingerprint,
       paymentObject: paymentObject
     }).then(function (response) {
-      _this2.logAPIResponse(response, paymentMethod$5);
+      _this2.logAPIResponse(response, paymentMethod$6);
 
       return response;
     });
@@ -11832,12 +11834,12 @@ var PayPalAPI = {
   }
 };
 
-var paymentMethod$4 = 'paypal';
+var paymentMethod$5 = 'paypal';
 var PayPalCharge = {
   createPayPalOrder: function createPayPalOrder() {
     var _this = this;
 
-    this.logAttempt(paymentMethod$4);
+    this.logAttempt(paymentMethod$5);
     return PayPalAPI.createOrder(this.id).then(function (response) {
       _this.logAPIResponseMessage(response.message);
 
@@ -11848,7 +11850,7 @@ var PayPalCharge = {
     var _this2 = this;
 
     return PayPalAPI.captureOrder(this.id).then(function (response) {
-      _this2.logAPIResponse(response, paymentMethod$4);
+      _this2.logAPIResponse(response, paymentMethod$5);
 
       return response;
     });
@@ -18307,8 +18309,96 @@ cardValidator.creditCardType.addCard({
   }
 });
 cardValidator.creditCardType.changeOrder('verve', 0);
+var Card$2 = {
+  getEncryptedPin: function getEncryptedPin(pin) {
+    return pin ? encrypt(pin) : undefined;
+  },
+  getLast4: function getLast4(number) {
+    return number.substring(number.length - 4);
+  },
+  tokenize: function tokenize(_ref) {
+    var number = _ref.number,
+        cvv = _ref.cvv,
+        month = _ref.month,
+        year = _ref.year;
+    return encrypt("".concat(number, "*").concat(cvv, "*").concat(month, "*").concat(year));
+  },
+  getType: function getType(value) {
+    var response = cardValidator.number(value);
 
-var Card = /*#__PURE__*/function () {
+    if (response && response.card) {
+      return {
+        type: response.card.type,
+        maxLength: Math.max.apply(Math, _toConsumableArray(response.card.lengths)),
+        minLength: Math.min.apply(Math, _toConsumableArray(response.card.lengths))
+      };
+    }
+
+    return {
+      type: null,
+      maxLength: 0
+    };
+  },
+  validate: function validate(_ref2) {
+    var number = _ref2.number,
+        cvv = _ref2.cvv,
+        month = _ref2.month,
+        year = _ref2.year;
+
+    var _this$getType = this.getType(number),
+        cardType = _this$getType.type;
+
+    var result = {
+      number: this.isNumberValid(number),
+      expiry: this.isExpiryValid({
+        month: month,
+        year: year
+      }),
+      cvv: this.isCvvValid(cvv, cardType)
+    };
+    var isValid = Object.values(result).every(function (value) {
+      return value === true;
+    });
+    return {
+      isValid: isValid,
+      result: result
+    };
+  },
+  validateNumber: function validateNumber(value) {
+    return cardValidator.number(value);
+  },
+  isNumberValid: function isNumberValid(value) {
+    return Card$2.validateNumber(value).isValid;
+  },
+  validateCVV: function validateCVV(cvv, cardType) {
+    var isAmexCard = cardType === 'american-express';
+    var cvvLength = isAmexCard ? 4 : 3;
+    return cardValidator.cvv(cvv, cvvLength);
+  },
+  isCvvValid: function isCvvValid(cvv, cardType) {
+    return Card$2.validateCVV(cvv, cardType).isValid;
+  },
+  validateExpiry: function validateExpiry(value) {
+    if (_typeof$1(value) === 'object') {
+      var month = value.month,
+          year = value.year;
+      return cardValidator.expirationMonth(month) && cardValidator.expirationYear(year);
+    }
+
+    return cardValidator.expirationDate(value);
+  },
+  isExpiryValid: function isExpiryValid(value) {
+    return Card$2.validateExpiry(value).isValid;
+  },
+  findTestCard: function findTestCard(cardType) {
+    var type = cardType || 'default';
+    return testCards.find(function (card) {
+      return card.type === type;
+    });
+  }
+};
+
+var Card$1 = /*#__PURE__*/function () {
   function Card(_ref) {
     var number = _ref.number,
         cvv = _ref.cvv,
@@ -18328,35 +18418,27 @@ var Card = /*#__PURE__*/function () {
   _createClass(Card, [{
     key: "getEncryptedPin",
     value: function getEncryptedPin() {
-      return this.pin ? encrypt(this.pin) : undefined;
+      return Card$2.getEncryptedPin(this.pin);
     }
   }, {
     key: "getLast4",
     value: function getLast4() {
-      return this.number.substring(this.number.length - 4);
+      return Card$2.getLast4(this.number);
     }
   }, {
     key: "tokenize",
     value: function tokenize() {
-      return encrypt("".concat(this.number, "*").concat(this.cvv, "*").concat(this.month, "*").concat(this.year));
+      return Card$2.tokenize({
+        number: this.number,
+        cvv: this.cvv,
+        month: this.month,
+        year: this.year
+      });
     }
   }], [{
     key: "getType",
     value: function getType(value) {
-      var response = cardValidator.number(value);
-
-      if (response && response.card) {
-        return {
-          type: response.card.type,
-          maxLength: Math.max.apply(Math, _toConsumableArray(response.card.lengths)),
-          minLength: Math.min.apply(Math, _toConsumableArray(response.card.lengths))
-        };
-      }
-
-      return {
-        type: null,
-        maxLength: 0
-      };
+      return Card$2.getType(value);
     }
   }, {
     key: "validate",
@@ -18365,79 +18447,54 @@ var Card = /*#__PURE__*/function () {
           cvv = _ref2.cvv,
           month = _ref2.month,
           year = _ref2.year;
-
-      var _Card$getType = Card.getType(number),
-          cardType = _Card$getType.type;
-
-      var result = {
-        number: Card.isNumberValid(number),
-        expiry: Card.isExpiryValid({
-          month: month,
-          year: year
-        }),
-        cvv: Card.isCvvValid(cvv, cardType)
-      };
-      var isValid = Object.values(result).every(function (value) {
-        return value === true;
+      return Card$2.validate({
+        number: number,
+        cvv: cvv,
+        month: month,
+        year: year
       });
-      return {
-        isValid: isValid,
-        result: result
-      };
     }
   }, {
     key: "validateNumber",
     value: function validateNumber(value) {
-      return cardValidator.number(value);
+      return Card$2.validateNumber(value);
     }
   }, {
     key: "isNumberValid",
     value: function isNumberValid(value) {
-      return Card.validateNumber(value).isValid;
+      return Card$2.isNumberValid(value);
     }
   }, {
     key: "validateCVV",
     value: function validateCVV(cvv, cardType) {
-      var isAmexCard = cardType === 'american-express';
-      var cvvLength = isAmexCard ? 4 : 3;
-      return cardValidator.cvv(cvv, cvvLength);
+      return Card$2.validateCVV(cvv, cardType);
     }
   }, {
     key: "isCvvValid",
     value: function isCvvValid(cvv, cardType) {
-      return Card.validateCVV(cvv, cardType).isValid;
+      return Card$2.isCvvValid(cvv, cardType);
     }
   }, {
     key: "validateExpiry",
     value: function validateExpiry(value) {
-      if (_typeof$1(value) === 'object') {
-        var month = value.month,
-            year = value.year;
-        return cardValidator.expirationMonth(month) && cardValidator.expirationYear(year);
-      }
-
-      return cardValidator.expirationDate(value);
+      return Card$2.validateExpiry(value);
     }
   }, {
     key: "isExpiryValid",
     value: function isExpiryValid(value) {
-      return Card.validateExpiry(value).isValid;
+      return Card$2.isExpiryValid(value);
     }
   }, {
     key: "generateTestCard",
     value: function generateTestCard(cardType) {
-      var type = cardType || 'default';
-      var cardParams = testCards.find(function (card) {
-        return card.type === type;
-      });
-      return new Card(cardParams);
+      return new Card(Card$2.findTestCard(cardType));
     }
   }]);
 
   return Card;
 }();
 
-var CardAPI = {
+var CardAPI$1 = {
   charge: function charge(_ref) {
     var clientdata = _ref.clientdata,
         last4 = _ref.last4,
@@ -18613,14 +18670,216 @@ var CardAPI = {
     }).then(function (response) {
       return ChargeResponses.parse(response.data);
     });
+  },
+  sendSavedCardsOTP: function sendSavedCardsOTP(email) {
+    return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+      var url, language, headers, _yield$axiosInstance$, data;
+
+      return regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              url = new URL("/authorize", configToUse.savedCardsApiUrl).toString();
+              language = getLanguage();
+              headers = _objectSpread2({}, language && {
+                'Accept-Language': language
+              });
+              _context.next = 5;
+              return axiosInstance.post(url, {
+                email: email
+              }, {
+                headers: headers
+              });
+
+            case 5:
+              _yield$axiosInstance$ = _context.sent;
+              data = _yield$axiosInstance$.data;
+              return _context.abrupt("return", data);
+
+            case 8:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    }))();
+  },
+  addUserToSavedCards: function addUserToSavedCards(_ref6) {
+    return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
+      var phone, email, url, language, headers, data, response;
+      return regeneratorRuntime.wrap(function _callee2$(_context2) {
+        while (1) {
+          switch (_context2.prev = _context2.next) {
+            case 0:
+              phone = _ref6.phone, email = _ref6.email;
+              url = new URL('/user', configToUse.savedCardsApiUrl).toString();
+              language = getLanguage();
+              headers = _objectSpread2({}, language && {
+                'Accept-Language': language
+              });
+              data = {
+                phone: phone,
+                email: email
+              };
+              _context2.next = 7;
+              return axiosInstance.post(url, data, {
+                headers: headers
+              });
+
+            case 7:
+              response = _context2.sent;
+              return _context2.abrupt("return", response.data);
+
+            case 9:
+            case "end":
+              return _context2.stop();
+          }
+        }
+      }, _callee2);
+    }))();
+  },
+  verifySavedCardsOtp: function verifySavedCardsOtp(_ref7) {
+    return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3() {
+      var code, transaction, url, language, headers, data, response;
+      return regeneratorRuntime.wrap(function _callee3$(_context3) {
+        while (1) {
+          switch (_context3.prev = _context3.next) {
+            case 0:
+              code = _ref7.code, transaction = _ref7.transaction;
+              url = new URL('/authorize/verify', configToUse.savedCardsApiUrl).toString();
+              language = getLanguage();
+              headers = _objectSpread2({}, language && {
+                'Accept-Language': language
+              });
+              data = {
+                code: code,
+                transaction: transaction
+              };
+              _context3.next = 7;
+              return axiosInstance.post(url, data, {
+                headers: headers
+              });
+
+            case 7:
+              response = _context3.sent;
+              return _context3.abrupt("return", response.data);
+
+            case 9:
+            case "end":
+              return _context3.stop();
+          }
+        }
+      }, _callee3);
+    }))();
+  },
+  getSavedCards: function getSavedCards(_ref8) {
+    return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee4() {
+      var token, url, language, headers, response;
+      return regeneratorRuntime.wrap(function _callee4$(_context4) {
+        while (1) {
+          switch (_context4.prev = _context4.next) {
+            case 0:
+              token = _ref8.token;
+              url = new URL('/cards', configToUse.savedCardsApiUrl).toString();
+              language = getLanguage();
+              headers = _objectSpread2({
+                Authorization: "Bearer ".concat(token),
+                'jwt-auth': true
+              }, language && {
+                'Accept-Language': language
+              });
+              _context4.next = 6;
+              return axiosInstance.get(url, {
+                headers: headers
+              });
+
+            case 6:
+              response = _context4.sent;
+              return _context4.abrupt("return", response.data);
+
+            case 8:
+            case "end":
+              return _context4.stop();
+          }
+        }
+      }, _callee4);
+    }))();
+  },
+  deleteSavedCard: function deleteSavedCard(_ref9) {
+    return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee5() {
+      var cardCode, token, url, language, headers, response;
+      return regeneratorRuntime.wrap(function _callee5$(_context5) {
+        while (1) {
+          switch (_context5.prev = _context5.next) {
+            case 0:
+              cardCode = _ref9.cardCode, token = _ref9.token;
+              url = new URL("/cards/".concat(cardCode), configToUse.savedCardsApiUrl).toString();
+              language = getLanguage();
+              headers = _objectSpread2({
+                Authorization: "Bearer ".concat(token),
+                'jwt-auth': true
+              }, language && {
+                'Accept-Language': language
+              });
+              _context5.next = 6;
+              return axiosInstance.delete(url, {
+                headers: headers
+              });
+
+            case 6:
+              response = _context5.sent;
+              return _context5.abrupt("return", response.data);
+
+            case 8:
+            case "end":
+              return _context5.stop();
+          }
+        }
+      }, _callee5);
+    }))();
+  },
+  chargeSavedCard: function chargeSavedCard(_ref10) {
+    return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee6() {
+      var token, device, cardCode, transaction, selectedCurrency, url, language, headers, data;
+      return regeneratorRuntime.wrap(function _callee6$(_context6) {
+        while (1) {
+          switch (_context6.prev = _context6.next) {
+            case 0:
+              token = _ref10.token, device = _ref10.device, cardCode = _ref10.cardCode, transaction = _ref10.transaction, selectedCurrency = _ref10.selectedCurrency;
+              url = new URL("/cards/".concat(cardCode, "/charge"), configToUse.savedCardsApiUrl).toString();
+              language = getLanguage();
+              headers = _objectSpread2({
+                Authorization: "Bearer ".concat(token),
+                'jwt-auth': true
+              }, language && {
+                'Accept-Language': language
+              });
+              data = {
+                device: device,
+                transaction: transaction,
+                selectedCurrency: selectedCurrency
+              };
+              return _context6.abrupt("return", axiosInstance.post(url, data, {
+                headers: headers
+              }).then(function (response) {
+                return ChargeResponses.parse(response.data);
+              }));
+
+            case 6:
+            case "end":
+              return _context6.stop();
+          }
+        }
+      }, _callee6);
+    }))();
   }
 };
 
-var paymentMethod$3 = 'card';
+var paymentMethod$4 = 'card';
 
-function validate$3(card, isSetter) {
+function validate$4(card, isSetter) {
   return new Promise(function (resolve, reject) {
-    var validation = Card.validate(card);
+    var validation = Card$1.validate(card);
 
     if (!validation.isValid) {
       var throwValidation = isSetter || card.number;
@@ -18639,8 +18898,8 @@ var CardCharge = {
   setCard: function setCard(params) {
     var _this = this;
 
-    return validate$3(params, true).then(function () {
-      _this.card = new Card(params);
+    return validate$4(params, true).then(function () {
+      _this.card = new Card$1(params);
     });
   },
   rememberCard: function rememberCard() {
@@ -18655,8 +18914,8 @@ var CardCharge = {
       return this.chargeCardWithPin(customFields);
     }
 
-    return validate$3(this.card).then(function () {
-      _this2.logAttempt(paymentMethod$3);
+    return validate$4(this.card).then(function () {
+      _this2.logAttempt(paymentMethod$4);
 
       var chargeParams = {
         clientdata: _this2.card.tokenize(),
@@ -18669,8 +18928,8 @@ var CardCharge = {
         subscription: _this2.subscription,
         customFields: customFields
       };
-      return CardAPI.charge(chargeParams).then(function (response) {
-        _this2.logAPIResponse(response, paymentMethod$3);
+      return CardAPI$1.charge(chargeParams).then(function (response) {
+        _this2.logAPIResponse(response, paymentMethod$4);
 
         return response;
       });
@@ -18685,7 +18944,7 @@ var CardCharge = {
     var _this3 = this;
 
     var customFields = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-    this.logAttempt(paymentMethod$3);
+    this.logAttempt(paymentMethod$4);
     var chargeParams = {
       pin: encrypt(this.card.pin),
       trans: this.id,
@@ -18695,8 +18954,8 @@ var CardCharge = {
       subscription: this.subscription,
       customFields: customFields
     };
-    return CardAPI.charge(chargeParams).then(function (response) {
-      _this3.logAPIResponse(response, paymentMethod$3);
+    return CardAPI$1.charge(chargeParams).then(function (response) {
+      _this3.logAPIResponse(response, paymentMethod$4);
 
       return response;
     });
@@ -18708,7 +18967,7 @@ var CardCharge = {
         authorizationCode = _ref.authorizationCode,
         cardLast4 = _ref.cardLast4,
         pin = _ref.pin;
-    this.logAttempt(paymentMethod$3);
+    this.logAttempt(paymentMethod$4);
     var encryptedPin = encrypt(pin);
     var chargeParams = {
       authorizationCode: authorizationCode,
@@ -18720,8 +18979,8 @@ var CardCharge = {
       transactionType: this.transactionType,
       subscription: this.subscription
     };
-    return CardAPI.chargeRememberedCard(chargeParams).then(function (response) {
-      _this4.logAPIResponse(response, paymentMethod$3);
+    return CardAPI$1.chargeRememberedCard(chargeParams).then(function (response) {
+      _this4.logAPIResponse(response, paymentMethod$4);
 
       return response;
     });
@@ -18739,8 +18998,8 @@ var CardCharge = {
       device: this.deviceFingerprint
     });
 
-    return CardAPI.resumeCardCharge(params).then(function (response) {
-      _this5.logAPIResponse(response, paymentMethod$3);
+    return CardAPI$1.resumeCardCharge(params).then(function (response) {
+      _this5.logAPIResponse(response, paymentMethod$4);
 
       return response;
     });
@@ -18752,8 +19011,8 @@ var CardCharge = {
       authorizationId: authorizationId,
       publicKey: this.merchant.key
     };
-    return CardAPI.forgetRememberedCard(params).then(function (response) {
-      _this6.logAPIResponse(response, paymentMethod$3);
+    return CardAPI$1.forgetRememberedCard(params).then(function (response) {
+      _this6.logAPIResponse(response, paymentMethod$4);
 
       return response;
     });
@@ -18761,8 +19020,8 @@ var CardCharge = {
   authenticateCard: function authenticateCard(token) {
     var _this7 = this;
 
-    return CardAPI.authenticate(this.id, token).then(function (response) {
-      _this7.logAPIResponse(response, paymentMethod$3);
+    return CardAPI$1.authenticate(this.id, token).then(function (response) {
+      _this7.logAPIResponse(response, paymentMethod$4);
 
       return response;
     });
@@ -18781,8 +19040,8 @@ var CardCharge = {
       zipCode: zipCode,
       transactionId: this.id
     };
-    return CardAPI.verifyAddress(payload).then(function (response) {
-      _this8.logAPIResponse(response, paymentMethod$3);
+    return CardAPI$1.verifyAddress(payload).then(function (response) {
+      _this8.logAPIResponse(response, paymentMethod$4);
 
       return response;
     });
@@ -18790,9 +19049,77 @@ var CardCharge = {
   listenFor3DSCharge: function listenFor3DSCharge(callback) {
     var listenerOptions = {
       channel: "3DS_".concat(this.id),
-      paymentMethod: paymentMethod$3
+      paymentMethod: paymentMethod$4
     };
     return this.listenForCharge(listenerOptions, callback);
+  },
+  sendSavedCardsOTP: function sendSavedCardsOTP() {
+    return CardAPI$1.sendSavedCardsOTP(this.email);
+  },
+  addUserToSavedCards: function addUserToSavedCards(_ref4) {
+    var phone = _ref4.phone;
+    return CardAPI$1.addUserToSavedCards({
+      phone: phone,
+      email: this.email
+    });
+  },
+  verifySavedCardsOtp: function verifySavedCardsOtp(_ref5) {
+    var _this9 = this;
+
+    return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+      var code, payload, response;
+      return regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              code = _ref5.code;
+              payload = {
+                code: code,
+                transaction: _this9.id
+              };
+              _context.prev = 2;
+              _context.next = 5;
+              return CardAPI$1.verifySavedCardsOtp(payload);
+
+            case 5:
+              response = _context.sent;
+              _this9.savedCardsToken = response.data.token;
+              return _context.abrupt("return", response);
+
+            case 10:
+              _context.prev = 10;
+              _context.t0 = _context["catch"](2);
+              _this9.savedCardsToken = null;
+              throw _context.t0;
+
+            case 14:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee, null, [[2, 10]]);
+    }))();
+  },
+  getSavedCards: function getSavedCards() {
+    return CardAPI$1.getSavedCards({
+      token: this.savedCardsToken
+    });
+  },
+  deleteSavedCard: function deleteSavedCard(cardCode) {
+    return CardAPI$1.deleteSavedCard({
+      cardCode: cardCode,
+      token: this.savedCardsToken
+    });
+  },
+  chargeSavedCard: function chargeSavedCard(_ref6) {
+    var cardCode = _ref6.cardCode;
+    return CardAPI$1.chargeSavedCard({
+      cardCode: cardCode,
+      transaction: this.id,
+      token: this.savedCardsToken,
+      device: this.deviceFingerprint,
+      selectedCurrency: this.currency
+    });
   }
 };
 
@@ -18945,9 +19272,9 @@ var EMandateAPI = {
   }
 };
 
-var paymentMethod$2 = 'bank account';
+var paymentMethod$3 = 'bank account';
 
-function validate$2(bankAccount, isSetter) {
+function validate$3(bankAccount, isSetter) {
   return new Promise(function (resolve, reject) {
     var validation = BankAccount.validate(bankAccount);
 
@@ -18965,15 +19292,15 @@ var EMandate = {
   setBankAccount: function setBankAccount(params) {
     var _this = this;
 
-    return validate$2(params, true).then(function () {
+    return validate$3(params, true).then(function () {
       _this.bankAccount = new BankAccount(params);
     });
   },
   chargeBankAccount: function chargeBankAccount() {
     var _this2 = this;
 
-    return validate$2(this.bankAccount).then(function () {
-      _this2.logAttempt(paymentMethod$2);
+    return validate$3(this.bankAccount).then(function () {
+      _this2.logAttempt(paymentMethod$3);
 
       var verifyParams = {
         bankId: _this2.bankAccount.bankId,
@@ -18982,7 +19309,7 @@ var EMandate = {
         device: _this2.deviceFingerprint
       };
       return EMandateAPI.verify(verifyParams).then(function (response) {
-        _this2.logAPIResponse(response, paymentMethod$2);
+        _this2.logAPIResponse(response, paymentMethod$3);
 
         return response;
       });
@@ -18991,7 +19318,7 @@ var EMandate = {
   registerBankAccount: function registerBankAccount(birthday) {
     var _this3 = this;
 
-    return validate$2(this.bankAccount).then(function () {
+    return validate$3(this.bankAccount).then(function () {
       var registerParams = {
         bankId: _this3.bankAccount.bankId,
         transactionId: _this3.id,
@@ -18999,7 +19326,7 @@ var EMandate = {
         birthday: birthday
       };
       return EMandateAPI.register(registerParams).then(function (response) {
-        _this3.logAPIResponse(response, paymentMethod$2);
+        _this3.logAPIResponse(response, paymentMethod$3);
 
         return response;
       });
@@ -19008,7 +19335,7 @@ var EMandate = {
   authenticateBankAccount: function authenticateBankAccount(token) {
     var _this4 = this;
 
-    return validate$2(this.bankAccount).then(function () {
+    return validate$3(this.bankAccount).then(function () {
       var chargeParams = {
         bankId: _this4.bankAccount.bankId,
         transactionId: _this4.id,
@@ -19016,7 +19343,7 @@ var EMandate = {
         device: _this4.deviceFingerprint
       };
       return EMandateAPI.authenticate(chargeParams).then(function (response) {
-        _this4.logAPIResponse(response, paymentMethod$2);
+        _this4.logAPIResponse(response, paymentMethod$3);
 
         return response;
       });
@@ -19077,7 +19404,7 @@ var DigitalBankMandateAPI = {
   }
 };
 
-var paymentMethod$1 = 'bank';
+var paymentMethod$2 = 'bank';
 var DigitalBankMandate = {
   chargeDigitalBankMandate: function chargeDigitalBankMandate(_ref) {
     var _this = this;
@@ -19092,7 +19419,7 @@ var DigitalBankMandate = {
       bankId: bankId
     };
     return DigitalBankMandateAPI.charge(params).then(function (response) {
-      _this.logAPIResponse(response, paymentMethod$1);
+      _this.logAPIResponse(response, paymentMethod$2);
 
       return response;
     });
@@ -19100,7 +19427,7 @@ var DigitalBankMandate = {
   listenForDigitalBankMandateCharge: function listenForDigitalBankMandateCharge(callback) {
     var pusherChannel = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
     var listenerOptions = {
-      paymentMethod: paymentMethod$1,
+      paymentMethod: paymentMethod$2,
       channel: pusherChannel
     };
     return this.listenForCharge(listenerOptions, callback);
@@ -19233,7 +19560,7 @@ var QrAPI = {
   }
 };
 
-function validate$1(channel) {
+function validate$2(channel) {
   return new Promise(function (resolve, reject) {
     var allowedChannels = ['visa', 'MPASS_OLTI'];
 
@@ -19251,7 +19578,7 @@ var QRCharge = {
     var _this = this;
 
     var channel = _ref.channel;
-    return validate$1(channel).then(function () {
+    return validate$2(channel).then(function () {
       if (_this.qr[channel]) {
         return _this.qr[channel];
       }
@@ -19273,7 +19600,7 @@ var QRCharge = {
     var _this2 = this;
 
     var channel = _ref2.channel;
-    return validate$1(channel).then(function () {
+    return validate$2(channel).then(function () {
       if (!_this2.qr[channel]) {
         return Promise.reject(Error('Please generate qr code with Transaction.getQRCode()'));
       }
@@ -19394,7 +19721,7 @@ var MobileMoneyAPI = {
   }
 };
 
-function validate(phoneNumber) {
+function validate$1(phoneNumber) {
   return new Promise(function (resolve, reject) {
     var validation = PhoneNumber.validate(phoneNumber);
 
@@ -19415,7 +19742,7 @@ var MobileMoneyCharge = {
         provider = _ref.provider,
         voucher = _ref.voucher,
         registrationToken = _ref.registrationToken;
-    return validate(phoneNumber).then(function () {
+    return validate$1(phoneNumber).then(function () {
       _this.logAttempt('mobile money');
 
       var params = {
@@ -19446,7 +19773,7 @@ var MobileMoneyCharge = {
     var phoneNumber = payload.phoneNumber,
         provider = payload.provider,
         registrationToken = payload.registrationToken;
-    return validate(phoneNumber).then(function () {
+    return validate$1(phoneNumber).then(function () {
       _this2.logMobileMoneyActions(payload);
 
       var params = {
@@ -19586,7 +19913,7 @@ var DirectDebitAPI = {
   }
 };
 
-var paymentMethod = 'direct debit';
+var paymentMethod$1 = 'direct debit';
 var DirectDebitCharge = {
   loginToDirectDebitAccount: function loginToDirectDebitAccount(_ref) {
     var _this = this;
@@ -19632,14 +19959,14 @@ var DirectDebitCharge = {
       return Promise.reject(Error('Please login with Transaction.loginToDirectDebitAccount() to start a Direct debit charge'));
     }
 
-    this.logAttempt(paymentMethod);
+    this.logAttempt(paymentMethod$1);
     var params = {
       account_code: accountCode,
       transaction: this.id,
       token: this.directDebit.token
     };
     return DirectDebitAPI.charge(params).then(function (response) {
-      _this2.logAPIResponse(response, paymentMethod);
+      _this2.logAPIResponse(response, paymentMethod$1);
 
       if (response.status) {
         _this2.directDebit.chargeResponse = response;
@@ -19652,7 +19979,7 @@ var DirectDebitCharge = {
     var _this3 = this;
 
     return DirectDebitAPI.getProvisionedAccounts(this.directDebit.token).then(function (response) {
-      _this3.logAPIResponse(response, paymentMethod);
+      _this3.logAPIResponse(response, paymentMethod$1);
 
       var status = response.status,
           data = response.data;
@@ -19677,7 +20004,7 @@ var DirectDebitCharge = {
       token: this.directDebit.token
     };
     return DirectDebitAPI.authenticate(params).then(function (response) {
-      _this4.logAPIResponse(response, paymentMethod);
+      _this4.logAPIResponse(response, paymentMethod$1);
 
       return response;
     });
@@ -20121,6 +20448,8 @@ var TransactionInstance = /*#__PURE__*/function () {
     this.subscription = data.subscription || null;
     this.planDetails = data.plan_details || null;
     this.exchangeRate = data.exchange_rate || null;
+    this.savedCardsConfig = data.saved_cards || {};
+    this.savedCardsToken = null;
     /**
      * We initialize parameters we send to the API as empty strings
      * when we don't have them instead of null because the API expects
@@ -20461,10 +20790,194 @@ var Toolkit = /*#__PURE__*/function () {
   return Toolkit;
 }();
 
+var Card = /*#__PURE__*/function () {
+  function Card(_ref) {
+    var number = _ref.number,
+        cvv = _ref.cvv,
+        month = _ref.month,
+        year = _ref.year,
+        pin = _ref.pin;
+
+    _classCallCheck(this, Card);
+
+    this.number = number;
+    this.cvv = cvv;
+    this.month = month;
+    this.year = year;
+    this.pin = pin;
+  }
+
+  _createClass(Card, [{
+    key: "getEncryptedPin",
+    value: function getEncryptedPin() {
+      return Card$2.getEncryptedPin(this.pin);
+    }
+  }, {
+    key: "getLast4",
+    value: function getLast4() {
+      return Card$2.getLast4(this.number);
+    }
+  }, {
+    key: "tokenize",
+    value: function tokenize() {
+      return Card$2.tokenize({
+        number: this.number,
+        cvv: this.cvv,
+        month: this.month,
+        year: this.year
+      });
+    }
+  }], [{
+    key: "getType",
+    value: function getType(value) {
+      return Card$2.getType(value);
+    }
+  }, {
+    key: "validate",
+    value: function validate(_ref2) {
+      var number = _ref2.number,
+          cvv = _ref2.cvv,
+          month = _ref2.month,
+          year = _ref2.year;
+      return Card$2.validate({
+        number: number,
+        cvv: cvv,
+        month: month,
+        year: year
+      });
+    }
+  }, {
+    key: "validateNumber",
+    value: function validateNumber(value) {
+      return Card$2.validateNumber(value);
+    }
+  }, {
+    key: "isNumberValid",
+    value: function isNumberValid(value) {
+      return Card$2.isNumberValid(value);
+    }
+  }, {
+    key: "validateCVV",
+    value: function validateCVV(cvv, cardType) {
+      return Card$2.validateCVV(cvv, cardType);
+    }
+  }, {
+    key: "isCvvValid",
+    value: function isCvvValid(cvv, cardType) {
+      return Card$2.isCvvValid(cvv, cardType);
+    }
+  }, {
+    key: "validateExpiry",
+    value: function validateExpiry(value) {
+      return Card$2.validateExpiry(value);
+    }
+  }, {
+    key: "isExpiryValid",
+    value: function isExpiryValid(value) {
+      return Card$2.isExpiryValid(value);
+    }
+  }, {
+    key: "generateTestCard",
+    value: function generateTestCard(cardType) {
+      return new Card(Card$2.findTestCard(cardType));
+    }
+  }]);
+
+  return Card;
+}();
+
+var CardAPI = {
+  reserve: function reserve(_ref) {
+    var clientdata = _ref.clientdata,
+        last4 = _ref.last4,
+        preauthorizationId = _ref.preauthorizationId,
+        publicKey = _ref.publicKey;
+    var url = "".concat(configToUse.paystackApiUrl, "preauthorization/reserve");
+    var language = getLanguage();
+
+    var headers = _objectSpread2({
+      Authorization: "Bearer ".concat(publicKey)
+    }, language && {
+      'Accept-Language': language
+    });
+
+    return axiosInstance.post(url, {
+      clientdata: clientdata,
+      last4: last4,
+      preauthorization: preauthorizationId
+    }, {
+      headers: headers
+    }).then(function (response) {
+      return ChargeResponses.parse(response.data);
+    });
+  }
+};
+
+var paymentMethod = 'card';
+
+function validate(card, isSetter) {
+  return new Promise(function (resolve, reject) {
+    var validation = Card.validate(card);
+
+    if (!validation.isValid) {
+      var throwValidation = isSetter || card.number;
+      var errors = Object.keys(validation.result).filter(function (value) {
+        return validation.result[value] === false;
+      });
+      var errorMessage = "Invalid card details: ".concat(errors.join(', '));
+      reject(Error(throwValidation ? errorMessage : 'Please set a valid card with setCard()'));
+    }
+
+    resolve();
+  });
+}
+
+var ReserveCardFunds = {
+  setCard: function setCard(params) {
+    var _this = this;
+
+    return validate(params, true).then(function () {
+      _this.card = new Card(params);
+    });
+  },
+  reserve: function reserve(_ref) {
+    var _this2 = this;
+
+    var preauthorizationId = _ref.preauthorizationId,
+        publicKey = _ref.publicKey,
+        _ref$customFields = _ref.customFields,
+        customFields = _ref$customFields === void 0 ? {} : _ref$customFields;
+    // TODO: Log payment method
+    // https://paystack.atlassian.net/browse/RAILS-3070
+    return validate(this.card).then(function () {
+      var chargeParams = {
+        clientdata: _this2.card.tokenize(),
+        last4: _this2.card.getLast4(),
+        preauthorizationId: preauthorizationId,
+        publicKey: publicKey,
+        customFields: customFields
+      };
+      return CardAPI.reserve(chargeParams).then(function (response) {
+        // TODO: Log API Response
+        // https://paystack.atlassian.net/browse/RAILS-3070
+        return response;
+      });
+    });
+  },
+  listenFor3DSCharge: function listenFor3DSCharge(callback) {
+    var listenerOptions = {
+      channel: "3DS_".concat(this.id),
+      paymentMethod: paymentMethod
+    };
+    return this.listenForCharge(listenerOptions, callback);
+  }
+};
+
 var PreauthorizationInstance = /*#__PURE__*/function () {
   function PreauthorizationInstance(data) {
     _classCallCheck(this, PreauthorizationInstance);
 
+    this.id = data.id;
     this.email = data.email;
     this.status = data.status;
     this.reference = data.reference;
@@ -20480,8 +20993,11 @@ var PreauthorizationInstance = /*#__PURE__*/function () {
       name: data.merchant_name,
       key: data.merchant_key
     };
-    loadPusher(); // TODO: Bind charge function to card channel
-    // https://paystack.atlassian.net/browse/RAILS-2887
+    this.card = {};
+    loadPusher(); // TODO: Analytics
+    // https://paystack.atlassian.net/browse/RAILS-3070
+
+    Object.assign(this, ReserveCardFunds);
   }
 
   _createClass(PreauthorizationInstance, [{
@@ -20515,8 +21031,6 @@ var PreauthorisationAPI = {
     });
   },
   requery: function requery() {// TODO: https://paystack.atlassian.net/browse/RAILS-2890
-  },
-  reserveFunds: function reserveFunds() {// TODO: https://paystack.atlassian.net/browse/RAILS-2887
   }
 };
 
@@ -20563,7 +21077,7 @@ var Preauthorization = {
 };
 
 exports.BankAccount = BankAccount;
-exports.Card = Card;
+exports.Card = Card$1;
 exports.Preauthorization = Preauthorization;
 exports.Toolkit = Toolkit;
 exports.Transaction = Transaction;