tf-checkout-react 1.2.12 → 1.2.13

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

@@ -47,5 +47,6 @@ export interface IBillingInfoPage {
     logo?: string;
     showForgotPasswordButton?: boolean;
     showSignUpButton?: boolean;
+    brandOptIn?: 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, accountInfoTitle, hideLogo, themeOptions, onErrorClose, hideErrorsAlertSection, onSkipBillingPage, skipPage, canSkipHolderNames, onForgotPasswordSuccess, onForgotPasswordError, shouldFetchCountries, onCountdownFinish, enableTimer, logo, showForgotPasswordButton, showSignUpButton, }: 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, hideErrorsAlertSection, onSkipBillingPage, skipPage, canSkipHolderNames, onForgotPasswordSuccess, onForgotPasswordError, shouldFetchCountries, onCountdownFinish, enableTimer, logo, showForgotPasswordButton, showSignUpButton, brandOptIn, }: IBillingInfoPage) => JSX.Element;

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

@@ -1,4 +1,5 @@
 /// <reference types="react" />
+import 'react-phone-input-2/lib/material.css';
 import { FieldInputProps, FormikProps } from 'formik';
 export interface IPhoneNumberField {
     label: string;

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

@@ -28,8 +28,10 @@ var styles$1 = require('@mui/styles');
 var FormGroup = _interopDefault(require('@mui/material/FormGroup'));
 var FormControlLabel = _interopDefault(require('@mui/material/FormControlLabel'));
 var Checkbox = _interopDefault(require('@mui/material/Checkbox'));
-var MuiPhoneNumber = _interopDefault(require('material-ui-phone-number'));
+require('material-ui-phone-number');
+require('react-phone-input-2/lib/material.css');
 var _debounce = _interopDefault(require('lodash/debounce'));
+var PhoneInput = _interopDefault(require('react-phone-input-2'));
 var CircularProgress = _interopDefault(require('@mui/material/CircularProgress'));
 var Select = _interopDefault(require('@mui/material/Select'));
 var Yup = require('yup');
@@ -1731,46 +1733,62 @@ var PhoneNumberField = function PhoneNumberField(_ref) {
 
             case 4:
               setFieldError(field.name, '');
-              setFieldTouched(field.name, false);
-              _context.next = 12;
+              _context.next = 11;
               break;
 
-            case 8:
-              _context.prev = 8;
+            case 7:
+              _context.prev = 7;
               _context.t0 = _context["catch"](0);
               message = _get(_context.t0, 'response.data.message', 'Invalid phone number');
               setFieldError(field.name, message);
 
-            case 12:
-              _context.prev = 12;
+            case 11:
+              _context.prev = 11;
               setStatus((_setStatus2 = {}, _setStatus2[field.name] = false, _setStatus2));
-              return _context.finish(12);
+              return _context.finish(11);
 
-            case 15:
+            case 14:
             case "end":
               return _context.stop();
           }
         }
-      }, _callee, null, [[0, 8, 12, 15]]);
+      }, _callee, null, [[0, 7, 11, 14]]);
     }))); // eslint-disable-next-line
   }, [field.value]);
