tf-checkout-react 1.7.4 → 1.7.7

package/dist/tf-checkout-react.esm.js

@@ -31,6 +31,7 @@ import Visibility from '@mui/icons-material/Visibility';
 import VisibilityOff from '@mui/icons-material/VisibilityOff';
 import IconButton from '@mui/material/IconButton';
 import InputAdornment from '@mui/material/InputAdornment';
+import MenuItem from '@mui/material/MenuItem';
 import TextField from '@mui/material/TextField';
 import _includes from 'lodash-es/includes';
 import _isFunction from 'lodash-es/isFunction';
@@ -39,7 +40,6 @@ import MuiPhoneNumber from 'material-ui-phone-number';
 import _debounce from 'lodash-es/debounce';
 import FormHelperText$1 from '@mui/material/FormHelperText';
 import ListItemText from '@mui/material/ListItemText';
-import MenuItem from '@mui/material/MenuItem';
 import OutlinedInput from '@mui/material/OutlinedInput';
 import Select from '@mui/material/Select';
 import Modal$2 from '@mui/material/Modal';
@@ -2835,7 +2835,7 @@ var Checkbox = function Checkbox(_ref) {
 };
 
 var CustomField = function CustomField(_ref2) {
-  var _ref$current, _customTheme$input;
+  var _ref$current, _ref$current2, _customTheme$input;
   var label = _ref2.label,
     _ref2$type = _ref2.type,
     type = _ref2$type === void 0 ? 'text' : _ref2$type,
@@ -2866,7 +2866,7 @@ var CustomField = function CustomField(_ref2) {
     showPassword = _useState2[0],
     setShowPassword = _useState2[1];
   var _ref = useRef(null);
-  var isAutoFilled = (_ref$current = _ref.current) == null ? void 0 : _ref$current.matches(':-webkit-autofill');
+  var isAutoFilled = (_ref$current = _ref.current) != null && _ref$current.matches ? (_ref$current2 = _ref.current) == null ? void 0 : _ref$current2.matches(':-webkit-autofill') : false;
   var isSelectField = type === 'select';
   var isPasswordField = type === 'password';
   var error = _get(errors, field.name);
@@ -2916,10 +2916,18 @@ var CustomField = function CustomField(_ref2) {
       setIsShrinked(true);
     },
     SelectProps: {
-      "native": true,
+      "native": false,
       className: theme,
       MenuProps: {
-        className: theme
+        className: theme,
+        PaperProps: {
+          sx: {
+            '& .MuiMenuItem-root': {
+              paddingLeft: '16px',
+              paddingRight: '16px'
+            }
+          }
+        }
       }
     },
     InputLabelProps: {
@@ -2941,7 +2949,7 @@ var CustomField = function CustomField(_ref2) {
     },
     onChange: onChange != null ? onChange : field.onChange
   }), isSelectField ? _map(selectOptions, function (option) {
-    return React.createElement("option", {
+    return React.createElement(MenuItem, {
       key: option.value,
       value: option.value,
       disabled: option.disabled
@@ -5061,7 +5069,10 @@ var SignUpForm = function SignUpForm(_ref) {
       spacing: 2,
       sx: {
         padding: '15px 25px',
-        maxHeight: '60vh',
+        maxHeight: {
+          xs: '40vh',
+          sm: '60vh'
+        },
         overflowY: 'auto'
       }
     }, React.createElement(Grid, {
@@ -5312,7 +5323,13 @@ var LoginModal = function LoginModal(_ref) {
     "aria-describedby": "modal-modal-description",
     className: "login-modal " + modalClassname
   }, React.createElement(Box, {
-    style: isMobile ? mobileStyle : style$2
+    style: isMobile ? mobileStyle : style$2,
+    sx: {
+      '@media screen and (orientation:landscape)': {
+        maxHeight: '80vh',
+        overflowY: 'auto'
+      }
+    }
   }, React.createElement("div", null, showSignUpButton && !useCustomSignup && React.createElement(Tabs, {
     value: activeTab,
     onChange: handleTabChange,
@@ -6805,7 +6822,7 @@ var BillingInfoContainer = /*#__PURE__*/React.memo(function (_ref6) {
     enableTimer = _ref6$enableTimer === void 0 ? false : _ref6$enableTimer,
     logo = _ref6.logo,
     _ref6$showForgotPassw = _ref6.showForgotPasswordButton,
-    showForgotPasswordButton = _ref6$showForgotPassw === void 0 ? false : _ref6$showForgotPassw,
+    showForgotPasswordButton = _ref6$showForgotPassw === void 0 ? true : _ref6$showForgotPassw,
     _ref6$showSignUpButto = _ref6.showSignUpButton,
     showSignUpButton = _ref6$showSignUpButto === void 0 ? false : _ref6$showSignUpButto,
     _ref6$brandOptIn = _ref6.brandOptIn,
@@ -8339,12 +8356,12 @@ var ConfirmationContainer = function ConfirmationContainer(_ref) {
   var eventId = (data == null ? void 0 : data.product_id) || '';
   useEffect(function () {
     _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
-      var _data$product_price, confirmationDataResponse, _data;
+      var _data$product_price, confirmationDataResponse, _data, isLoggedIn;
       return _regeneratorRuntime().wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
             if (!hash) {
-              _context.next = 16;
+              _context.next = 17;
               break;
             }
             _context.prev = 1;
@@ -8377,17 +8394,24 @@ var ConfirmationContainer = function ConfirmationContainer(_ref) {
             }
             setData(_data);
             onGetConfirmationDataSuccess(confirmationDataResponse.data.attributes);
-            _context.next = 16;
+            // Clear user_data for non-logged-in users after successful purchase
+            if (isBrowser) {
+              isLoggedIn = Boolean(getCookieByName('X-TF-ECOMMERCE'));
+              if (!isLoggedIn) {
+                window.localStorage.removeItem('user_data');
+              }
+            }
+            _context.next = 17;
             break;
-          case 13:
-            _context.prev = 13;
+          case 14:
+            _context.prev = 14;
             _context.t0 = _context["catch"](1);
             if (axios.isAxiosError(_context.t0)) onGetConfirmationDataError(_context.t0);
-          case 16:
+          case 17:
           case "end":
             return _context.stop();
         }
-      }, _callee, null, [[1, 13]]);
+      }, _callee, null, [[1, 14]]);
     }))();
   }, [hash]);
   var _useState2 = useState(false),
@@ -9466,7 +9490,8 @@ var PreRegistrationComplete = function PreRegistrationComplete(_ref) {
     onLogin: function onLogin(res) {
       setShowModalLogin(false);
       onLoginSuccess(res);
-    }
+    },
+    showForgotPasswordButton: true
   }), !_isEmpty(error) && React.createElement(ConfirmModal, {
     hideCancelBtn: true,
     message: error.message,
@@ -10527,7 +10552,7 @@ var TimeSlotTicketRow = function TimeSlotTicketRow(_ref) {
     return React.createElement(MenuItem, {
       key: index,
       value: slot.timeKey
-    }, moment(slot.timeKey).format('hh:mm A'));
+    }, moment(slot.ticketInstance.slotStartDate).format('hh:mm A'));
   }))), React.createElement(FormControl$1, null, React.createElement(Select, {
     sx: {
       borderRadius: 0,
@@ -11605,7 +11630,8 @@ var TicketsContainer = function TicketsContainer(_ref) {
     onClick: handleLogout
   }, "Log out"))) : ''), showLoginModal ? React.createElement(LoginModal, {
     onClose: handleOnClose,
-    onLogin: handleOnLogin
+    onLogin: handleOnLogin,
+    showForgotPasswordButton: true
   }) : null), showPoweredByImage ? React.createElement(PoweredBy, null) : null, enableInfluencersSection && !hideTopInfluencers && influencers.length ? React.createElement("div", {
     className: "event-influencers"
   }, React.createElement("h3", null, React.createElement("span", null, "TOP"), " INFLUENCERS"), React.createElement("ol", {
@@ -11873,7 +11899,8 @@ var MyTicketsContainer = function MyTicketsContainer(_ref) {
       setIsLogged(true);
     },
     userExpired: userExpired,
-    logo: logo
+    logo: logo,
+    showForgotPasswordButton: true
   }) : null), data != null && (_data$orders = data.orders) != null && _data$orders.length ? React.createElement(React.Fragment, null, React.createElement("h2", null, "My Ticket Orders"), React.createElement(Autocomplete, {
     disablePortal: true,
     id: "combo-box-demo",
@@ -11926,7 +11953,8 @@ var MyTicketsContainer = function MyTicketsContainer(_ref) {
       setUserExpired(false);
       setIsLogged(true);
     },
-    userExpired: userExpired
+    userExpired: userExpired,
+    showForgotPasswordButton: true
   })));
 };
 
