tf-checkout-react 1.3.24 → 1.3.25

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

@@ -11,15 +11,13 @@ import _isEmpty from 'lodash-es/isEmpty';
 import _isEqual from 'lodash-es/isEqual';
 import _map from 'lodash-es/map';
 import { nanoid } from 'nanoid';
-import React, { Component, useState, useRef, useEffect, useCallback, memo, Fragment } from 'react';
+import React, { Component, useState, useCallback, useEffect, memo, useRef, Fragment } from 'react';
 import _forEach from 'lodash-es/forEach';
 import { DatePicker } from '@mui/x-date-pickers';
 import { AdapterMoment } from '@mui/x-date-pickers/AdapterMoment';
 import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
 import TextField from '@mui/material/TextField';
 import { useTheme } from '@mui/styles';
-import _isFunction from 'lodash-es/isFunction';
-import _isObject from 'lodash-es/isObject';
 import FormGroup from '@mui/material/FormGroup';
 import FormControlLabel from '@mui/material/FormControlLabel';
 import Checkbox from '@mui/material/Checkbox';
@@ -60,6 +58,7 @@ import TablePagination from '@mui/material/TablePagination';
 import TableRow from '@mui/material/TableRow';
 import _has from 'lodash-es/has';
 import Radio from '@mui/material/Radio';
+import { isEqual } from 'lodash-es';
 import _isNull from 'lodash-es/isNull';
 import _reverse from 'lodash-es/reverse';
 
@@ -1607,33 +1606,28 @@ var emailValidator = function emailValidator(email) {
   return !emailRegex.test(email) ? 'Please enter a valid email address' : '';
 };
 
