tf-checkout-react 1.0.69 → 1.0.73

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

@@ -30,5 +30,6 @@ export interface IBillingInfoPage {
     theme?: 'light' | 'dark';
     isLoggedIn?: boolean;
     fontFamily?: string;
+    hideLogo?: boolean;
 }
-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, fontFamily }: 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, fontFamily, hideLogo, }: IBillingInfoPage) => JSX.Element;

package/dist/components/common/CheckboxField.d.ts

@@ -7,5 +7,5 @@ export interface ICheckboxField {
 interface IOtherProps {
     [key: string]: any;
 }
-export declare const CheckboxField: ({ label, field, selectOptions, theme, ...rest }: ICheckboxField & IOtherProps) => JSX.Element;
+export declare const CheckboxField: ({ label, field, selectOptions, theme, setFieldValue, ...rest }: ICheckboxField & IOtherProps) => JSX.Element;
 export {};

package/dist/components/common/FormikPhoneNumberField.d.ts

@@ -7,5 +7,5 @@ export interface INumberInField {
 interface IOtherProps {
     [key: string]: any;
 }
-export declare const FormikPhoneNumberField: ({ label, field, form: { touched, errors }, setFieldValue, ...rest }: INumberInField & IOtherProps) => JSX.Element;
+export declare const FormikPhoneNumberField: ({ label, field, form: { touched, errors }, setFieldValue, selectOptions, ...rest }: INumberInField & IOtherProps) => JSX.Element;
 export {};

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

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+export interface IPromoCodeSectionProps {
+    promoCode: string;
+    promoCodeIsApplied: boolean;
+    showPromoInput: boolean;
+    isPromotionsEnabled: boolean;
+    isAllTicketsSoldOut: 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;

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

@@ -17,6 +17,7 @@ export interface IGetTickets {
     onGetTicketsError: (e: AxiosError) => void;
     theme?: 'light' | 'dark';
     queryPromoCode?: string;
+    isPromotionsEnabled?: boolean;
 }
 export interface ITicket {
     id: string | number;
@@ -25,5 +26,5 @@ export interface ITicket {
 export interface ISelectedTickets {
     [key: string]: string | number;
 }
-export declare const TicketsContainer: ({ getTicketsLabel, eventId, onAddToCartSuccess, contentStyle, onAddToCartError, onGetTicketsSuccess, onGetTicketsError, theme, queryPromoCode }: IGetTickets) => JSX.Element;
+export declare const TicketsContainer: ({ getTicketsLabel, eventId, onAddToCartSuccess, contentStyle, onAddToCartError, onGetTicketsSuccess, onGetTicketsError, theme, queryPromoCode, isPromotionsEnabled, }: IGetTickets) => JSX.Element;
 export {};

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

@@ -3,6 +3,7 @@ import './style.css';
 interface WaitingListProps {
     tickets: any;
     eventId: number;
+    isPromotionsEnabled: boolean;
 }
-declare const WaitingList: ({ tickets, eventId }: WaitingListProps) => JSX.Element;
+declare const WaitingList: ({ tickets, eventId, isPromotionsEnabled }: WaitingListProps) => JSX.Element;
 export default WaitingList;

package/dist/env.d.ts

@@ -1,11 +1,11 @@
-export declare const ENV_TEST: {
+export declare const ENV: {
     EVENT_ID: number;
     BASE_URL: string;
     CLIENT_ID: string;
     CLIENT_SECRET: string;
     STRIPE_PUBLISHABLE_KEY: string;
 };
-export declare const ENV: {
+export declare const ENV_PROD: {
     EVENT_ID: number;
     BASE_URL: string;
     CLIENT_ID: string;

package/dist/images/done.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M10 20C15.5228 20 20 15.5228 20 10C20 4.47717 15.5228 0 10 0C4.47717 0 0 4.47717 0 10C0 15.5228 4.47717 20 10 20ZM8.14661 15.8678L16.8782 6.39722C16.9561 6.31335 17 6.19922 17 6.08008C17 5.96094 16.9561 5.8468 16.8782 5.76282L16.3016 5.12854C16.1386 4.95715 15.8796 4.95715 15.7167 5.12854L7.85004 13.661L4.28326 9.79236C4.20593 9.70776 4.10071 9.66016 3.99084 9.66016C3.9353 9.66016 3.88086 9.67236 3.83069 9.69531C3.78168 9.71777 3.73663 9.75061 3.69843 9.79236L3.12183 10.4177C3.07635 10.4667 3.04248 10.5259 3.02216 10.5905C3.00763 10.6365 3 10.6853 3 10.735C3 10.8541 3.04388 10.9683 3.12183 11.0521L7.56177 15.8678C7.6391 15.9524 7.74438 16 7.85419 16C7.96399 16 8.06927 15.9524 8.14661 15.8678Z" fill="#569F44"/>
+</svg>

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

@@ -28,10 +28,10 @@ var Select = _interopDefault(require('@mui/material/Select'));
 var MuiPhoneNumber = _interopDefault(require('material-ui-phone-number'));
 var styles = require('@mui/material/styles');
 var Container = _interopDefault(require('@mui/material/Container'));
+var CircularProgress = _interopDefault(require('@mui/material/CircularProgress'));
 var Alert = _interopDefault(require('@mui/material/Alert'));
 var reactStripeJs = require('@stripe/react-stripe-js');
 var stripeJs = require('@stripe/stripe-js');
-var CircularProgress = _interopDefault(require('@mui/material/CircularProgress'));
 var reactShare = require('react-share');
 var _some = _interopDefault(require('lodash/some'));
 var _find = _interopDefault(require('lodash/find'));
@@ -43,6 +43,7 @@ var _has = _interopDefault(require('lodash/has'));
 var FormControl = _interopDefault(require('@mui/material/FormControl'));
 var MenuItem = _interopDefault(require('@mui/material/MenuItem'));
 var Button$1 = _interopDefault(require('@mui/material/Button'));
+var SVG = _interopDefault(require('react-inlinesvg'));
 var Table = _interopDefault(require('@mui/material/Table'));
 var TableBody = _interopDefault(require('@mui/material/TableBody'));
 var TableCell = _interopDefault(require('@mui/material/TableCell'));
@@ -990,7 +991,7 @@ var ErrorFocusInternal = /*#__PURE__*/function (_Component) {
 var ErrorFocus = /*#__PURE__*/formik.connect(ErrorFocusInternal);
 
 var isWindowDefined = typeof window !== 'undefined';
-var allowedOrigins = ['http://localhost', 'gtsb.io', 'gatsbyjs.io', 'https://www.houseofx.nyc', 'https://tickets-staging.houseofx.nyc'];
+var discardedOrigins = ['http://localhost', 'gtsb.io', 'gatsbyjs.io', 'https://www.houseofx.nyc', 'https://tickets-staging.houseofx.nyc'];
 var origin = isWindowDefined && window.location.origin;
 var ttfHeaders = {
   Accept: 'application/vnd.api+json',
@@ -1001,7 +1002,7 @@ if (isWindowDefined && localStorage.getItem('auth_guest_token')) {
   ttfHeaders['Authorization-Guest'] = /*#__PURE__*/localStorage.getItem('auth_guest_token');
 }
 
-if (isWindowDefined && !allowedOrigins.some(function (el) {
+if (isWindowDefined && !discardedOrigins.some(function (el) {
   return origin && origin.includes(el);
 })) {
   ttfHeaders['X-Source-Origin'] = 'houseofx.nyc';
@@ -1049,7 +1050,7 @@ publicRequest.interceptors.request.use(function (config) {
     config.headers = _updatedHeaders;
   }
 
-  if (isWindowDefined && !allowedOrigins.some(function (el) {
+  if (isWindowDefined && !discardedOrigins.some(function (el) {
     return origin && origin.includes(el);
   })) {
     var _updatedHeaders2 = _extends({}, config.headers, {
@@ -1810,7 +1811,7 @@ var CustomField = function CustomField(_ref) {
   }) : null);
 };
 
-var _excluded$1 = ["label", "field", "selectOptions", "theme"];
+var _excluded$1 = ["label", "field", "selectOptions", "theme", "setFieldValue"];
 var CheckboxField = function CheckboxField(_ref) {
   var label = _ref.label,
       field = _ref.field,
@@ -1942,7 +1943,7 @@ var removePlusSign = function removePlusSign(string) {
   return string.replace('+', '');
 };
 
-var _excluded$2 = ["label", "field", "form", "setFieldValue"];
+var _excluded$2 = ["label", "field", "form", "setFieldValue", "selectOptions"];
 var FormikPhoneNumberField = function FormikPhoneNumberField(_ref) {
   var label = _ref.label,
       field = _ref.field,
@@ -1971,22 +1972,6 @@ var FormikPhoneNumberField = function FormikPhoneNumberField(_ref) {
   }, rest));
 };
 
-var getImage = function getImage(name) {
-  if (name === void 0) {
-    name = '';
-  }
-
-  var image = '';
-
-  if (!name.trim().length) {
-    return image;
-  }
-
-  return image;
-};
-
-var TTFLOGO = /*#__PURE__*/getImage('logo-ttf.png');
-
 var LogicRunner = function LogicRunner(_ref) {
   var values = _ref.values,
       setStates = _ref.setStates,
@@ -2131,7 +2116,8 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
       onLoginSuccess = _ref3$onLoginSuccess === void 0 ? function () {} : _ref3$onLoginSuccess,
       _ref3$isLoggedIn = _ref3.isLoggedIn,
       pIsLoggedIn = _ref3$isLoggedIn === void 0 ? false : _ref3$isLoggedIn,
-      fontFamily = _ref3.fontFamily;
+      fontFamily = _ref3.fontFamily,
+      hideLogo = _ref3.hideLogo;
   var themeMui = styles.createTheme({
     typography: {
       allVariants: {
@@ -2234,9 +2220,9 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
     setIsLoggedIn(false);
   }, []);
   React.useEffect(function () {
-    isWindowDefined && window.document.addEventListener("auth_error", handleAuthErrors);
+    isWindowDefined && window.document.addEventListener('auth_error', handleAuthErrors);
     return function () {
-      isWindowDefined && window.document.removeEventListener("auth_error", handleAuthErrors);
+      isWindowDefined && window.document.removeEventListener('auth_error', handleAuthErrors);
     };
   }, [handleAuthErrors]);
   React.useEffect(function () {
@@ -2585,10 +2571,10 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
         onLogin();
         setShowModalLogin(true);
       }
-    }, "Login"), React__default.createElement("div", {
+    }, "Login"), !hideLogo && React__default.createElement("div", {
       className: "logo-image-container"
     }, React__default.createElement("img", {
-      src: TTFLOGO,
+      src: theme === 'dark' ? 'https://www.ticketfairy.com/resources/images/logo-ttf.svg' : 'https://www.ticketfairy.com/resources/images/logo-ttf-black.svg',
       alt: "nodata"
     })))), _map(dataWithUniqueIds, function (item) {
       var label = item.label,
@@ -2960,8 +2946,28 @@ var CheckoutForm = function CheckoutForm(_ref) {
   }, isLoading ? React__default.createElement(CircularProgress, null) : "Pay " + getCurrencySymbolByCurrency(currency) + total))));
 };
 
-var publishableKey = CONFIGS.STRIPE_PUBLISHABLE_KEY || 'pk_test_3Ov1P1oP33A1cxaSjxWE0VjT';
-var stripePromise = /*#__PURE__*/stripeJs.loadStripe(publishableKey);
+var publishableKey = CONFIGS.STRIPE_PUBLISHABLE_KEY || '';
+
+var getStripePromise = function getStripePromise(reviewData) {
+  var stripePublishableKey = _get(reviewData, 'payment_method.stripe_publishable_key') || publishableKey;
+
+  var stripeAccount = _get(reviewData, 'payment_method.stripe_connected_account');
+
+  var options = {};
+
+  if (stripeAccount) {
+    options.stripeAccount = stripeAccount;
+  }
+
+  return stripeJs.loadStripe(stripePublishableKey, options);
+};
+
+function Loader() {
+  return React__default.createElement("div", {
+    className: "loader-container"
+  }, React__default.createElement(CircularProgress, null));
+}
+
 var initialOrderValues = {
   product_name: '',
   ticketType: '',
@@ -3015,9 +3021,13 @@ var PaymentContainer = function PaymentContainer(_ref) {
       paymentIsLoading = _useState4[0],
       setPaymentIsLoading = _useState4[1];
 
-  var _useState5 = React.useState([]),
-      conditions = _useState5[0],
-      setConditions = _useState5[1];
+  var _useState5 = React.useState(true),
+      paymentDataIsLoading = _useState5[0],
+      setPaymentDataIsLoading = _useState5[1];
+
+  var _useState6 = React.useState([]),
+      conditions = _useState6[0],
+      setConditions = _useState6[1];
 
   var showFormTitle = Boolean(formTitle);
   var showErrorText = Boolean(errorText);
@@ -3066,11 +3076,16 @@ var PaymentContainer = function PaymentContainer(_ref) {
               onGetPaymentDataError(_context.t0.response);
 
             case 11:
+              _context.prev = 11;
+              setPaymentDataIsLoading(false);
+              return _context.finish(11);
+
+            case 14:
             case "end":
               return _context.stop();
           }
         }
-      }, _callee, null, [[0, 7]]);
+      }, _callee, null, [[0, 7, 11, 14]]);
     }))();
   }, [checkoutData]); //just once
 
@@ -3187,7 +3202,7 @@ var PaymentContainer = function PaymentContainer(_ref) {
     severity: "error",
     onClose: onErrorClose,
     variant: "filled"
-  }, error), React__default.createElement(Container, {
+  }, error), paymentDataIsLoading && React__default.createElement(Loader, null), !paymentDataIsLoading && React__default.createElement(Container, {
     maxWidth: "md"
   }, showFormTitle && React__default.createElement("h1", null, formTitle), React__default.createElement("div", {
     className: "order_info_text"
@@ -3215,9 +3230,9 @@ 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: stripePromise
+    stripe: getStripePromise(reviewData)
   }, React__default.createElement(CheckoutForm, {
-    stripe_client_secret: reviewData.payment_method.stripe_client_secret,
+    stripe_client_secret: _get(reviewData, 'payment_method.stripe_client_secret'),
     total: orderData.total,
     onSubmit: handlePaymentMiddleWare,
     error: error,
@@ -3719,7 +3734,8 @@ var generateQuantity = function generateQuantity(n) {
 var WaitingList = function WaitingList(_ref) {
   var _ref$tickets = _ref.tickets,
       tickets = _ref$tickets === void 0 ? {} : _ref$tickets,
-      eventId = _ref.eventId;
+      eventId = _ref.eventId,
+      isPromotionsEnabled = _ref.isPromotionsEnabled;
 
   var _useState = React.useState(false),
       showSuccessMessage = _useState[0],
@@ -3794,7 +3810,7 @@ var WaitingList = function WaitingList(_ref) {
     className: "success-message"
   }, React__default.createElement("p", {
     className: "added-success-message"
-  }, "You've been added to the waiting list!"), React__default.createElement("p", null, "You'll be notified if tickets become available.")) : React__default.createElement(React__default.Fragment, null, React__default.createElement("p", {
+  }, "You've been added to the waiting list!"), React__default.createElement("p", null, "You'll be notified if tickets become available.")) : React__default.createElement(React__default.Fragment, null, !isPromotionsEnabled && React__default.createElement("p", {
     className: "no-tickets-text"
   }, "No tickets are currently available for this event."), React__default.createElement("h2", null, "WAITING LIST"), React__default.createElement(formik.Formik, {
     initialValues: {
@@ -3867,7 +3883,66 @@ var WaitingList = function WaitingList(_ref) {
   }) : 'ADD TO WAITING LIST')))));
 };
 
-function Loader() {
+var getImage = function getImage(name) {
+  if (name === void 0) {
+    name = '';
+  }
+
+  var image = '';
+
+  if (!name.trim().length) {
+    return image;
+  }
+
+  return image;
+};
+
+var PromoCodeSection = function PromoCodeSection(_ref) {
+  var promoCode = _ref.promoCode,
+      promoCodeIsApplied = _ref.promoCodeIsApplied,
+      showPromoInput = _ref.showPromoInput,
+      isPromotionsEnabled = _ref.isPromotionsEnabled,
+      isAllTicketsSoldOut = _ref.isAllTicketsSoldOut,
+      setPromoCode = _ref.setPromoCode,
+      setPromoCodeUpdated = _ref.setPromoCodeUpdated,
+      setShowPromoInput = _ref.setShowPromoInput;
+  return React__default.createElement("div", null, promoCodeIsApplied ? React__default.createElement("div", {
+    className: "alert-info"
+  }, React__default.createElement(SVG, {
+    src: getImage('done.svg'),
+    preProcessor: function preProcessor(code) {
+      return code.replace(/fill=".*?"/g, 'fill="currentColor"');
+    }
+  }), React__default.createElement("p", null, "PROMO CODE APPLIED SUCCESSFULLY")) : null, showPromoInput && React__default.createElement("div", {
+    className: "promo-code-block"
+  }, React__default.createElement("input", {
+    placeholder: "Promo Code",
+    onChange: function onChange(e) {
+      setPromoCode(e.target.value);
+    },
+    onKeyPress: function onKeyPress(event) {
+      if (event.key === 'Enter') {
+        setPromoCodeUpdated(promoCode);
+      }
+    }
+  }), React__default.createElement(Button, {
+    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, {
+    className: "promo-code-button",
+    placeholder: "Promo Codes",
+    onClick: function onClick() {
+      setShowPromoInput(true);
+    }
+  }, "Got a promo code? Click here") : null);
+};
+
+function Loader$1() {
   return React__default.createElement("div", {
     className: "loader-container"
   }, React__default.createElement(CircularProgress, null));
@@ -3888,7 +3963,9 @@ var TicketsContainer = function TicketsContainer(_ref) {
       _ref$theme = _ref.theme,
       theme = _ref$theme === void 0 ? 'light' : _ref$theme,
       _ref$queryPromoCode = _ref.queryPromoCode,
-      queryPromoCode = _ref$queryPromoCode === void 0 ? '' : _ref$queryPromoCode;
+      queryPromoCode = _ref$queryPromoCode === void 0 ? '' : _ref$queryPromoCode,
+      _ref$isPromotionsEnab = _ref.isPromotionsEnabled,
+      isPromotionsEnabled = _ref$isPromotionsEnab === void 0 ? true : _ref$isPromotionsEnab;
 
   var _useState = React.useState({}),
       selectedTickets = _useState[0],
@@ -4091,45 +4168,24 @@ var TicketsContainer = function TicketsContainer(_ref) {
   return React__default.createElement("div", {
     className: "get-tickets-page " + theme,
     style: contentStyle
-  }, isLoading ? React__default.createElement(Loader, null) : React__default.createElement(React__default.Fragment, null, showWaitingList ? React__default.createElement(WaitingList, {
+  }, isLoading ? React__default.createElement(Loader$1, null) : React__default.createElement(React__default.Fragment, null, showWaitingList && React__default.createElement(WaitingList, {
     tickets: tickets,
-    eventId: eventId
-  }) : React__default.createElement("div", null, React__default.createElement(TicketsSection, {
+    eventId: eventId,
+    isPromotionsEnabled: isPromotionsEnabled
+  }), React__default.createElement("div", null, !showWaitingList && React__default.createElement(TicketsSection, {
     ticketsList: tickets,
     selectedTickets: selectedTickets,
     handleTicketSelect: handleTicketSelect,
     promoCodeIsApplied: promoCodeIsApplied
-  }), promoCodeIsApplied ? React__default.createElement("div", {
-    className: "alert-info"
-  }, "Your promo code was applied successfully.") : null, showPromoInput && React__default.createElement("div", {
-    className: "promo-code-block"
-  }, React__default.createElement("input", {
-    placeholder: "Promo Code",
-    onChange: function onChange(e) {
-      setPromoCode(e.target.value);
-    },
-    onKeyPress: function onKeyPress(event) {
-      if (event.key === 'Enter') {
-        setPromoCodeUpdated(promoCode);
-      }
-    }
-  }), React__default.createElement(Button, {
-    className: "promo-apply-button",
-    placeholder: "Promo Code",
-    onClick: function onClick() {
-      setPromoCodeUpdated(promoCode);
-    }
-  }, "Apply")), !showPromoInput && !isAllTicketsSoldOut ? React__default.createElement(Button, {
-    className: "promo-code-button",
-    placeholder: "Promo Codes",
-    onClick: function onClick() {
-      setShowPromoInput(true);
-    }
-  }, "Got a promo code? Click here") : null, React__default.createElement("div", {
-    className: "test v1.0.19",
-    style: {
-      display: 'none'
-    }
+  }), React__default.createElement(PromoCodeSection, {
+    promoCode: promoCode,
+    promoCodeIsApplied: promoCodeIsApplied,
+    showPromoInput: showPromoInput,
+    setPromoCode: setPromoCode,
+    setPromoCodeUpdated: setPromoCodeUpdated,
+    setShowPromoInput: setShowPromoInput,
+    isPromotionsEnabled: isPromotionsEnabled,
+    isAllTicketsSoldOut: isAllTicketsSoldOut
   }), !isAllTicketsSoldOut && React__default.createElement(Button, {
     "aria-hidden": true,
     className: "book-button " + (handleBookIsLoading || _isEmpty(selectedTickets) || Object.values(selectedTickets)[0] === 0 ? 'disabled' : ''),