@@ -12486,7 +12514,9 @@ var OrderDetailsContainer = function OrderDetailsContainer(_ref) {
     ticketsTitle = _ref$ticketsTitle === void 0 ? 'Your Tickets' : _ref$ticketsTitle,
     themeOptions = _ref.themeOptions,
     _ref$displayLoading = _ref.displayLoading,
-    displayLoading = _ref$displayLoading === void 0 ? false : _ref$displayLoading;
+    displayLoading = _ref$displayLoading === void 0 ? true : _ref$displayLoading,
+    _ref$onDataLoaded = _ref.onDataLoaded,
+    onDataLoaded = _ref$onDataLoaded === void 0 ? _identity : _ref$onDataLoaded;
   var _useState = useState({}),
     data = _useState[0],
     setData = _useState[1];
@@ -12576,20 +12606,21 @@ var OrderDetailsContainer = function OrderDetailsContainer(_ref) {
             _data = _get(response, 'data.attributes');
             setData(_data);
             setIsLoading(false);
-            _context.next = 17;
+            onDataLoaded(_data);
+            _context.next = 18;
             break;
-          case 13:
-            _context.prev = 13;
+          case 14:
+            _context.prev = 14;
             _context.t0 = _context["catch"](0);
             onGetOrdersError(_context.t0);
             setIsLoading(false);
-          case 17:
+          case 18:
           case "end":
             return _context.stop();
         }
-      }, _callee, null, [[0, 13]]);
+      }, _callee, null, [[0, 14]]);
     }))();