-var CustomField = function CustomField(_ref2) {
-  var _ref$current;
-
-  var label = _ref2.label,
-      _ref2$type = _ref2.type,
-      type = _ref2$type === void 0 ? 'text' : _ref2$type,
-      field = _ref2.field,
-      _ref2$selectOptions = _ref2.selectOptions,
-      selectOptions = _ref2$selectOptions === void 0 ? [] : _ref2$selectOptions,
-      _ref2$form = _ref2.form,
-      touched = _ref2$form.touched,
-      errors = _ref2$form.errors,
-      submitCount = _ref2$form.submitCount,
-      theme = _ref2.theme,
-      _ref2$inputProps = _ref2.inputProps,
-      pInputProps = _ref2$inputProps === void 0 ? {} : _ref2$inputProps,
-      _ref2$InputProps = _ref2.InputProps,
-      InputProps = _ref2$InputProps === void 0 ? {} : _ref2$InputProps,
-      inputRef = _ref2.inputRef;
+var CustomField = function CustomField(_ref) {
+  var label = _ref.label,
+      _ref$type = _ref.type,
+      type = _ref$type === void 0 ? 'text' : _ref$type,
+      field = _ref.field,
+      _ref$selectOptions = _ref.selectOptions,
+      selectOptions = _ref$selectOptions === void 0 ? [] : _ref$selectOptions,
+      _ref$form = _ref.form,
+      touched = _ref$form.touched,
+      errors = _ref$form.errors,
+      submitCount = _ref$form.submitCount,
+      theme = _ref.theme,
+      _ref$inputProps = _ref.inputProps,
+      pInputProps = _ref$inputProps === void 0 ? {} : _ref$inputProps,
+      _ref$InputProps = _ref.InputProps,
+      InputProps = _ref$InputProps === void 0 ? {} : _ref$InputProps,
+      inputRef = _ref.inputRef;
 
   var _useState = useState(Boolean(field.value)),
       isShrinked = _useState[0],
       setIsShrinked = _useState[1];
 
-  var _ref = useRef(null);
-
-  var isAutoFilled = (_ref$current = _ref.current) == null ? void 0 : _ref$current.matches(':-webkit-autofill');
   var isSelectField = type === 'select';
 
   var error = _get(errors, field.name);
@@ -1643,13 +1637,6 @@ var CustomField = function CustomField(_ref2) {
   var inputProps = {
     sx: customTheme == null ? void 0 : customTheme.input
   };
-  useEffect(function () {
-    if (_isFunction(inputRef)) {
-      inputRef(_ref.current);
-    } else if (_isObject(inputRef)) {
-      inputRef.current = _ref.current;
-    }
-  });
   return React.createElement(TextField, Object.assign({
     placeholder: "",
     id: field.name,
@@ -1671,11 +1658,11 @@ var CustomField = function CustomField(_ref2) {
     },
     InputLabelProps: {
       sx: customTheme == null ? void 0 : customTheme.input,
-      shrink: isShrinked || Boolean(field.value) || isAutoFilled
+      shrink: isShrinked || Boolean(field.value)
     },
     InputProps: InputProps,
     inputProps: _extends({}, inputProps, pInputProps),
-    inputRef: _ref
+    inputRef: inputRef
   }, field, {
     onBlur: function onBlur(e) {
       setIsShrinked(Boolean(field.value));
@@ -5455,7 +5442,7 @@ var TicketsSection = function TicketsSection(_ref) {
     }
 
     var ticketIsFree = +ticket.price === 0;
-    var ticketPrice = isSoldOut ? 'SOLD OUT' : ticketIsFree ? 'FREE' : "$ " + (+ticket.price).toFixed(2);
+    var ticketPrice = isSoldOut ? 'SOLD OUT' : ticketIsFree ? 'FREE' : "\xA3 " + (+ticket.price).toFixed(2);
     return React.createElement("div", {
       key: ticket.id || ticket.name,
       className: "event-detail__tier " + (isSoldOut ? 'disabled' : '')
@@ -5467,7 +5454,7 @@ var TicketsSection = function TicketsSection(_ref) {
       className: "event-detail__tier-price"
     }, ticketIsDiscounted && React.createElement("p", {
       className: "old-price"
-    }, "$ ", (+ticket.oldPrice).toFixed(2)), React.createElement("p", {
+    }, "\xA3 ", (+ticket.oldPrice).toFixed(2)), React.createElement("p", {
       className: isSoldOut ? 'sold-out' : ''
     }, ticketPrice), !isSoldOut && !ticketIsFree && React.createElement("p", {
       className: "fees"
@@ -7645,8 +7632,11 @@ var AddonsContainter = function AddonsContainter(_ref) {
       _ref$onConfirmSelecti2 = _ref.onConfirmSelectionError,
       onConfirmSelectionError = _ref$onConfirmSelecti2 === void 0 ? _identity : _ref$onConfirmSelecti2,
       _ref$onCountdownFinis = _ref.onCountdownFinish,
-      _onCountdownFinish = _ref$onCountdownFinis === void 0 ? _identity : _ref$onCountdownFinis;
+      _onCountdownFinish = _ref$onCountdownFinis === void 0 ? _identity : _ref$onCountdownFinis,
+      _ref$samePageBilling = _ref.samePageBilling,
+      samePageBilling = _ref$samePageBilling === void 0 ? false : _ref$samePageBilling;
 
+  var valuesRef = useRef(null);
   var eventId = getQueryVariable('event_id');
 
   var _useState = useState([]),
@@ -7823,7 +7813,7 @@ var AddonsContainter = function AddonsContainter(_ref) {
               collectOptionalWalletAddress = (_pageConfigsData$coll = pageConfigsData.collect_optional_wallet_address) != null ? _pageConfigsData$coll : false;
               collectMandatoryWalletAddress = (_pageConfigsData$coll2 = pageConfigsData.collect_mandatory_wallet_address) != null ? _pageConfigsData$coll2 : false;
 
-              if (!(skipBillingPage && enableBillingInfoAutoCreate)) {
+              if (!(skipBillingPage && enableBillingInfoAutoCreate && !samePageBilling)) {
                 _context2.next = 36;
                 break;
               }
@@ -7927,6 +7917,7 @@ var AddonsContainter = function AddonsContainter(_ref) {
     }));
   }
 
+  var flagHasAddOn = getQueryVariable('hasAddOn') === 'true';
   return React.createElement(React.Fragment, null, !!cartExpirationTime && enableTimer && React.createElement(TimerWidget$1, {
     expires_at: cartExpirationTime,
     onCountdownFinish: function onCountdownFinish() {
@@ -7934,7 +7925,7 @@ var AddonsContainter = function AddonsContainter(_ref) {
 
       _onCountdownFinish();
     }
-  }), React.createElement("div", {
+  }), samePageBilling && !flagHasAddOn ? null : React.createElement("div", {
     className: classNamePrefix + "_container"
   }, React.createElement("div", {
     className: classNamePrefix + "_block"
@@ -7942,7 +7933,7 @@ var AddonsContainter = function AddonsContainter(_ref) {
     className: classNamePrefix + "_line_block"
   }, React.createElement("p", {
     className: classNamePrefix + "_info_title"
-  }, "Get Your Tickets"), React.createElement("button", {
+  }, "Get Your Tickets"), samePageBilling ? null : React.createElement("button", {
     type: "button",
     className: classNamePrefix + "_skip",
     onClick: function onClick() {
@@ -7960,6 +7951,11 @@ var AddonsContainter = function AddonsContainter(_ref) {
     }
   }, function (_ref4) {
     var values = _ref4.values;
+
+    if (!isEqual(values, valuesRef.current)) {
+      valuesRef.current = values;
+    }
+
     var isConfirmDisabled = !isAtLeastOneAddonSelected(values);
     return React.createElement(Form, {
       autoComplete: "off",
@@ -7999,7 +7995,13 @@ var AddonsContainter = function AddonsContainter(_ref) {
             selectOptions: addonsOptions[variant.id],
             classNamePrefix: classNamePrefix,
             handleAddonChange: function handleAddonChange(id, value) {
-              return onFieldChange(id, value, addon);
+              onFieldChange(id, value, addon);
+
+              if (samePageBilling) {
+                setTimeout(function () {
+                  handleConfirm(valuesRef.current);
+                }, 100);
+              }
             }
           })
         );
@@ -8010,10 +8012,16 @@ var AddonsContainter = function AddonsContainter(_ref) {
         selectOptions: addonsOptions[addon.id],
         classNamePrefix: classNamePrefix,
         handleAddonChange: function handleAddonChange(id, value) {
-          return onFieldChange(id, value, addon);
+          onFieldChange(id, value, addon);
+
+          if (samePageBilling) {
+            setTimeout(function () {
+              handleConfirm(valuesRef.current);
+            }, 100);
+          }
         }
       })));
-    }), React.createElement("button", {
+    }), samePageBilling ? null : React.createElement("button", {
       type: "submit",
       className: (isConfirmDisabled ? classNamePrefix + "_is_disabled" : '') + " " + classNamePrefix + "_submit_button",
       disabled: isConfirmDisabled