tf-checkout-react 1.0.78 → 1.0.82

package/dist/components/billing-info-container/index.d.ts

@@ -4,7 +4,7 @@ import { FormikHelpers, FormikValues } from 'formik';
 import './style.css';
 import { IBillingInfoData } from '../../types';
 import { ThemeOptions } from '@mui/material';
-import { CSSProperties } from '@mui/styled-engine';
+import { CSSProperties } from '@mui/styles';
 export interface IBillingInfoPage {
     data?: IBillingInfoData[];
     ticketHoldersFields?: IBillingInfoData;
@@ -27,6 +27,7 @@ export interface IBillingInfoPage {
     onAuthorizeError?: (e: AxiosError) => void;
     onLogin?: () => void;
     onLoginSuccess?: () => void;
+    onErrorClose?: () => void;
     initialValues?: FormikValues;
     buttonName?: string;
     theme?: 'light' | 'dark';
@@ -38,4 +39,4 @@ export interface IBillingInfoPage {
         checkbox?: CSSProperties;
     };
 }
-export declare const BillingInfoContainer: ({ data, ticketHoldersFields, initialValues, buttonName, handleSubmit, theme, onRegisterSuccess, onRegisterError, onSubmitError, onGetCartSuccess, onGetCartError, onGetCountriesSuccess, onGetCountriesError, onGetStatesSuccess, onGetStatesError, onGetProfileDataSuccess, onGetProfileDataError, onAuthorizeSuccess, onAuthorizeError, onLogin, onLoginSuccess, isLoggedIn: pIsLoggedIn, accountInfoTitle, hideLogo, themeOptions }: IBillingInfoPage) => JSX.Element;
+export declare const BillingInfoContainer: ({ data, ticketHoldersFields, initialValues, buttonName, handleSubmit, theme, onRegisterSuccess, onRegisterError, onSubmitError, onGetCartSuccess, onGetCartError, onGetCountriesSuccess, onGetCountriesError, onGetStatesSuccess, onGetStatesError, onGetProfileDataSuccess, onGetProfileDataError, onAuthorizeSuccess, onAuthorizeError, onLogin, onLoginSuccess, isLoggedIn: pIsLoggedIn, accountInfoTitle, hideLogo, themeOptions, onErrorClose }: IBillingInfoPage) => JSX.Element;

package/dist/components/paymentContainer/index.d.ts

@@ -1,9 +1,11 @@
-import { CSSProperties } from 'react';
+/// <reference types="react" />
 import { AxiosError } from 'axios';
+import { StripeElementsOptions } from '@stripe/stripe-js';
 import './style.css';
 import { IPaymentField } from '../../types';
 import { StripeCardNumberElementOptions } from '@stripe/stripe-js';
 import { ThemeOptions } from '@mui/material';
+import { CSSProperties } from "@mui/styles";
 export interface IPaymentPage {
     paymentFields: IPaymentField[];
     handlePayment: any;
@@ -20,5 +22,6 @@ export interface IPaymentPage {
         input?: CSSProperties;
         checkbox?: CSSProperties;
     };
+    elementsOptions?: StripeElementsOptions;
 }
-export declare const PaymentContainer: ({ paymentFields, handlePayment, formTitle, errorText, checkoutData, onErrorClose, onGetPaymentDataSuccess, onGetPaymentDataError, onPaymentError, stripeCardOptions, disableZipSection, themeOptions, }: IPaymentPage) => JSX.Element;
+export declare const PaymentContainer: ({ paymentFields, handlePayment, formTitle, errorText, checkoutData, onErrorClose, onGetPaymentDataSuccess, onGetPaymentDataError, onPaymentError, stripeCardOptions, disableZipSection, themeOptions, elementsOptions }: IPaymentPage) => JSX.Element;

package/dist/components/ticketsContainer/PromoCodeSection.d.ts

@@ -5,8 +5,9 @@ export interface IPromoCodeSectionProps {
     showPromoInput: boolean;
     isPromotionsEnabled: boolean;
     isAllTicketsSoldOut: boolean;
+    isAccessCodeEnabled?: boolean;
     setPromoCode: (value: string) => void;
     setPromoCodeUpdated: (value: string) => void;
     setShowPromoInput: (value: boolean) => void;
 }
-export declare const PromoCodeSection: ({ promoCode, promoCodeIsApplied, showPromoInput, isPromotionsEnabled, isAllTicketsSoldOut, setPromoCode, setPromoCodeUpdated, setShowPromoInput, }: IPromoCodeSectionProps) => JSX.Element;
+export declare const PromoCodeSection: ({ promoCode, promoCodeIsApplied, showPromoInput, isPromotionsEnabled, setPromoCode, setPromoCodeUpdated, setShowPromoInput, isAccessCodeEnabled, }: IPromoCodeSectionProps) => JSX.Element;

package/dist/components/ticketsContainer/index.d.ts

@@ -1,6 +1,8 @@
 import React from 'react';
 import { AxiosError } from 'axios';
 import './style.css';
+import { ThemeOptions } from '@mui/material';
+import { CSSProperties } from '@mui/styles';
 interface CartSuccess {
     skip_billing_page: boolean;
     names_required: boolean;
@@ -20,6 +22,12 @@ export interface IGetTickets {
     theme?: 'light' | 'dark';
     queryPromoCode?: string;
     isPromotionsEnabled?: boolean;
+    themeOptions?: ThemeOptions & {
+        input?: CSSProperties;
+        checkbox?: CSSProperties;
+    };
+    isAccessCodeEnabled?: boolean;
+    hideSessionButtons?: boolean;
 }
 export interface ITicket {
     id: string | number;
@@ -28,5 +36,5 @@ export interface ITicket {
 export interface ISelectedTickets {
     [key: string]: string | number;
 }
-export declare const TicketsContainer: ({ onLoginSuccess, getTicketsLabel, eventId, onAddToCartSuccess, contentStyle, onAddToCartError, onGetTicketsSuccess, onGetTicketsError, theme, queryPromoCode, isPromotionsEnabled, }: IGetTickets) => JSX.Element;
+export declare const TicketsContainer: ({ onLoginSuccess, getTicketsLabel, eventId, onAddToCartSuccess, contentStyle, onAddToCartError, onGetTicketsSuccess, onGetTicketsError, theme, queryPromoCode, isPromotionsEnabled, themeOptions, isAccessCodeEnabled, hideSessionButtons }: IGetTickets) => JSX.Element;
 export {};

package/dist/hooks/usePrevious.d.ts

@@ -0,0 +1 @@
+export declare const usePrevious: <T extends unknown>(value: T) => T | undefined;

package/dist/tf-checkout-react.cjs.development.js

@@ -12,6 +12,7 @@ var _identity = _interopDefault(require('lodash/identity'));
 var _map = _interopDefault(require('lodash/map'));
 var _get = _interopDefault(require('lodash/get'));
 var _includes = _interopDefault(require('lodash/includes'));
+var _isEqual = _interopDefault(require('lodash/isEqual'));
 var axios = _interopDefault(require('axios'));
 var _forEach = _interopDefault(require('lodash/forEach'));
 var material = require('@mui/material');
@@ -45,6 +46,7 @@ var FormControl = _interopDefault(require('@mui/material/FormControl'));
 var MenuItem = _interopDefault(require('@mui/material/MenuItem'));
 var SVG = _interopDefault(require('react-inlinesvg'));
 var moment = _interopDefault(require('moment-timezone'));
+var privateTheming = require('@mui/private-theming');
 var Table = _interopDefault(require('@mui/material/Table'));
 var TableBody = _interopDefault(require('@mui/material/TableBody'));
 var TableCell = _interopDefault(require('@mui/material/TableCell'));
@@ -1005,7 +1007,7 @@ var downloadPDF = function downloadPDF(pdfUrl) {
     }
   }).then( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee(response) {
-      var blobValue;
+      var blobValue, fileNameHeader, fileName;
       return runtime_1.wrap(function _callee$(_context) {
         while (1) {
           switch (_context.prev = _context.next) {
@@ -1015,9 +1017,14 @@ var downloadPDF = function downloadPDF(pdfUrl) {
 
             case 2:
               blobValue = _context.sent;
-              return _context.abrupt("return", blobValue);
+              fileNameHeader = response.headers.get("content-disposition") || '';
+              fileName = fileNameHeader.split('"')[1];
+              return _context.abrupt("return", {
+                blobValue: blobValue,
+                fileName: fileName
+              });
 
-            case 4:
+            case 6:
             case "end":
               return _context.stop();
           }
@@ -1028,12 +1035,20 @@ var downloadPDF = function downloadPDF(pdfUrl) {
     return function (_x) {
       return _ref.apply(this, arguments);
     };
-  }()).then(function (blobValue) {
+  }()).then(function (_ref2) {
+    var blobValue = _ref2.blobValue,
+        fileName = _ref2.fileName;
+    if (!fileName) return;
     var file = new Blob([blobValue], {
       type: 'application/pdf'
     });
     var fileURL = URL.createObjectURL(file);
-    window.open(fileURL);
+    var link = document.createElement('a');
+    link.href = fileURL;
+    link.setAttribute('download', fileName);
+    document.body.appendChild(link);
+    link.click();
+    document.body.removeChild(link);
   });
 };
 
@@ -1906,18 +1921,22 @@ var CustomField = function CustomField(_ref) {
 
 var _excluded$1 = ["label", "field", "selectOptions", "theme", "setFieldValue"];
 var CheckboxField = function CheckboxField(_ref) {
+  var _rest$form, _field$name, _rest$form2, _field$name2;
+
   var label = _ref.label,
       field = _ref.field,
       rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
 
   var customTheme = styles.useTheme();
-  return React__default.createElement(FormGroup, null, React__default.createElement(FormControlLabel, {
+  return React__default.createElement(material.FormControl, {
+    error: !!(rest != null && (_rest$form = rest.form) != null && _rest$form.errors && rest.form.errors[(_field$name = field == null ? void 0 : field.name) != null ? _field$name : ""])
+  }, React__default.createElement(FormGroup, null, React__default.createElement(FormControlLabel, {
     control: React__default.createElement(Checkbox, Object.assign({}, field, rest)),
     label: label,
     componentsProps: {
       typography: customTheme == null ? void 0 : customTheme.checkbox
     }
-  }));
+  })), !!(rest != null && (_rest$form2 = rest.form) != null && _rest$form2.errors && rest.form.errors[(_field$name2 = field == null ? void 0 : field.name) != null ? _field$name2 : ""]) ? React__default.createElement(material.FormHelperText, null, "Required") : null);
 };
 
 var SelectField = function SelectField(_ref) {
@@ -2082,6 +2101,14 @@ var FormikPhoneNumberField = function FormikPhoneNumberField(_ref) {
   }, rest));
 };
 
+var usePrevious = function usePrevious(value) {
+  var ref = React.useRef();
+  React.useEffect(function () {
+    ref.current = value;
+  });
+  return ref.current;
+};
+
 var LogicRunner = function LogicRunner(_ref) {
   var values = _ref.values,
       setStates = _ref.setStates,
@@ -2219,7 +2246,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
       _ref3$onGetStatesErro = _ref3.onGetStatesError,
       onGetStatesError = _ref3$onGetStatesErro === void 0 ? function () {} : _ref3$onGetStatesErro,
       _ref3$onGetProfileDat = _ref3.onGetProfileDataSuccess,
-      onGetProfileDataSuccess = _ref3$onGetProfileDat === void 0 ? function () {} : _ref3$onGetProfileDat,
+      _onGetProfileDataSuccess = _ref3$onGetProfileDat === void 0 ? function () {} : _ref3$onGetProfileDat,
       _ref3$onGetProfileDat2 = _ref3.onGetProfileDataError,
       onGetProfileDataError = _ref3$onGetProfileDat2 === void 0 ? function () {} : _ref3$onGetProfileDat2,
       _ref3$onAuthorizeSucc = _ref3.onAuthorizeSuccess,
@@ -2234,7 +2261,10 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
       _ref3$accountInfoTitl = _ref3.accountInfoTitle,
       accountInfoTitle = _ref3$accountInfoTitl === void 0 ? '' : _ref3$accountInfoTitl,
       hideLogo = _ref3.hideLogo,
-      themeOptions = _ref3.themeOptions;
+      themeOptions = _ref3.themeOptions,
+      _ref3$onErrorClose = _ref3.onErrorClose,
+      onErrorClose = _ref3$onErrorClose === void 0 ? function () {} : _ref3$onErrorClose;
+
   var themeMui = styles$1.createTheme(themeOptions);
   var isWindowDefined = typeof window !== 'undefined';
   var userData = isWindowDefined && window.localStorage.getItem('user_data') ? JSON.parse(window.localStorage.getItem('user_data') || '') : {};
@@ -2298,6 +2328,10 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
       userValues = _useState11[0],
       setUserValues = _useState11[1];
 
+  var _useState12 = React.useState(null),
+      error = _useState12[0],
+      setError = _useState12[1];
+
   var emailLogged = _get(userData, 'email', '') || _get(userValues, 'email', '');
 
   var firstNameLogged = _get(userData, 'first_name', '') || _get(userValues, 'first_name', '');
@@ -2309,9 +2343,14 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
 
   var optedInFieldValue = _get(cartInfoData, 'optedIn', false);
 
-  var hideTtfOptIn = _get(cartInfoData, 'hide_ttf_opt_in', true);
+  var ttfOptIn = _get(cartInfoData, 'ttfOptIn', false);
+
+  var hideTtfOptIn = _get(cartInfoData, 'hide_ttf_opt_in', true); // Get prevProps
+
+
+  var prevData = usePrevious(data);
 
-  if (!_get(dataWithUniqueIds, '[0].uniqueId')) {
+  if (!_get(dataWithUniqueIds, '[0].uniqueId') || !_isEqual(prevData, data)) {
     setDataWithUniqueIds(assingUniqueIds(data));
   }
 
@@ -2466,7 +2505,8 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
                 lastName: profileDataObj.last_name
               }));
               window.localStorage.setItem('user_data', JSON.stringify(profileDataObj));
-              onGetProfileDataSuccess(userDataResponse.data);
+
+              _onGetProfileDataSuccess(userDataResponse.data);
 
             case 10:
               _context4.next = 15;
@@ -2502,12 +2542,13 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
     initialValues: getInitialValues(dataWithUniqueIds, _extends({}, initialValues, {
       country: _get(userData, 'country', '') || "1",
       state: _get(userData, 'state', '') || "1",
-      brand_opt_in: optedInFieldValue
+      brand_opt_in: optedInFieldValue,
+      ttf_opt_in: ttfOptIn
     }), userValues),
     enableReinitialize: true,
     onSubmit: function () {
       var _onSubmit = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee5(values, formikHelpers) {
-        var updatedUserData, _profileSpecifiedData, _profileDataObj, _checkoutBody, _res, checkoutBodyForRegistration, bodyFormData, access_token_register, resRegister, refreshToken, tokens, _e$response, _e$response$data, error, profileData, profileSpecifiedData, profileDataObj, checkoutBody, res, _e$response2;
+        var updatedUserData, _profileSpecifiedData, _profileDataObj, _checkoutBody, _res, checkoutBodyForRegistration, bodyFormData, access_token_register, resRegister, refreshToken, tokens, _e$response, _e$response$data, _error, profileData, profileSpecifiedData, profileDataObj, checkoutBody, res, _e$response2, _e$response3;
 
         return runtime_1.wrap(function _callee5$(_context5) {
           while (1) {
@@ -2516,7 +2557,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
                 _context5.prev = 0;
 
                 if (!isLoggedIn) {
-                  _context5.next = 15;
+                  _context5.next = 17;
                   break;
                 }
 
@@ -2548,10 +2589,14 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
 
               case 12:
                 _res = _context5.sent;
+                _context5.next = 15;
+                return getPaymentData(_res.data.data.attributes.hash);
+
+              case 15:
                 handleSubmit(values, formikHelpers, eventId, _res);
                 return _context5.abrupt("return");
 
-              case 15:
+              case 17:
                 checkoutBodyForRegistration = createCheckoutDataBody(ticketsQuantity.length, values, {
                   emailLogged: emailLogged,
                   firstNameLogged: firstNameLogged,
@@ -2559,11 +2604,11 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
                 }, showDOB);
                 bodyFormData = createRegisterFormData(values, checkoutBodyForRegistration);
                 access_token_register = null;
-                _context5.prev = 18;
-                _context5.next = 21;
+                _context5.prev = 20;
+                _context5.next = 23;
                 return register(bodyFormData);
 
-              case 21:
+              case 23:
                 resRegister = _context5.sent;
                 access_token_register = _get(resRegister, 'data.data.attributes.access_token');
                 refreshToken = _get(resRegister, 'data.data.attributes.refresh_token');
@@ -2573,26 +2618,26 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
                   refreshToken: refreshToken
                 };
                 onRegisterSuccess(tokens);
-                _context5.next = 33;
+                _context5.next = 35;
                 break;
 
-              case 29:
-                _context5.prev = 29;
-                _context5.t0 = _context5["catch"](18);
+              case 31:
+                _context5.prev = 31;
+                _context5.t0 = _context5["catch"](20);
 
                 if (axios.isAxiosError(_context5.t0)) {
-                  error = _context5.t0 == null ? void 0 : (_e$response = _context5.t0.response) == null ? void 0 : (_e$response$data = _e$response.data) == null ? void 0 : _e$response$data.message;
+                  _error = _context5.t0 == null ? void 0 : (_e$response = _context5.t0.response) == null ? void 0 : (_e$response$data = _e$response.data) == null ? void 0 : _e$response$data.message;
 
-                  if (_includes(error, 'You must be aged')) {
-                    formikHelpers.setFieldError('holderAge', error);
+                  if (_includes(_error, 'You must be aged')) {
+                    formikHelpers.setFieldError('holderAge', _error);
                   }
 
-                  if (error != null && error.password) {
-                    formikHelpers.setFieldError('password', error.password);
-                    formikHelpers.setFieldError('confirmPassword', error.password);
+                  if (_error != null && _error.password) {
+                    formikHelpers.setFieldError('password', _error.password);
+                    formikHelpers.setFieldError('confirmPassword', _error.password);
                   }
 
-                  if (error != null && error.email && !onLogin) {
+                  if (_error != null && _error.email && !onLogin) {
                     // False will stand for outside controll
                     setAlreadyHasUser(true);
                     setShowModalLogin(true);
@@ -2603,11 +2648,11 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
 
                 return _context5.abrupt("return");
 
-              case 33:
-                _context5.next = 35;
+              case 35:
+                _context5.next = 37;
                 return getProfileData(access_token_register);
 
-              case 35:
+              case 37:
                 profileData = _context5.sent;
                 profileSpecifiedData = _get(profileData, 'data.data');
                 profileDataObj = setLoggedUserData(profileSpecifiedData);
@@ -2621,17 +2666,21 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
                   firstNameLogged: firstNameLogged,
                   lastNameLogged: lastNameLogged
                 }, showDOB);
-                _context5.next = 42;
+                _context5.next = 44;
                 return postOnCheckout(checkoutBody, access_token_register);
 
-              case 42:
+              case 44:
                 res = _context5.sent;
+                _context5.next = 47;
+                return getPaymentData(res.data.data.attributes.hash);
+
+              case 47:
                 handleSubmit(values, formikHelpers, eventId, res);
-                _context5.next = 49;
+                _context5.next = 53;
                 break;
 
-              case 46:
-                _context5.prev = 46;
+              case 50:
+                _context5.prev = 50;
                 _context5.t1 = _context5["catch"](0);
 
                 if (axios.isAxiosError(_context5.t1)) {
@@ -2644,15 +2693,23 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
                     }
                   }
 
+                  if ((_e$response3 = _context5.t1.response) != null && _e$response3.data.message) {
+                    if (typeof document !== undefined) {
+                      document.body.scrollTop = document.documentElement.scrollTop = 0;
+                    }
+
+                    setError(_get(_context5.t1, 'response.data.message'));
+                  }
+
                   onSubmitError(_context5.t1);
                 }
 
-              case 49:
+              case 53:
               case "end":
                 return _context5.stop();
             }
           }
-        }, _callee5, null, [[0, 46], [18, 29]]);
+        }, _callee5, null, [[0, 50], [20, 31]]);
       }));
 
       function onSubmit(_x2, _x3) {
@@ -2674,7 +2731,11 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
       onGetStatesError: onGetStatesError
     }), React__default.createElement("div", {
       className: "billing-info-container " + theme
-    }, !isLoggedIn && React__default.createElement("div", {
+    }, error && React__default.createElement(material.Alert, {
+      severity: "error",
+      onClose: onErrorClose,
+      variant: "filled"
+    }, error), !isLoggedIn && React__default.createElement("div", {
       className: "account-actions-block"
     }, React__default.createElement("div", null, accountInfoTitle), React__default.createElement("div", null, "Login & skip ahead:"), React__default.createElement("div", {
       className: "login-block"
@@ -2746,13 +2807,13 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
         var groupClassname = group.groupClassname,
             groupItems = group.groupItems;
         return React__default.createElement("div", {
-          key: group.uniqueId
+          key: group.id
         }, React__default.createElement("div", {
           className: groupClassname
         }, _map(groupItems, function (element) {
           return React__default.createElement("div", {
             className: element.className,
-            key: element.uniqueId
+            key: element.name
           }, React__default.createElement(formik.Field, {
             name: element.name + "-" + index,
             label: element.label,
@@ -2786,7 +2847,11 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
     userExpired: userExpired,
     onAuthorizeSuccess: onAuthorizeSuccess,
     onAuthorizeError: onAuthorizeError,
-    onGetProfileDataSuccess: onGetProfileDataSuccess,
+    onGetProfileDataSuccess: function onGetProfileDataSuccess(data) {
+      fetchCart();
+
+      _onGetProfileDataSuccess(data);
+    },
     onGetProfileDataError: onGetProfileDataError
   }), showModalRegister && React__default.createElement(RegisterModal, {
     onClose: function onClose() {
@@ -2795,7 +2860,11 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
     onRegister: function onRegister() {
       setShowModalRegister(false);
     },
-    onGetProfileDataSuccess: onGetProfileDataSuccess,
+    onGetProfileDataSuccess: function onGetProfileDataSuccess(data) {
+      fetchCart();
+
+      _onGetProfileDataSuccess(data);
+    },
     onGetProfileDataError: onGetProfileDataError
   }));
 };
@@ -3019,7 +3088,7 @@ var CheckoutForm = function CheckoutForm(_ref) {
   }, React__default.createElement("span", {
     className: "card_label_text"
   }, "Card number"), React__default.createElement(reactStripeJs.CardNumberElement, {
-    options: _extends({}, options.style, stripeCardOptions),
+    options: _extends({}, options, stripeCardOptions),
     onReady: _identity,
     onChange: _identity,
     onBlur: _identity,
@@ -3029,13 +3098,13 @@ var CheckoutForm = function CheckoutForm(_ref) {
   }, React__default.createElement("span", {
     className: "card_label_text"
   }, "Expiration date"), React__default.createElement(reactStripeJs.CardExpiryElement, {
-    options: _extends({}, options.style, stripeCardOptions)
+    options: _extends({}, options, stripeCardOptions)
   })), React__default.createElement("label", {
     className: "cvc_element"
   }, React__default.createElement("span", {
     className: "card_label_text"
   }, "CVC"), React__default.createElement(reactStripeJs.CardCvcElement, {
-    options: _extends({}, options.style, stripeCardOptions)
+    options: _extends({}, options, stripeCardOptions)
   })), !disableZipSection && React__default.createElement("label", {
     className: "zip_element"
   }, React__default.createElement("p", {
@@ -3127,7 +3196,8 @@ var PaymentContainer = function PaymentContainer(_ref) {
       stripeCardOptions = _ref$stripeCardOption === void 0 ? {} : _ref$stripeCardOption,
       _ref$disableZipSectio = _ref.disableZipSection,
       disableZipSection = _ref$disableZipSectio === void 0 ? false : _ref$disableZipSectio,
-      themeOptions = _ref.themeOptions;
+      themeOptions = _ref.themeOptions,
+      elementsOptions = _ref.elementsOptions;
 
   var _useState = React.useState(initialReviewValues),
       reviewData = _useState[0],
@@ -3348,7 +3418,8 @@ var PaymentContainer = function PaymentContainer(_ref) {
   }, "Please provide your payment information"), showErrorText && React__default.createElement("p", {
     className: "payment_info__error"
   }, errorText), React__default.createElement("div", null, React__default.createElement(reactStripeJs.Elements, {
-    stripe: getStripePromise(reviewData)
+    stripe: getStripePromise(reviewData),
+    options: elementsOptions
   }, React__default.createElement(CheckoutForm, {
     stripe_client_secret: _get(reviewData, 'payment_method.stripe_client_secret'),
     total: orderData.total,
@@ -4023,10 +4094,42 @@ var PromoCodeSection = function PromoCodeSection(_ref) {
       promoCodeIsApplied = _ref.promoCodeIsApplied,
       showPromoInput = _ref.showPromoInput,
       isPromotionsEnabled = _ref.isPromotionsEnabled,
-      isAllTicketsSoldOut = _ref.isAllTicketsSoldOut,
       setPromoCode = _ref.setPromoCode,
       setPromoCodeUpdated = _ref.setPromoCodeUpdated,
-      setShowPromoInput = _ref.setShowPromoInput;
+      setShowPromoInput = _ref.setShowPromoInput,
+      isAccessCodeEnabled = _ref.isAccessCodeEnabled;
+  var isPromoCodeHasValue = !!promoCode.trim();
+
+  var renderInputField = function renderInputField() {
+    return React__default.createElement("div", {
+      className: "promo-code-block"
+    }, React__default.createElement("div", {
+      className: "promo-code-block"
+    }, React__default.createElement("p", {
+      className: "promo-code-text"
+    }, isAccessCodeEnabled ? 'Access code required' : 'Promo code')), React__default.createElement("input", {
+      className: "promo-code-input",
+      placeholder: "",
+      onChange: function onChange(e) {
+        setPromoCode(e.target.value);
+      },
+      onKeyPress: function onKeyPress(event) {
+        if (event.key === 'Enter' && isPromoCodeHasValue) {
+          setPromoCodeUpdated(promoCode);
+          setShowPromoInput(false);
+        }
+      }
+    }), React__default.createElement(Button$1, {
+      className: "promo-submit-button",
+      onClick: function onClick() {
+        if (isPromoCodeHasValue) {
+          setPromoCodeUpdated(promoCode);
+          setShowPromoInput(false);
+        }
+      }
+    }, isAccessCodeEnabled ? 'ENTER' : 'APPLY'));
+  };
+
   return React__default.createElement("div", null, promoCodeIsApplied ? React__default.createElement("div", {
     className: "alert-info"
   }, React__default.createElement(SVG, {
@@ -4036,33 +4139,13 @@ var PromoCodeSection = function PromoCodeSection(_ref) {
     }
   }), React__default.createElement("p", {
     className: "promo-code-success"
-  }, "PROMO CODE APPLIED SUCCESSFULLY")) : null, showPromoInput && React__default.createElement("div", {
-    className: "promo-code-block"
-  }, React__default.createElement("label", null, "PROMO CODE"), React__default.createElement("input", {
-    placeholder: "",
-    onChange: function onChange(e) {
-      setPromoCode(e.target.value);
-    },
-    onKeyPress: function onKeyPress(event) {
-      if (event.key === 'Enter') {
-        setPromoCodeUpdated(promoCode);
-      }
-    }
-  }), React__default.createElement(Button$1, {
-    className: "promo-apply-button",
-    placeholder: "Promo Code",
-    onClick: function onClick() {
-      setPromoCodeUpdated(promoCode);
-    }
-  }, "Apply")), isPromotionsEnabled && !showPromoInput && isAllTicketsSoldOut && React__default.createElement("p", {
-    className: "promo-code-text"
-  }, "Access code needed"), isPromotionsEnabled && !showPromoInput ? React__default.createElement(Button$1, {
+  }, "PROMO CODE APPLIED SUCCESSFULLY")) : null, showPromoInput && renderInputField(), isPromotionsEnabled && !showPromoInput && !isAccessCodeEnabled ? React__default.createElement(Button$1, {
     className: "promo-code-button",
     placeholder: "Promo Codes",
     onClick: function onClick() {
       setShowPromoInput(true);
     }
-  }, "Got a promo code? Click here") : null);
+  }, "Got a promo code? Click here") : !isPromotionsEnabled && !showPromoInput && isAccessCodeEnabled && !promoCodeIsApplied ? renderInputField() : null);
 };
 
 var isTimeExpired = function isTimeExpired(startDate, timezone) {
@@ -4167,7 +4250,12 @@ var TicketsContainer = function TicketsContainer(_ref) {
       _ref$queryPromoCode = _ref.queryPromoCode,
       queryPromoCode = _ref$queryPromoCode === void 0 ? '' : _ref$queryPromoCode,
       _ref$isPromotionsEnab = _ref.isPromotionsEnabled,
-      isPromotionsEnabled = _ref$isPromotionsEnab === void 0 ? true : _ref$isPromotionsEnab;
+      isPromotionsEnabled = _ref$isPromotionsEnab === void 0 ? true : _ref$isPromotionsEnab,
+      themeOptions = _ref.themeOptions,
+      _ref$isAccessCodeEnab = _ref.isAccessCodeEnabled,
+      isAccessCodeEnabled = _ref$isAccessCodeEnab === void 0 ? false : _ref$isAccessCodeEnab,
+      _ref$hideSessionButto = _ref.hideSessionButtons,
+      hideSessionButtons = _ref$hideSessionButto === void 0 ? false : _ref$hideSessionButto;
 
   var _useState = React.useState({}),
       selectedTickets = _useState[0],
@@ -4298,6 +4386,7 @@ var TicketsContainer = function TicketsContainer(_ref) {
                 setTickets(_get(attributes, 'tickets'));
                 setShowWaitingList(attributes.showWaitingList);
                 onGetTicketsSuccess(response.data);
+                setPromoCode('');
               }
 
               if (eventResponse.data.success) {
@@ -4460,6 +4549,7 @@ var TicketsContainer = function TicketsContainer(_ref) {
   var isAllTicketsSoldOut = !_some(tickets, function (item) {
     return !(item.sold_out || item.soldOut);
   });
+  var themeMui = material.createTheme(themeOptions);
   React.useEffect(function () {
     isWindowDefined && window.document.addEventListener('custom-logout', handleLogout);
     return function () {
@@ -4472,7 +4562,9 @@ var TicketsContainer = function TicketsContainer(_ref) {
       isWindowDefined && window.document.removeEventListener('custom-login', handleExternalLogin);
     };
   }, []);
-  return React__default.createElement("div", {
+  return React__default.createElement(privateTheming.ThemeProvider, {
+    theme: themeMui
+  }, React__default.createElement("div", {
     className: "get-tickets-page " + theme,
     style: contentStyle
   }, isLoading ? React__default.createElement(Loader$1, null) : React__default.createElement("div", null, React__default.createElement(TicketsSection, {
@@ -4486,7 +4578,7 @@ var TicketsContainer = function TicketsContainer(_ref) {
     title: "Sales start in:",
     message: "No tickets are currently available for this event.",
     callback: updateTickets
-  }) : null, showWaitingList && React__default.createElement(WaitingList, {
+  }) : null, showWaitingList && event.salesStarted && React__default.createElement(WaitingList, {
     tickets: tickets,
     eventId: eventId
   }), React__default.createElement(PromoCodeSection, {
@@ -4497,12 +4589,13 @@ var TicketsContainer = function TicketsContainer(_ref) {
     setPromoCodeUpdated: setPromoCodeUpdated,
     setShowPromoInput: setShowPromoInput,
     isPromotionsEnabled: isPromotionsEnabled,
+    isAccessCodeEnabled: isAccessCodeEnabled,
     isAllTicketsSoldOut: isAllTicketsSoldOut
   }), !isAllTicketsSoldOut && React__default.createElement(Button$1, {
     "aria-hidden": true,
     className: "book-button " + (handleBookIsLoading || _isEmpty(selectedTickets) || Object.values(selectedTickets)[0] === 0 ? 'disabled' : ''),
     onClick: !handleBookIsLoading && !_isEmpty(selectedTickets) && Object.values(selectedTickets)[0] > 0 ? handleBook : function () {}
-  }, getTicketsLabel || 'GET TICKETS'), isLogged ? React__default.createElement("div", {
+  }, getTicketsLabel || 'GET TICKETS'), isLogged && !hideSessionButtons ? React__default.createElement("div", {
     className: "session-wrapper"
   }, React__default.createElement("span", {
     className: "session-container"
@@ -4519,7 +4612,7 @@ var TicketsContainer = function TicketsContainer(_ref) {
   }, "Log out"))) : ''), showLoginModal ? React__default.createElement(LoginModal, {
     onClose: handleOnClose,
     onLogin: handleOnLogin
-  }) : null);
+  }) : null));
 };
 
 var EventInfoItem = function EventInfoItem(_ref) {