-  }, [onGetOrdersError, onGetOrdersSuccess, pOrderId]);
+  }, [onGetOrdersError, onGetOrdersSuccess, onDataLoaded, pOrderId]);
   var handleSellTicket = function handleSellTicket(ticket) {
     var ticketTypesArr = data.items.ticket_types;
     var sellTicketType = _find(ticketTypesArr, function (ticketType) {
@@ -12806,17 +12837,22 @@ var OrderDetailsContainer = function OrderDetailsContainer(_ref) {
     };
   }();
   var theme = createTheme(themeOptions != null ? themeOptions : {});
-  if (isLoading && displayLoading) {
-    return React.createElement(Backdrop$1, {
-      sx: {
-        color: '#fff',
-        backgroundColor: '#000000bd',
-        zIndex: 1205
-      },
-      open: true
-    }, React.createElement(CircularProgress, {
-      color: "inherit"
-    }));
+  if (isLoading || _isEmpty(data)) {
+    if (displayLoading) {
+      return React.createElement(ThemeProvider, {
+        theme: theme
+      }, React.createElement(Backdrop$1, {
+        sx: {
+          color: '#fff',
+          backgroundColor: '#000000bd',
+          zIndex: 1205
+        },
+        open: true
+      }, React.createElement(CircularProgress, {
+        color: "inherit"
+      })));
+    }
+    return null;
   }
   return React.createElement(ThemeProvider, {
     theme: theme