summit-registration-lite 2.0.11 → 2.0.14

package/dist/index.css

@@ -1,11 +1,13 @@
-.outerWrapper___OWXyi{border:1px solid lightgray;background-color:white;border-radius:5px}.innerWrapper___mIrBF{padding:10px}.title___Tbvkl{display:flex;justify-content:center;align-items:center;border-bottom:1px solid lightgray;margin:0px -10px;padding:0px 15px 5px}.title___Tbvkl i{cursor:pointer;margin-left:auto}.title___Tbvkl span{width:100%;font-weight:bold;font-size:18px;text-align:center;color:var(--color_primary)}
+#modal___G3Cmq{padding:100px 0}.outerWrapper___OWXyi{border:1px solid lightgray;background-color:white;border-radius:5px}.innerWrapper___mIrBF{padding:10px}.title___Tbvkl{display:flex;justify-content:center;align-items:center;border-bottom:1px solid lightgray;margin:0px -10px;padding:0px 15px 5px}.title___Tbvkl i{cursor:pointer;margin-left:auto}.title___Tbvkl span{width:100%;font-weight:bold;font-size:18px;text-align:center;color:var(--color_primary)}
 
-:root{--color_primary: lightgray;--color_primary50: lightgray;--color_primary_contrast: #fff;--color_primary_contrast50: #ffffff50;--color_secondary: lightgray;--color_secondary_contrast: lightgray;--color_text_dark: #212121;--color_text_light: #ffffff;--color_text_input_hints: #212121}.step-wrapper{padding:10px;margin:10px;border:1px solid lightgray;border-radius:5px}.summit-registration-lite{color:var(--color_text_dark);font-size:15px;font-smooth:unset !important;-moz-osx-font-smoothing:none !important;-webkit-font-smoothing:auto !important}input{outline:none}
+:root{--color_primary: lightgray;--color_primary50: lightgray;--color_primary_contrast: #fff;--color_primary_contrast50: #ffffff50;--color_secondary: lightgray;--color_secondary_contrast: lightgray;--color_text_dark: #212121;--color_text_light: #ffffff;--color_text_input_hints: #212121}.step-wrapper{padding:10px;margin:10px;border:1px solid lightgray;border-radius:5px}.summit-registration-lite{color:var(--color_text_dark);font-size:15px;font-smooth:auto !important;-moz-osx-font-smoothing:auto !important;-webkit-font-smoothing:auto !important}.summit-registration-lite input:-moz-placeholder,.summit-registration-lite input::-moz-placeholder{opacity:1}input{outline:none}
 
 .loginWrapper___sxUEn{display:flex;justify-content:center;font-weight:bold;text-align:center;padding:20px 0 30px}.innerWrapper___GQRkq{display:flex;flex-direction:column;justify-content:center;width:300px}.innerWrapper___GQRkq span{margin:10px 0}.button___QMZPu{padding:10px 30px;background-color:red;color:white;font-weight:normal;display:inline-flex;justify-content:center;margin:5px 0;border-radius:5px;cursor:pointer;background-position:28px center;background-repeat:no-repeat;background-size:16px;line-height:1.4;box-shadow:0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12)}.button___QMZPu:hover{box-shadow:0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)}.loginCode___dDBup{margin-bottom:10px;font-size:16px}.loginCode___dDBup>div{margin-top:10px}.loginCode___dDBup span{display:inline-block;font-weight:normal;font-size:14px;color:#e5424d}.input___QR9sA{display:flex;height:40px;margin-top:5px}.input___QR9sA input{border:1px solid var(--color_primary);border-radius:5px;padding:5px;width:100%}.input___QR9sA input::placeholder{color:var(--color_text_input_hints)}.input___QR9sA button{margin-left:5px;background-color:var(--color_secondary_contrast);padding:0px 15px;border:1px solid var(--color_secondary_contrast);color:#fff;box-shadow:none;text-align:center;white-space:nowrap;font-weight:bold;border-radius:5px;cursor:pointer;display:flex;align-items:center;justify-content:center}
 
 .title___LksVm{font-weight:bold;cursor:pointer}.form___v5GIx{display:flex;flex-wrap:wrap;justify-content:space-between;margin:10px 0}.form___v5GIx div.fieldWrapper___Eoe61{width:48%;border-radius:5px;background-color:#e6f3ff;border:1px solid #3fa2f7;height:36px;padding:5px 10px;display:flex;justify-content:space-between;align-items:center;margin-bottom:5px}.form___v5GIx div.fieldWrapper___Eoe61:first-of-type{width:100%}.form___v5GIx div.fieldWrapper___Eoe61 input{width:100%;background-color:transparent;border:none}.form___v5GIx div.fieldWrapper___Eoe61 input:focus-visible{outline:none}.form___v5GIx div.fieldWrapper___Eoe61 i{position:relative}.form___v5GIx div.fieldWrapper___Eoe61>div{width:100%}.form___v5GIx div.fieldWrapper___Eoe61>div:first-of-type{width:95%}.form___v5GIx input{width:48%;border-radius:5px;border:1px solid #3fa2f7;color:#3486cd;font-size:16px;background-color:#e6f3ff;height:36px;padding:5px 10px;display:flex;justify-content:space-between;align-items:center;margin-bottom:5px;font-weight:bold}.form___v5GIx input::placeholder{color:#3486cd}
 
+.form___zXb7s{display:flex;flex-wrap:wrap;justify-content:space-between;margin:10px 0}.form___zXb7s div.fieldWrapper___G4Wqw{width:100%;margin-bottom:5px}.form___zXb7s div.fieldWrapper___G4Wqw:first-of-type div.inputWrapper___Yz5zB{width:100%}.form___zXb7s div.fieldWrapper___G4Wqw .fieldRow___NfZdJ{justify-content:space-between;display:flex}.form___zXb7s div.fieldWrapper___G4Wqw div.inputWrapper___Yz5zB{width:48%}.form___zXb7s div.lawpayWrapper___hpUBf{height:36px}.form___zXb7s div.dateWrapper___XDfqs{display:flex;justify-content:space-between}.form___zXb7s div.dateWrapper___XDfqs>div{width:48%}.form___zXb7s div.dateWrapper___XDfqs>div .dropdown___l3_bk{width:100%}.form___zXb7s div.dateWrapper___XDfqs>div .dropdown___l3_bk>div{border:1px solid var(--color_primary);width:100%}.form___zXb7s div.inputWrapper___Yz5zB{display:flex;border-radius:5px;border:1px solid var(--color_primary);height:36px;padding:5px 10px;justify-content:space-between;align-items:center}.form___zXb7s div.inputWrapper___Yz5zB iframe{height:inherit;width:inherit}.form___zXb7s div.inputWrapper___Yz5zB input{width:100%;background-color:transparent;border:none;padding:0;font-size:16px;display:flex;justify-content:space-between;align-items:center}.form___zXb7s div.inputWrapper___Yz5zB input::placeholder{color:var(--color_text_input_hints);font-size:16px}.form___zXb7s div.inputWrapper___Yz5zB input:focus-visible{outline:none}.form___zXb7s div.inputWrapper___Yz5zB i{position:relative}.form___zXb7s div.inputWrapper___Yz5zB>div{width:100%}.form___zXb7s div.inputWrapper___Yz5zB>div:first-of-type{width:95%}.form___zXb7s div.fieldError___Igq3U{margin-top:5px;margin-bottom:5px;color:#e5424d;font-size:14px;line-height:1.5}.form___zXb7s div.fieldError___Igq3U::before{font-family:FontAwesome;content:'\f071';margin-right:5px}
+
 .form___DoT3x{display:flex;flex-wrap:wrap;justify-content:space-between;margin:10px 0}.form___DoT3x div.fieldWrapper___wa1Ks{width:48%;margin-bottom:5px}.form___DoT3x div.fieldWrapper___wa1Ks:first-of-type{width:100%}.form___DoT3x div.inputWrapper___CbXhF{display:flex;border-radius:5px;border:1px solid var(--color_primary);height:36px;padding:5px 10px;justify-content:space-between;align-items:center}.form___DoT3x div.inputWrapper___CbXhF input{width:100%;background-color:transparent;border:none;padding:0;font-size:16px;display:flex;justify-content:space-between;align-items:center}.form___DoT3x div.inputWrapper___CbXhF input::placeholder{color:var(--color_text_input_hints);font-size:16px}.form___DoT3x div.inputWrapper___CbXhF input:focus-visible{outline:none}.form___DoT3x div.inputWrapper___CbXhF i{position:relative}.form___DoT3x div.inputWrapper___CbXhF>div{width:100%}.form___DoT3x div.inputWrapper___CbXhF>div:first-of-type{width:95%}.form___DoT3x div.fieldError___QrMYW{margin-top:5px;margin-bottom:5px;color:#e5424d;font-size:14px;line-height:1.5}.form___DoT3x div.fieldError___QrMYW::before{font-family:FontAwesome;content:'\f071';margin-right:5px}
 
 .title___ECoNz{font-weight:bold;cursor:pointer;display:flex;justify-content:space-between}.title___ECoNz div{font-weight:normal}.form___lDFka{display:flex;flex-wrap:wrap;justify-content:space-between;margin:10px 0 0}.form___lDFka div.fieldWrapper___Mi_nL{width:48%;margin-bottom:5px}.form___lDFka div.inputWrapper___PEQFR{display:flex;border-radius:5px;border:1px solid var(--color_primary);height:36px;padding:5px 10px;justify-content:space-between;align-items:center}.form___lDFka div.inputWrapper___PEQFR input{width:100%;background-color:transparent;border:none;padding:0;font-size:16px;display:flex;justify-content:space-between;align-items:center}.form___lDFka div.inputWrapper___PEQFR input::placeholder{color:var(--color_text_input_hints);font-size:16px}.form___lDFka div.inputWrapper___PEQFR input:focus-visible{outline:none}.form___lDFka div.inputWrapper___PEQFR .readOnly___WRazF{opacity:0.6;cursor:default}.form___lDFka div.fieldError___ksJVe{margin-top:5px;margin-bottom:5px;color:#e5424d;font-size:14px;line-height:1.5}.form___lDFka div.fieldError___ksJVe::before{font-family:FontAwesome;content:'\f071';margin-right:5px}.form___lDFka .companies___kmGFB>div{position:relative;width:100%;border-radius:5px;display:flex;justify-content:space-between;align-items:center;font-size:15px}.form___lDFka .companies___kmGFB>div::placeholder{color:var(--color_text_input_hints)}.form___lDFka .companies___kmGFB>div>div{height:100%;width:100%}.form___lDFka .companies___kmGFB>div>div>div{height:36px;padding:0px;border:1px solid var(--color_primary);box-shadow:0 0 1px var(--color_primary)}.form___lDFka .companies___kmGFB>div>div>div>div{height:36px}.form___lDFka .companies___kmGFB>div>div>span+div+div{overflow:auto;height:auto}.form___lDFka .companies___kmGFB>div>div>span+div+div>div{height:auto}.form___lDFka .companies___kmGFB>div input{padding:5px 10px;border:1px solid var(--color_primary);padding-right:0px !important;background-color:transparent}.form___lDFka .companies___kmGFB>div i{right:10px !important}.moreInfo___cQYdZ{display:inline-block;margin-top:10px}.moreInfoTooltip___lslgT{max-width:280px}.ticketQuantityNotice___L6gis{margin:10px 0 0 !important}.formErrors___dQQMe{margin-top:10px}.formErrors___dQQMe div+div{margin-top:10px}

package/dist/index.js

@@ -84,12 +84,215 @@ const actions_namespaceObject = require("openstack-uicore-foundation/lib/utils/a
 ;// CONCATENATED MODULE: external "sweetalert2"
 const external_sweetalert2_namespaceObject = require("sweetalert2");
 var external_sweetalert2_default = /*#__PURE__*/__webpack_require__.n(external_sweetalert2_namespaceObject);
-;// CONCATENATED MODULE: ./src/actions.js
+;// CONCATENATED MODULE: ./src/utils/payment-providers/lawpay-provider.js
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+
+
+
+class LawPayProvider {
+  constructor({
+    reservation,
+    summitId,
+    userProfile,
+    access_token,
+    apiBaseUrl,
+    dispatch
+  }) {
+    _defineProperty(this, "payTicket", ({
+      token
+    }) => async dispatch => {
+      var _this$userProfile, _this$userProfile2, _this$userProfile3, _this$userProfile4;
+
+      // Pay using affinity lawpay
+      let params = {
+        access_token: this.access_token,
+        expand: 'tickets,' + 'tickets.owner,' + 'tickets.owner.extra_questions,' + 'tickets.badge,' + 'tickets.badge.type,' + 'tickets.badge.type.access_levels,' + 'tickets.badge.type.features,' + 'tickets.ticket_type,' + 'tickets.ticket_type.taxes'
+      };
+      let normalizedEntity = {
+        billing_address_1: token.address1 || '',
+        billing_address_2: ((_this$userProfile = this.userProfile) === null || _this$userProfile === void 0 ? void 0 : _this$userProfile.address2) || '',
+        billing_address_zip_code: token.postal_code,
+        billing_address_city: ((_this$userProfile2 = this.userProfile) === null || _this$userProfile2 === void 0 ? void 0 : _this$userProfile2.locality) || '',
+        billing_address_state: ((_this$userProfile3 = this.userProfile) === null || _this$userProfile3 === void 0 ? void 0 : _this$userProfile3.region) || '',
+        billing_address_country: ((_this$userProfile4 = this.userProfile) === null || _this$userProfile4 === void 0 ? void 0 : _this$userProfile4.country) || '',
+        payment_method_id: token.id
+      };
+      this.dispatch(startWidgetLoading());
+
+      if (this.reservation.amount > 0) {
+        return (0,actions_namespaceObject.putRequest)(null, (0,actions_namespaceObject.createAction)(PAY_RESERVATION), `${this.apiBaseUrl}/api/v1/summits/${this.summitId}/orders/${this.reservation.hash}/checkout`, normalizedEntity, actions_namespaceObject.authErrorHandler // entity
+        )(params)(this.dispatch).then(payload => {
+          this.dispatch(stopWidgetLoading());
+          this.dispatch((0,actions_namespaceObject.createAction)(CLEAR_RESERVATION)({}));
+          this.dispatch(changeStep(3));
+          return payload;
+        }).catch(e => {
+          this.dispatch(removeReservedTicket());
+          this.dispatch(changeStep(1));
+          this.dispatch(stopWidgetLoading());
+          return e;
+        }); // The payment has succeeded. Display a success message.            
+      } else {
+        // FREE TICKET
+        return (0,actions_namespaceObject.putRequest)(null, (0,actions_namespaceObject.createAction)(PAY_RESERVATION), `${this.apiBaseUrl}/api/v1/summits/${this.summitId}/orders/${this.reservation.hash}/checkout`, normalizedEntity, actions_namespaceObject.authErrorHandler // entity
+        )(params)(this.dispatch).then(payload => {
+          this.dispatch(stopWidgetLoading());
+          this.dispatch((0,actions_namespaceObject.createAction)(CLEAR_RESERVATION)({}));
+          this.dispatch(changeStep(3));
+          return payload;
+        }).catch(e => {
+          this.dispatch(removeReservedTicket());
+          this.dispatch(changeStep(1));
+          this.dispatch(stopWidgetLoading());
+          return e;
+        }); // The payment has succeeded. Display a success message.
+      }
+    });
+
+    this.reservation = reservation;
+    this.summitId = summitId;
+    this.userProfile = userProfile;
+    this.access_token = access_token;
+    this.apiBaseUrl = apiBaseUrl;
+    this.dispatch = dispatch;
+  }
+
+}
+;// CONCATENATED MODULE: ./src/utils/payment-providers/stripe-provider.js
+function stripe_provider_defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+
+
+
+
+class StripeProvider {
+  constructor({
+    reservation,
+    summitId,
+    userProfile,
+    access_token,
+    apiBaseUrl,
+    dispatch: _dispatch
+  }) {
+    stripe_provider_defineProperty(this, "payTicket", ({
+      token = null,
+      stripe = null,
+      zipCode = null
+    }) => async dispatch => {
+      var _this$userProfile, _this$userProfile2, _this$userProfile3, _this$userProfile4, _this$userProfile5;
+
+      let params = {
+        access_token: this.access_token,
+        expand: 'tickets,' + 'tickets.owner,' + 'tickets.owner.extra_questions,' + 'tickets.badge,' + 'tickets.badge.type,' + 'tickets.badge.type.access_levels,' + 'tickets.badge.type.features,' + 'tickets.ticket_type,' + 'tickets.ticket_type.taxes'
+      };
+      let normalizedEntity = {
+        billing_address_1: ((_this$userProfile = this.userProfile) === null || _this$userProfile === void 0 ? void 0 : _this$userProfile.address1) || '',
+        billing_address_2: ((_this$userProfile2 = this.userProfile) === null || _this$userProfile2 === void 0 ? void 0 : _this$userProfile2.address2) || '',
+        billing_address_zip_code: zipCode,
+        billing_address_city: ((_this$userProfile3 = this.userProfile) === null || _this$userProfile3 === void 0 ? void 0 : _this$userProfile3.locality) || '',
+        billing_address_state: ((_this$userProfile4 = this.userProfile) === null || _this$userProfile4 === void 0 ? void 0 : _this$userProfile4.region) || '',
+        billing_address_country: ((_this$userProfile5 = this.userProfile) === null || _this$userProfile5 === void 0 ? void 0 : _this$userProfile5.country) || ''
+      };
+      dispatch(startWidgetLoading());
+
+      if (this.reservation.amount > 0) {
+        const {
+          id
+        } = token;
+        stripe.confirmCardPayment(this.reservation.payment_gateway_client_token, {
+          payment_method: {
+            card: {
+              token: id
+            }
+          }
+        }).then(result => {
+          if (result.error) {
+            // Reserve error.message in your UI.
+            external_sweetalert2_default().fire(result.error.message, "Please retry purchase.", "warning");
+            this.dispatch(changeStep(1));
+            this.dispatch(removeReservedTicket());
+            this.dispatch(stopWidgetLoading());
+          } else {
+            return (0,actions_namespaceObject.putRequest)(null, (0,actions_namespaceObject.createAction)(PAY_RESERVATION), `${this.apiBaseUrl}/api/v1/summits/${this.summitId}/orders/${this.reservation.hash}/checkout`, normalizedEntity, actions_namespaceObject.authErrorHandler // entity
+            )(params)(this.dispatch).then(payload => {
+              this.dispatch(stopWidgetLoading());
+              this.dispatch((0,actions_namespaceObject.createAction)(CLEAR_RESERVATION)({}));
+              this.dispatch(changeStep(3));
+              return payload;
+            }).catch(e => {
+              this.dispatch(stopWidgetLoading());
+              return e;
+            }); // The payment has succeeded. Display a success message.
+          }
+        }).catch(e => {
+          this.dispatch(removeReservedTicket());
+          this.dispatch(changeStep(1));
+          this.dispatch(stopWidgetLoading());
+          return e;
+        });
+      } else {
+        // FREE TICKET
+        return (0,actions_namespaceObject.putRequest)(null, (0,actions_namespaceObject.createAction)(PAY_RESERVATION), `${this.apiBaseUrl}/api/v1/summits/${this.summitId}/orders/${this.reservation.hash}/checkout`, normalizedEntity, actions_namespaceObject.authErrorHandler // entity
+        )(params)(this.dispatch).then(payload => {
+          this.dispatch(stopWidgetLoading());
+          this.dispatch((0,actions_namespaceObject.createAction)(CLEAR_RESERVATION)({}));
+          this.dispatch(changeStep(3));
+          return payload;
+        }).catch(e => {
+          this.dispatch(removeReservedTicket());
+          this.dispatch(changeStep(1));
+          this.dispatch(stopWidgetLoading());
+          return e;
+        }); // The payment has succeeded. Display a success message.
+      }
+    });
+
+    this.reservation = reservation;
+    this.summitId = summitId;
+    this.userProfile = userProfile;
+    this.access_token = access_token;
+    this.apiBaseUrl = apiBaseUrl;
+    this.dispatch = _dispatch;
+  }
+
+}
+;// CONCATENATED MODULE: ./src/utils/payment-providers/payment-provider-factory.js
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { payment_provider_factory_defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function payment_provider_factory_defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+
+
+class PaymentProviderFactory {}
+
+payment_provider_factory_defineProperty(PaymentProviderFactory, "build", (provider, params = {}) => {
+  let currentProvider = null;
+
+  switch (provider) {
+    case 'LawPay':
+      {
+        currentProvider = new LawPayProvider(_objectSpread({}, params));
+        break;
+      }
+
+    case 'Stripe':
+      {
+        currentProvider = new StripeProvider(_objectSpread({}, params));
+        break;
+      }
+  }
+
+  return currentProvider;
+});
+;// CONCATENATED MODULE: ./src/actions.js
+function actions_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function actions_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? actions_ownKeys(Object(source), !0).forEach(function (key) { actions_defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : actions_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function actions_defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 /**
  * Copyright 2020 OpenStack Foundation
@@ -106,6 +309,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 
 
 
+
 const START_WIDGET_LOADING = 'START_WIDGET_LOADING';
 const STOP_WIDGET_LOADING = 'STOP_WIDGET_LOADING';
 const LOAD_INITIAL_VARS = 'LOAD_INITIAL_VARS';
@@ -228,7 +432,7 @@ const reserveTicket = ({
     dispatch(stopWidgetLoading());
     payload.response.promo_code = promoCode || null;
 
-    if (!payload.response.payment_gateway_client_token) {
+    if (!payload.response.amount) {
       dispatch(payTicket(null, null, getAccessToken));
       return payload;
     } else {
@@ -273,7 +477,7 @@ const removeReservedTicket = () => async (dispatch, getState, {
     return e;
   });
 };
-const payTicket = (token = null, stripe = null, zipCode = null) => async (dispatch, getState, {
+const payTicketWithProvider = (provider, params = {}) => async (dispatch, getState, {
   apiBaseUrl,
   getAccessToken
 }) => {
@@ -287,70 +491,16 @@ const payTicket = (token = null, stripe = null, zipCode = null) => async (dispat
     }
   } = getState();
   const access_token = await getAccessToken();
-  let params = {
-    access_token,
-    expand: 'tickets,' + 'tickets.owner,' + 'tickets.owner.extra_questions,' + 'tickets.badge,' + 'tickets.badge.type,' + 'tickets.badge.type.access_levels,' + 'tickets.badge.type.features,' + 'tickets.ticket_type,' + 'tickets.ticket_type.taxes'
-  };
-  let normalizedEntity = {
-    billing_address_1: (userProfile === null || userProfile === void 0 ? void 0 : userProfile.address1) || '',
-    billing_address_2: (userProfile === null || userProfile === void 0 ? void 0 : userProfile.address2) || '',
-    billing_address_zip_code: zipCode,
-    billing_address_city: (userProfile === null || userProfile === void 0 ? void 0 : userProfile.locality) || '',
-    billing_address_state: (userProfile === null || userProfile === void 0 ? void 0 : userProfile.region) || '',
-    billing_address_country: (userProfile === null || userProfile === void 0 ? void 0 : userProfile.country) || ''
-  };
   dispatch(startWidgetLoading());
-
-  if (reservation.payment_gateway_client_token) {
-    const {
-      id
-    } = token;
-    stripe.confirmCardPayment(reservation.payment_gateway_client_token, {
-      payment_method: {
-        card: {
-          token: id
-        }
-      }
-    }).then(result => {
-      if (result.error) {
-        // Reserve error.message in your UI.
-        external_sweetalert2_default().fire(result.error.message, "Please retry purchase.", "warning");
-        dispatch(changeStep(1));
-        dispatch(removeReservedTicket());
-        dispatch(stopWidgetLoading());
-      } else {
-        return (0,actions_namespaceObject.putRequest)(null, (0,actions_namespaceObject.createAction)(PAY_RESERVATION), `${apiBaseUrl}/api/v1/summits/${summitId}/orders/${reservation.hash}/checkout`, normalizedEntity, actions_namespaceObject.authErrorHandler // entity
-        )(params)(dispatch).then(payload => {
-          dispatch(stopWidgetLoading());
-          dispatch((0,actions_namespaceObject.createAction)(CLEAR_RESERVATION)({}));
-          dispatch(changeStep(3));
-          return payload;
-        }).catch(e => {
-          dispatch(stopWidgetLoading());
-          return e;
-        }); // The payment has succeeded. Display a success message.
-      }
-    }).catch(e => {
-      dispatch(removeReservedTicket());
-      dispatch(changeStep(1));
-      dispatch(stopWidgetLoading());
-      return e;
-    });
-  } else {
-    // FREE TICKET
-    return (0,actions_namespaceObject.putRequest)(null, (0,actions_namespaceObject.createAction)(PAY_RESERVATION), `${apiBaseUrl}/api/v1/summits/${summitId}/orders/${reservation.hash}/checkout`, normalizedEntity, actions_namespaceObject.authErrorHandler // entity
-    )(params)(dispatch).then(payload => {
-      dispatch(stopWidgetLoading());
-      dispatch((0,actions_namespaceObject.createAction)(CLEAR_RESERVATION)({}));
-      dispatch(changeStep(3));
-      return payload;
-    }).catch(e => {
-      dispatch(removeReservedTicket());
-      dispatch(changeStep(1));
-      dispatch(stopWidgetLoading());
-      return e;
-    }); // The payment has succeeded. Display a success message.
-  }
+  const currentProvider = PaymentProviderFactory.build(provider, {
+    reservation,
+    summitId,
+    userProfile,
+    access_token,
+    apiBaseUrl,
+    dispatch
+  });
+  return dispatch(currentProvider.payTicket(actions_objectSpread({}, params)));
 };
 const changeStep = step => (dispatch, getState) => {
   dispatch(startWidgetLoading());
@@ -404,7 +554,7 @@ const isInPersonTicketType = ticketType => {
 };
 
 const normalizeReservation = entity => {
-  const normalizedEntity = _objectSpread({}, entity);
+  const normalizedEntity = actions_objectSpread({}, entity);
 
   if (!entity.owner_company.id) {
     normalizedEntity['owner_company'] = entity.owner_company.name;
@@ -658,11 +808,9 @@ const external_react_use_namespaceObject = require("react-use");
 ;// CONCATENATED MODULE: external "openstack-uicore-foundation/lib/components/ajaxloader"
 const ajaxloader_namespaceObject = require("openstack-uicore-foundation/lib/components/ajaxloader");
 var ajaxloader_default = /*#__PURE__*/__webpack_require__.n(ajaxloader_namespaceObject);
-;// CONCATENATED MODULE: external "@stripe/stripe-js"
-const stripe_js_namespaceObject = require("@stripe/stripe-js");
 ;// CONCATENATED MODULE: ./src/styles/general.module.scss
 // extracted by mini-css-extract-plugin
-/* harmony default export */ const general_module = ({"outerWrapper":"outerWrapper___OWXyi","innerWrapper":"innerWrapper___mIrBF","title":"title___Tbvkl"});
+/* harmony default export */ const general_module = ({"modal":"modal___G3Cmq","outerWrapper":"outerWrapper___OWXyi","innerWrapper":"innerWrapper___mIrBF","title":"title___Tbvkl"});
 ;// CONCATENATED MODULE: ./src/components/login/index.module.scss
 // extracted by mini-css-extract-plugin
 /* harmony default export */ const index_module = ({"loginWrapper":"loginWrapper___sxUEn","innerWrapper":"innerWrapper___GQRkq","button":"button___QMZPu","loginCode":"loginCode___dDBup","input":"input___QR9sA"});
@@ -713,7 +861,7 @@ const LoginComponent = ({
     className: `${index_module.innerWrapper}`
   }, /*#__PURE__*/external_react_default().createElement("div", {
     className: index_module.loginCode
-  }, "Enter your email address to login or signup:", /*#__PURE__*/external_react_default().createElement("div", {
+  }, "Enter your email to begin registration:", /*#__PURE__*/external_react_default().createElement("div", {
     className: index_module.input
   }, /*#__PURE__*/external_react_default().createElement("input", {
     placeholder: "youremail@example.com",
@@ -726,7 +874,7 @@ const LoginComponent = ({
     "data-testid": "email-button"
   }, ">"), /*#__PURE__*/external_react_default().createElement("br", null)), emailError && /*#__PURE__*/external_react_default().createElement("span", {
     "data-testid": "email-error"
-  }, "Please enter a valid email address")), /*#__PURE__*/external_react_default().createElement("span", null, "Or you may signup or login with a social provider:"), options.map((o, index) => {
+  }, "Please enter a valid email address")), /*#__PURE__*/external_react_default().createElement("span", null, "Or you may login with one of the following:"), options.map((o, index) => {
     return o.provider_param ? /*#__PURE__*/external_react_default().createElement("div", {
       className: `${index_module.button}`,
       key: `provider-${o.provider_param}`,
@@ -773,11 +921,287 @@ const LoginComponent = ({
 /* harmony default export */ const login = (LoginComponent);
 ;// CONCATENATED MODULE: external "prop-types"
 const external_prop_types_namespaceObject = require("prop-types");
-;// CONCATENATED MODULE: external "@stripe/react-stripe-js"
-const react_stripe_js_namespaceObject = require("@stripe/react-stripe-js");
 ;// CONCATENATED MODULE: ./src/components/payment/index.module.scss
 // extracted by mini-css-extract-plugin
 /* harmony default export */ const payment_index_module = ({"title":"title___LksVm","form":"form___v5GIx","fieldWrapper":"fieldWrapper___Eoe61"});
+;// CONCATENATED MODULE: external "openstack-uicore-foundation/lib/components"
+const components_namespaceObject = require("openstack-uicore-foundation/lib/components");
+;// CONCATENATED MODULE: external "openstack-uicore-foundation/lib/utils/methods"
+const methods_namespaceObject = require("openstack-uicore-foundation/lib/utils/methods");
+;// CONCATENATED MODULE: ./src/components/lawpay-form/index.module.scss
+// extracted by mini-css-extract-plugin
+/* harmony default export */ const lawpay_form_index_module = ({"form":"form___zXb7s","fieldWrapper":"fieldWrapper___G4Wqw","inputWrapper":"inputWrapper___Yz5zB","fieldRow":"fieldRow___NfZdJ","lawpayWrapper":"lawpayWrapper___hpUBf","dateWrapper":"dateWrapper___XDfqs","dropdown":"dropdown___l3_bk","fieldError":"fieldError___Igq3U"});
+;// CONCATENATED MODULE: ./src/components/lawpay-form/index.js
+function lawpay_form_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function lawpay_form_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? lawpay_form_ownKeys(Object(source), !0).forEach(function (key) { lawpay_form_defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : lawpay_form_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function lawpay_form_defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+/**
+ * Copyright 2020 OpenStack Foundation
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ **/
+
+
+
+
+
+
+
+const LawPayForm = ({
+  reservation,
+  payTicket,
+  userProfile,
+  marketingData,
+  providerKey,
+  provider,
+  timestamp
+}) => {
+  const [hostedFields, setHostedFields] = (0,external_react_namespaceObject.useState)(null);
+  const [lawPayFields, setLawPayFields] = (0,external_react_namespaceObject.useState)({
+    exp_month: '',
+    exp_year: '',
+    postal_code: userProfile.postal_code || '',
+    address1: userProfile.address1 || ''
+  });
+  const [lawPayErrors, setLawPayErrors] = (0,external_react_namespaceObject.useState)({
+    exp_month: '',
+    exp_year: '',
+    postal_code: '',
+    credit_card_number: '',
+    cvv: '',
+    address1: ''
+  });
+  const style = {
+    color: marketingData.color_text_dark,
+    fontSize: '16px',
+    fontFamily: 'inherit',
+    backgroundColor: '#ffffff',
+    '::placeholder': {
+      color: marketingData.color_text_input_hints
+    }
+  };
+  const hostedFieldsConfiguration = {
+    publicKey: `${providerKey}`,
+    fields: [{
+      selector: "#my_credit_card_field_id",
+      input: {
+        type: "credit_card_number",
+        placeholder: "Credit Card Number",
+        css: style
+      }
+    }, {
+      selector: "#my_cvv_field_id",
+      input: {
+        type: "cvv",
+        placeholder: "CCV",
+        css: style
+      }
+    }]
+  };
+
+  const hostedFieldsCallBack = state => {
+    let fieldErrors = {};
+    state.fields.map(f => {
+      fieldErrors = lawpay_form_objectSpread(lawpay_form_objectSpread({}, fieldErrors), {}, {
+        [f.type]: f.error
+      });
+    });
+    setLawPayErrors(lawpay_form_objectSpread(lawpay_form_objectSpread({}, lawPayErrors), fieldErrors));
+  };
+
+  (0,external_react_namespaceObject.useEffect)(() => {
+    if (window.AffiniPay && hostedFields === null) {
+      setHostedFields(window.AffiniPay.HostedFields.initializeFields(hostedFieldsConfiguration, hostedFieldsCallBack));
+    }
+  }, [reservation]);
+
+  const onExpireChange = ev => {
+    setLawPayFields(lawpay_form_objectSpread(lawpay_form_objectSpread({}, lawPayFields), {}, {
+      [ev.target.id]: ev.target.value
+    }));
+  };
+
+  const formHasErrors = () => {
+    let errors = {};
+    Object.keys(lawPayFields).map(key => {
+      if (!lawPayFields[key]) {
+        errors = lawpay_form_objectSpread(lawpay_form_objectSpread({}, errors), {}, {
+          [key]: 'This field is required.'
+        });
+      }
+    });
+    setLawPayErrors(lawpay_form_objectSpread(lawpay_form_objectSpread({}, lawPayErrors), errors));
+    return Object.keys(errors).length > 0;
+  };
+
+  const onSubmit = async event => {
+    event.preventDefault();
+
+    if (!hostedFields) {
+      // Affinity Pay has not loaded yet. Make sure to disable
+      // form submission until Affinity Pay has loaded.
+      return;
+    }
+
+    if (!formHasErrors()) {
+      try {
+        const token = await hostedFields.getPaymentToken({
+          "postal_code": lawPayFields.postal_code,
+          "address1": lawPayFields.address1,
+          "exp_year": lawPayFields.exp_year,
+          "exp_month": lawPayFields.exp_month
+        });
+        payTicket(provider, {
+          token
+        });
+      } catch (error) {
+        external_sweetalert2_default().fire("Payment error", error.message, "warning");
+      }
+    }
+  };
+
+  const ddl_month = [{
+    label: '1 - January',
+    value: '01'
+  }, {
+    label: '2 - February',
+    value: '02'
+  }, {
+    label: '3 - March',
+    value: '03'
+  }, {
+    label: '4 - April',
+    value: '04'
+  }, {
+    label: '5 - May',
+    value: '05'
+  }, {
+    label: '6 - June',
+    value: '06'
+  }, {
+    label: '7 - July',
+    value: '07'
+  }, {
+    label: '8 - August',
+    value: '08'
+  }, {
+    label: '9 - September',
+    value: '09'
+  }, {
+    label: '10 - October',
+    value: '10'
+  }, {
+    label: '11 - November',
+    value: '11'
+  }, {
+    label: '12 - December',
+    value: '12'
+  }];
+  const current_year = (0,methods_namespaceObject.epochToMomentTimeZone)(timestamp, 'utc').year();
+  const year_ddl = Array.from({
+    length: 15
+  }, (_, i) => {
+    return {
+      label: `${current_year + i}`,
+      value: `${current_year + i}`
+    };
+  });
+  return /*#__PURE__*/external_react_default().createElement("form", {
+    className: lawpay_form_index_module.form,
+    id: "payment-form",
+    onSubmit: onSubmit
+  }, /*#__PURE__*/external_react_default().createElement("div", {
+    className: lawpay_form_index_module.fieldWrapper
+  }, /*#__PURE__*/external_react_default().createElement("div", {
+    className: lawpay_form_index_module.inputWrapper
+  }, /*#__PURE__*/external_react_default().createElement("div", {
+    id: "my_credit_card_field_id",
+    className: lawpay_form_index_module.lawpayWrapper
+  }), /*#__PURE__*/external_react_default().createElement("i", {
+    className: "fa fa-credit-card"
+  })), lawPayErrors.credit_card_number && /*#__PURE__*/external_react_default().createElement("div", {
+    className: lawpay_form_index_module.fieldError
+  }, lawPayErrors.credit_card_number)), /*#__PURE__*/external_react_default().createElement("div", {
+    className: lawpay_form_index_module.fieldWrapper
+  }, /*#__PURE__*/external_react_default().createElement("div", {
+    className: lawpay_form_index_module.dateWrapper
+  }, /*#__PURE__*/external_react_default().createElement("div", null, /*#__PURE__*/external_react_default().createElement(components_namespaceObject.Dropdown, {
+    className: lawpay_form_index_module.dropdown,
+    placeholder: "Month",
+    onChange: onExpireChange,
+    id: "exp_month",
+    options: ddl_month
+  }), lawPayErrors.exp_month && /*#__PURE__*/external_react_default().createElement("div", {
+    className: lawpay_form_index_module.fieldError
+  }, lawPayErrors.exp_month)), /*#__PURE__*/external_react_default().createElement("div", null, /*#__PURE__*/external_react_default().createElement(components_namespaceObject.Dropdown, {
+    className: lawpay_form_index_module.dropdown,
+    placeholder: "Year",
+    onChange: onExpireChange,
+    id: "exp_year",
+    options: year_ddl
+  }), lawPayErrors.exp_year && /*#__PURE__*/external_react_default().createElement("div", {
+    className: lawpay_form_index_module.fieldError
+  }, lawPayErrors.exp_year)))), /*#__PURE__*/external_react_default().createElement("div", {
+    className: lawpay_form_index_module.fieldWrapper
+  }, /*#__PURE__*/external_react_default().createElement("div", {
+    className: lawpay_form_index_module.fieldRow
+  }, /*#__PURE__*/external_react_default().createElement("div", {
+    className: lawpay_form_index_module.inputWrapper
+  }, /*#__PURE__*/external_react_default().createElement("div", {
+    id: "my_cvv_field_id",
+    className: lawpay_form_index_module.lawpayWrapper
+  })), /*#__PURE__*/external_react_default().createElement("div", {
+    className: lawpay_form_index_module.inputWrapper
+  }, /*#__PURE__*/external_react_default().createElement("input", {
+    type: "text",
+    name: "postal_code",
+    placeholder: "ZIP Code *",
+    onChange: e => setLawPayFields(lawpay_form_objectSpread(lawpay_form_objectSpread({}, lawPayFields), {}, {
+      postal_code: e.target.value
+    }))
+  }))), /*#__PURE__*/external_react_default().createElement("div", {
+    className: lawpay_form_index_module.fieldRow
+  }, lawPayErrors.cvv && /*#__PURE__*/external_react_default().createElement("div", {
+    className: lawpay_form_index_module.fieldError
+  }, lawPayErrors.cvv), lawPayErrors.postal_code && /*#__PURE__*/external_react_default().createElement("div", {
+    className: lawpay_form_index_module.fieldError
+  }, lawPayErrors.postal_code))), /*#__PURE__*/external_react_default().createElement("div", {
+    className: lawpay_form_index_module.fieldWrapper
+  }, /*#__PURE__*/external_react_default().createElement("div", {
+    className: lawpay_form_index_module.inputWrapper
+  }, /*#__PURE__*/external_react_default().createElement("input", {
+    type: "text",
+    name: "address1",
+    placeholder: "Address *",
+    onChange: e => setLawPayFields(lawpay_form_objectSpread(lawpay_form_objectSpread({}, lawPayFields), {}, {
+      address1: e.target.value
+    }))
+  })), lawPayErrors.address1 && /*#__PURE__*/external_react_default().createElement("div", {
+    className: lawpay_form_index_module.fieldError
+  }, lawPayErrors.address1)));
+};
+
+const mapStateToProps = ({
+  registrationLiteState
+}) => ({
+  marketingData: registrationLiteState.settings.marketingData
+});
+
+/* harmony default export */ const lawpay_form = ((0,external_react_redux_namespaceObject.connect)(mapStateToProps, null)(LawPayForm));
+;// CONCATENATED MODULE: external "@stripe/stripe-js"
+const stripe_js_namespaceObject = require("@stripe/stripe-js");
+;// CONCATENATED MODULE: external "@stripe/react-stripe-js"
+const react_stripe_js_namespaceObject = require("@stripe/react-stripe-js");
 ;// CONCATENATED MODULE: external "react-hook-form"
 const external_react_hook_form_namespaceObject = require("react-hook-form");
 ;// CONCATENATED MODULE: external "lodash/merge"
@@ -852,7 +1276,8 @@ const StripeForm = ({
   payTicket,
   userProfile,
   marketingData,
-  stripeOptions
+  stripeOptions,
+  provider
 }) => {
   const stripe = (0,react_stripe_js_namespaceObject.useStripe)();
   const elements = (0,react_stripe_js_namespaceObject.useElements)();
@@ -903,7 +1328,11 @@ const StripeForm = ({
     });
 
     if (token) {
-      payTicket(token, stripe, data.zipCode);
+      payTicket(provider, {
+        token,
+        stripe,
+        zipCode: data.zipCode
+      });
     } else if (error) {
       if (stripeErrorCodeMap[error.code]) {
         setStripeErrors({
@@ -969,13 +1398,59 @@ const StripeForm = ({
   }, "This field is required.")));
 };
 
-const mapStateToProps = ({
+const stripe_form_mapStateToProps = ({
   registrationLiteState
 }) => ({
   marketingData: registrationLiteState.settings.marketingData
 });
 
-/* harmony default export */ const stripe_form = ((0,external_react_redux_namespaceObject.connect)(mapStateToProps, null)(StripeForm));
+/* harmony default export */ const stripe_form = ((0,external_react_redux_namespaceObject.connect)(stripe_form_mapStateToProps, null)(StripeForm));
+;// CONCATENATED MODULE: ./src/components/stripe-component/index.js
+/**
+ * Copyright 2020 OpenStack Foundation
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ **/
+
+
+
+
+
+
+const stripe_component_StripeProvider = ({
+  userProfile,
+  reservation,
+  payTicket,
+  providerKey,
+  provider,
+  stripeOptions
+}) => {
+  const stripePromise = (0,external_react_namespaceObject.useMemo)(() => (0,stripe_js_namespaceObject.loadStripe)(providerKey), [providerKey]);
+  const options = {
+    fonts: stripeOptions === null || stripeOptions === void 0 ? void 0 : stripeOptions.fonts
+  };
+  return /*#__PURE__*/external_react_default().createElement(react_stripe_js_namespaceObject.Elements, {
+    options: options,
+    stripe: stripePromise
+  }, /*#__PURE__*/external_react_default().createElement(stripe_form, {
+    reservation: reservation,
+    payTicket: payTicket,
+    userProfile: userProfile,
+    stripeOptions: stripeOptions,
+    provider: provider
+  }));
+};
+
+/* harmony default export */ const stripe_component = (stripe_component_StripeProvider);
+;// CONCATENATED MODULE: external "react-helmet"
+const external_react_helmet_namespaceObject = require("react-helmet");
 ;// CONCATENATED MODULE: ./src/components/payment/index.js
 function payment_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -1003,13 +1478,16 @@ function payment_defineProperty(obj, key, value) { if (key in obj) { Object.defi
 
 
 
+
 const PaymentComponent = ({
   isActive,
   userProfile,
   reservation,
   payTicket,
-  stripeKey,
-  stripeOptions
+  providerKey,
+  provider,
+  stripeOptions,
+  timestamp
 }) => {
   const [ref, {
     height
@@ -1028,9 +1506,6 @@ const PaymentComponent = ({
       marginBottom: isActive ? 5 : 0
     }
   });
-  const options = {
-    fonts: stripeOptions === null || stripeOptions === void 0 ? void 0 : stripeOptions.fonts
-  };
   return /*#__PURE__*/external_react_default().createElement("div", {
     className: `${payment_index_module.outerWrapper} step-wrapper`
   }, /*#__PURE__*/external_react_default().createElement((external_react_default()).Fragment, null, /*#__PURE__*/external_react_default().createElement("div", {
@@ -1039,24 +1514,30 @@ const PaymentComponent = ({
     className: payment_index_module.title
   }, /*#__PURE__*/external_react_default().createElement("span", null, "Payment")), /*#__PURE__*/external_react_default().createElement(external_react_spring_namespaceObject.animated.div, {
     style: payment_objectSpread({
-      overflow: 'hidden'
+      overflow: `${isActive ? '' : 'hidden'}`
     }, toggleAnimation)
   }, /*#__PURE__*/external_react_default().createElement("div", {
     ref: ref
-  }, /*#__PURE__*/external_react_default().createElement(react_stripe_js_namespaceObject.Elements, {
-    options: options,
-    stripe: stripeKey
-  }, /*#__PURE__*/external_react_default().createElement(stripe_form, {
+  }, provider === 'Stripe' && /*#__PURE__*/external_react_default().createElement(stripe_component, {
+    provider: provider,
+    providerKey: providerKey,
     reservation: reservation,
     payTicket: payTicket,
     userProfile: userProfile,
     stripeOptions: stripeOptions
+  }), provider === 'LawPay' && /*#__PURE__*/external_react_default().createElement((external_react_default()).Fragment, null, /*#__PURE__*/external_react_default().createElement(external_react_helmet_namespaceObject.Helmet, null, /*#__PURE__*/external_react_default().createElement("script", {
+    src: "https://cdn.affinipay.com/hostedfields/1.1.1/fieldGen_1.1.1.js"
+  })), /*#__PURE__*/external_react_default().createElement(lawpay_form, {
+    provider: provider,
+    reservation: reservation,
+    payTicket: payTicket,
+    userProfile: userProfile,
+    providerKey: providerKey,
+    timestamp: timestamp
   })))))));
 };
 
 /* harmony default export */ const payment = (PaymentComponent);
-;// CONCATENATED MODULE: external "openstack-uicore-foundation/lib/components"
-const components_namespaceObject = require("openstack-uicore-foundation/lib/components");
 ;// CONCATENATED MODULE: external "react-tooltip"
 const external_react_tooltip_namespaceObject = require("react-tooltip");
 var external_react_tooltip_default = /*#__PURE__*/__webpack_require__.n(external_react_tooltip_namespaceObject);
@@ -1634,8 +2115,6 @@ const ButtonBarComponent = ({
 ;// CONCATENATED MODULE: ./src/components/purchase-complete/index.module.scss
 // extracted by mini-css-extract-plugin
 /* harmony default export */ const purchase_complete_index_module = ({"button":"button___XMN8a","wrapper":"wrapper___Jd5Xg","circle":"circle___lcN86","complete":"complete___HAHzl","actions":"actions___jJdPX","footer":"footer___FL9TW"});
-;// CONCATENATED MODULE: external "openstack-uicore-foundation/lib/utils/methods"
-const methods_namespaceObject = require("openstack-uicore-foundation/lib/utils/methods");
 ;// CONCATENATED MODULE: ./src/components/purchase-complete/index.js
 /**
  * Copyright 2020 OpenStack Foundation
@@ -1783,7 +2262,7 @@ const PasswordlessLoginComponent = ({
     className: `${login_passwordless_index_module.button} button`,
     onClick: () => tryPasswordlessLogin(otpCode),
     "data-testid": "verify"
-  }, "Verify"), /*#__PURE__*/external_react_default().createElement("b", null, "or go back and ", /*#__PURE__*/external_react_default().createElement("span", {
+  }, "Verify Email"), /*#__PURE__*/external_react_default().createElement("b", null, "or go back and ", /*#__PURE__*/external_react_default().createElement("span", {
     className: login_passwordless_index_module.link,
     onClick: () => goToLogin(),
     "data-testid": "go-back"
@@ -1835,7 +2314,7 @@ const TicketOwnedComponent = ({
 
 /* harmony default export */ const ticket_owned = (TicketOwnedComponent);
 ;// CONCATENATED MODULE: ./src/components/registration-lite.js
-const registration_lite_excluded = ["loadSession", "setMarketingSettings", "changeStep", "removeReservedTicket", "reserveTicket", "payTicket", "onPurchaseComplete", "getTicketTypes", "getTaxesTypes", "getLoginCode", "passwordlessLogin", "goToLogin", "loginOptions", "allowsNativeAuth", "allowsOtpAuth", "reservation", "checkout", "ticketTypes", "taxTypes", "step", "passwordlessCodeSent", "passwordlessEmail", "passwordlessCode", "getPasswordlessCode", "passwordlessCodeError", "loginWithCode", "goToExtraQuestions", "goToEvent", "goToRegistration", "profileData", "summitData", "supportEmail", "ticketOwned", "ownedTickets", "widgetLoading", "loading", "inPersonDisclaimer", "userProfile", "handleCompanyError", "stripeOptions"];
+const registration_lite_excluded = ["loadSession", "setMarketingSettings", "changeStep", "removeReservedTicket", "reserveTicket", "payTicketWithProvider", "onPurchaseComplete", "getTicketTypes", "getTaxesTypes", "getLoginCode", "passwordlessLogin", "goToLogin", "loginOptions", "allowsNativeAuth", "allowsOtpAuth", "reservation", "checkout", "ticketTypes", "taxTypes", "step", "passwordlessCodeSent", "passwordlessEmail", "passwordlessCode", "getPasswordlessCode", "passwordlessCodeError", "loginWithCode", "goToExtraQuestions", "goToEvent", "goToRegistration", "profileData", "summitData", "supportEmail", "ticketOwned", "ownedTickets", "widgetLoading", "loading", "inPersonDisclaimer", "userProfile", "handleCompanyError", "stripeOptions"];
 
 function registration_lite_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -1876,7 +2355,6 @@ function registration_lite_objectWithoutPropertiesLoose(source, excluded) { if (
 
 
 
-
 const RegistrationLite = _ref => {
   var _formValues$ticketTyp, _formValues$ticketTyp2;
 
@@ -1886,7 +2364,7 @@ const RegistrationLite = _ref => {
     changeStep,
     removeReservedTicket,
     reserveTicket,
-    payTicket,
+    payTicketWithProvider,
     onPurchaseComplete,
     getTicketTypes,
     getTaxesTypes,
@@ -1947,15 +2425,16 @@ const RegistrationLite = _ref => {
   }));
 
   let publicKey = null;
+  let provider = '';
 
   for (let profile of summitData.payment_profiles) {
     if (profile.application_type === 'Registration') {
       publicKey = profile.test_mode_enabled ? profile.test_publishable_key : profile.live_publishable_key;
+      provider = profile.provider;
       break;
     }
   }
 
-  const stripePromise = (0,external_react_namespaceObject.useMemo)(() => (0,stripe_js_namespaceObject.loadStripe)(publicKey), [publicKey]);
   (0,external_react_namespaceObject.useEffect)(() => {
     loadSession(registration_lite_objectSpread(registration_lite_objectSpread({}, rest), {}, {
       summitData,
@@ -2010,12 +2489,12 @@ const RegistrationLite = _ref => {
   };
 
   return /*#__PURE__*/external_react_default().createElement("div", {
-    id: "modal",
+    id: `${general_module.modal}`,
     className: "modal is-active"
   }, /*#__PURE__*/external_react_default().createElement("div", {
     className: "modal-background"
   }), /*#__PURE__*/external_react_default().createElement("div", {
-    className: "modal-content"
+    className: `${general_module.modal} modal-content`
   }, /*#__PURE__*/external_react_default().createElement((ajaxloader_default()), {
     relative: true,
     color: '#ffffff',
@@ -2077,9 +2556,11 @@ const RegistrationLite = _ref => {
   }, /*#__PURE__*/external_react_default().createElement(payment, {
     isActive: step === 2,
     reservation: reservation,
-    payTicket: payTicket,
+    payTicket: payTicketWithProvider,
     userProfile: profileData,
-    stripeKey: stripePromise,
+    timestamp: summitData.timestamp,
+    provider: provider,
+    providerKey: publicKey,
     stripeOptions: stripeOptions
   })))), profileData && step === 3 && /*#__PURE__*/external_react_default().createElement(purchase_complete, {
     checkout: checkout,
@@ -2118,7 +2599,7 @@ const registration_lite_mapStateToProps = ({
   changeStep: changeStep,
   reserveTicket: reserveTicket,
   removeReservedTicket: removeReservedTicket,
-  payTicket: payTicket,
+  payTicketWithProvider: payTicketWithProvider,
   getTicketTypes: getTicketTypes,
   getTaxesTypes: getTaxesTypes,
   getLoginCode: getLoginCode,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "summit-registration-lite",
-  "version": "2.0.11",
+  "version": "2.0.14",
   "description": "Summit Registration Lite",
   "main": "index.js",
   "scripts": {
@@ -46,6 +46,7 @@
     "crypto-js": "^4.1.1",
     "css-loader": "^6.7.1",
     "dotenv-webpack": "^7.1.0",
+    "dropzone": "^6.0.0-beta.2",
     "file-loader": "^6.2.0",
     "font-awesome": "4.7.0",
     "history": "^4.7.2",
@@ -65,10 +66,14 @@
     "react": "^16.8.4",
     "react-bootstrap": "^0.33.1",
     "react-datetime": "^2.15.0",
+    "react-dnd": "^16.0.1",
+    "react-dnd-html5-backend": "^16.0.1",
     "react-dom": "^16.4.1",
+    "react-dropzone": "^14.2.1",
     "react-redux": "^7.2.0",
     "react-router": "^4.3.1",
     "react-router-dom": "^4.3.1",
+    "react-rte": "^0.16.5",
     "react-select": "^2.4.3",
     "react-test-renderer": "^17.0.2",
     "react-tooltip": "^3.11.6",
@@ -85,6 +90,7 @@
     "timesync": "^1.0.5",
     "urijs": "^1.19.1",
     "url-loader": "^4.1.1",
+    "video.js": "^7.19.2",
     "webpack": "^5.70.0",
     "webpack-cli": "^4.9.2",
     "webpack-dev-server": "^4.7.4",
@@ -122,6 +128,7 @@
   "dependencies": {
     "@stripe/react-stripe-js": "^1.4.1",
     "@stripe/stripe-js": "^1.15.0",
+    "react-helmet": "^6.1.0",
     "react-hook-form": "^7.6.7",
     "react-otp-input": "^2.4.0",
     "react-spring": "^9.1.2",