-  return React__default.createElement(MuiPhoneNumber, {
-    name: field.name,
+  return React__default.createElement(React__default.Fragment, null, React__default.createElement(PhoneInput, {
+    key: field.name,
     value: fill ? values.phone : initialValues.phone,
-    onChange: function onChange(e) {
-      setFieldTouched(field.name, true);
-      setFieldValue(field.name, e);
+    onChange: function onChange(value, data) {
+      if (data.dialCode !== value) {
+        setFieldTouched(field.name, true);
+        setFieldValue(field.name, value);
+      } else {
+        setFieldValue(field.name, '');
+        setFieldError(field.name, '');
+      }
     },
-    variant: "outlined",
-    defaultCountry: "us",
+    country: "us",
     disableDropdown: disableDropdown,
-    label: label,
-    error: !!error && isTouched,
-    helperText: isTouched && error,
-    fullWidth: true,
+    specialLabel: label,
     autoFormat: false,
-    disableAreaCodes: true
-  });
+    inputStyle: {
+      width: '100%'
+    }
+  }), !!error && isTouched && React__default.createElement("p", {
+    style: {
+      fontFamily: '"Roboto","Helvetica","Arial",sans-serif',
+      fontWeight: '400',
+      fontSize: '0.75rem',
+      lineHeight: '1.66',
+      letterSpacing: '0.03333em',
+      textAlign: 'left',
+      marginTop: '3px',
+      marginRight: '14px',
+      marginBottom: '0',
+      marginLeft: '14px',
+      color: '#d32f2f'
+    }
+  }, error));
 };
 
 function Loader() {
@@ -2664,7 +2682,8 @@ var LogicRunner = function LogicRunner(_ref) {
       setUserValues = _ref.setUserValues,
       onGetStatesSuccess = _ref.onGetStatesSuccess,
       onGetStatesError = _ref.onGetStatesError,
-      shouldFetchCountries = _ref.shouldFetchCountries;
+      shouldFetchCountries = _ref.shouldFetchCountries,
+      brandOptIn = _ref.brandOptIn;
   var prevCountry = React.useRef(values.country);
   React.useEffect(function () {
     var fetchStates = /*#__PURE__*/function () {
@@ -2739,7 +2758,7 @@ var LogicRunner = function LogicRunner(_ref) {
               street_address: (parsedData == null ? void 0 : parsedData.street_address) || '',
               country: (parsedData == null ? void 0 : parsedData.country) || '1',
               zip: (parsedData == null ? void 0 : parsedData.zip) || '',
-              brand_opt_in: (parsedData == null ? void 0 : parsedData.brand_opt_in) || false,
+              brand_opt_in: brandOptIn ? brandOptIn : (parsedData == null ? void 0 : parsedData.brand_opt_in) || false,
               city: (parsedData == null ? void 0 : parsedData.city) || '',
               confirmPassword: '',
               password: '',
@@ -2834,7 +2853,9 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
       _ref3$showForgotPassw = _ref3.showForgotPasswordButton,
       showForgotPasswordButton = _ref3$showForgotPassw === void 0 ? false : _ref3$showForgotPassw,
       _ref3$showSignUpButto = _ref3.showSignUpButton,
-      showSignUpButton = _ref3$showSignUpButto === void 0 ? false : _ref3$showSignUpButto;
+      showSignUpButton = _ref3$showSignUpButto === void 0 ? false : _ref3$showSignUpButto,
+      _ref3$brandOptIn = _ref3.brandOptIn,
+      brandOptIn = _ref3$brandOptIn === void 0 ? false : _ref3$brandOptIn;
 
   var themeMui = styles.createTheme(themeOptions);
   var isWindowDefined = typeof window !== 'undefined';
@@ -2922,9 +2943,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
   var showDOB = getQueryVariable('age_required') === 'true';
   var showTicketHolders = getQueryVariable('names_required') === 'true';
   var eventId = getQueryVariable('event_id');
-
-  var optedInFieldValue = _get(cartInfoData, 'optedIn', false);
-
+  var optedInFieldValue = brandOptIn ? brandOptIn : _get(cartInfoData, 'optedIn', false);
   var ttfOptIn = Boolean(_get(cartInfoData, 'ttfOptIn', false));
 
   var hideTtfOptIn = _get(cartInfoData, 'hide_ttf_opt_in', true);
@@ -3400,6 +3419,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
     return React__default.createElement(formik.Form, {
       onSubmit: props.handleSubmit
     }, React__default.createElement(ErrorFocus, null), React__default.createElement(LogicRunner, {
+      brandOptIn: brandOptIn,
       values: props.values,
       setStates: setStates,
       setFieldValue: props.setFieldValue,
@@ -6479,8 +6499,9 @@ var OrderDetailsContainer = function OrderDetailsContainer(_ref) {
 
   var orderSummery = "ID " + data.id + ", placed";
 
-  if (data.date) {
-    orderSummery += " " + data.date;
+  if (data.date && data.timezone) {
+    var date = moment.tz(data.date, data.timezone).format("dddd, DD MMMM YYYY");
+    orderSummery += " " + date;
   }
 
   return React__default.createElement("div", {