tf-checkout-react 1.3.48-beta.18 → 1.3.48-beta.19

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

@@ -1,5 +1,5 @@
-import React from 'react';
 import './style.css';
+import React from 'react';
 export interface ITimerWidgetPage {
     expires_at: number;
     buyLoading?: boolean;

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

@@ -29,8 +29,8 @@ var _isObject = _interopDefault(require('lodash/isObject'));
 var Box = _interopDefault(require('@mui/material/Box'));
 var Modal = _interopDefault(require('@mui/material/Modal'));
 var Countdown$1 = _interopDefault(require('react-countdown'));
-var _isNumber = _interopDefault(require('lodash/isNumber'));
 var SVG = _interopDefault(require('react-inlinesvg'));
+var _isNumber = _interopDefault(require('lodash/isNumber'));
 var _flatMapDeep = _interopDefault(require('lodash/flatMapDeep'));
 var _isArray = _interopDefault(require('lodash/isArray'));
 var Checkbox = _interopDefault(require('@mui/material/Checkbox'));
@@ -1895,6 +1895,8 @@ var SignupModal = function SignupModal(_ref) {
   }))));
 };
 
+var Cross = "<?xml version=\"1.0\" encoding=\"iso-8859-1\"?>\r\n<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->\r\n<!DOCTYPE svg PUBLIC \"-//W3C//DTD SVG 1.1//EN\" \"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd\">\r\n<svg version=\"1.1\" id=\"Capa_1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\r\n\t width=\"94.926px\" height=\"94.926px\" viewBox=\"0 0 94.926 94.926\" style=\"enable-background:new 0 0 94.926 94.926;\"\r\n\t xml:space=\"preserve\">\r\n<g>\r\n\t<path d=\"M55.931,47.463L94.306,9.09c0.826-0.827,0.826-2.167,0-2.994L88.833,0.62C88.436,0.224,87.896,0,87.335,0\r\n\t\tc-0.562,0-1.101,0.224-1.498,0.62L47.463,38.994L9.089,0.62c-0.795-0.795-2.202-0.794-2.995,0L0.622,6.096\r\n\t\tc-0.827,0.827-0.827,2.167,0,2.994l38.374,38.373L0.622,85.836c-0.827,0.827-0.827,2.167,0,2.994l5.473,5.476\r\n\t\tc0.397,0.396,0.936,0.62,1.498,0.62s1.1-0.224,1.497-0.62l38.374-38.374l38.374,38.374c0.397,0.396,0.937,0.62,1.498,0.62\r\n\t\ts1.101-0.224,1.498-0.62l5.473-5.476c0.826-0.827,0.826-2.167,0-2.994L55.931,47.463z\"/>\r\n</g>\r\n<g>\r\n</g>\r\n<g>\r\n</g>\r\n<g>\r\n</g>\r\n<g>\r\n</g>\r\n<g>\r\n</g>\r\n<g>\r\n</g>\r\n<g>\r\n</g>\r\n<g>\r\n</g>\r\n<g>\r\n</g>\r\n<g>\r\n</g>\r\n<g>\r\n</g>\r\n<g>\r\n</g>\r\n<g>\r\n</g>\r\n<g>\r\n</g>\r\n<g>\r\n</g>\r\n</svg>";
+
 var showZero = function showZero(value) {
   if (value === void 0) {
     value = 0;
@@ -1903,17 +1905,6 @@ var showZero = function showZero(value) {
   return _isNumber(intNumber) ? intNumber >= 0 && intNumber < 10 ? '0' + intNumber : intNumber : null;
 };
 
-var getImage = function getImage(name) {
-  if (name === void 0) {
-    name = '';
-  }
-  var image = '';
-  if (!name.trim().length) {
-    return image;
-  }
-  return image;
-};
-
 var TimerWidget = function TimerWidget(_ref) {
   var expires_at = _ref.expires_at,
     buyLoading = _ref.buyLoading,
@@ -1951,7 +1942,7 @@ var TimerWidget = function TimerWidget(_ref) {
     className: 'close-icon',
     onClick: hideTimer
   }, React__default.createElement(SVG, {
-    src: getImage('cross.svg'),
+    src: Cross,
     width: '10',
     height: '10',
     fill: '#fff'
@@ -4918,6 +4909,10 @@ var AccessCodeSection = function AccessCodeSection(_ref) {
   }, "ENTER"));
 };
 
+var DoneSvg = "<svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<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\"/>\n</svg>";
+
+var XmarkSvg = "<?xml version=\"1.0\" encoding=\"UTF-8\" standalone=\"no\"?>\n<svg\n   xmlns:osb=\"http://www.openswatchbook.org/uri/2009/osb\"\n   xmlns:dc=\"http://purl.org/dc/elements/1.1/\"\n   xmlns:cc=\"http://creativecommons.org/ns#\"\n   xmlns:rdf=\"http://www.w3.org/1999/02/22-rdf-syntax-ns#\"\n   xmlns:svg=\"http://www.w3.org/2000/svg\"\n   xmlns=\"http://www.w3.org/2000/svg\"\n   xmlns:sodipodi=\"http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd\"\n   xmlns:inkscape=\"http://www.inkscape.org/namespaces/inkscape\"\n   viewBox=\"0 0 48 48\"\n   version=\"1.1\"\n   id=\"svg15\"\n   sodipodi:docname=\"cross red circle.svg\"\n   inkscape:version=\"0.92.3 (2405546, 2018-03-11)\">\n  <metadata\n     id=\"metadata19\">\n    <rdf:RDF>\n      <cc:Work\n         rdf:about=\"\">\n        <dc:format>image/svg+xml</dc:format>\n        <dc:type\n           rdf:resource=\"http://purl.org/dc/dcmitype/StillImage\" />\n        <dc:title />\n      </cc:Work>\n    </rdf:RDF>\n  </metadata>\n  <sodipodi:namedview\n     pagecolor=\"#ffffff\"\n     bordercolor=\"#666666\"\n     borderopacity=\"1\"\n     objecttolerance=\"10\"\n     gridtolerance=\"10\"\n     guidetolerance=\"10\"\n     inkscape:pageopacity=\"0\"\n     inkscape:pageshadow=\"2\"\n     inkscape:window-width=\"1920\"\n     inkscape:window-height=\"1027\"\n     id=\"namedview17\"\n     showgrid=\"false\"\n     inkscape:zoom=\"4.9166667\"\n     inkscape:cx=\"-11.694915\"\n     inkscape:cy=\"40.271186\"\n     inkscape:window-x=\"-8\"\n     inkscape:window-y=\"-8\"\n     inkscape:window-maximized=\"1\"\n     inkscape:current-layer=\"g13\" />\n  <defs\n     id=\"defs7\">\n    <linearGradient\n       id=\"linearGradient828\"\n       osb:paint=\"solid\">\n      <stop\n         style=\"stop-color:#ff0000;stop-opacity:1;\"\n         offset=\"0\"\n         id=\"stop826\" />\n    </linearGradient>\n    <linearGradient\n       id=\"0\"\n       gradientUnits=\"userSpaceOnUse\"\n       y1=\"47.37\"\n       x2=\"0\"\n       y2=\"-1.429\">\n      <stop\n         stop-color=\"#c52828\"\n         id=\"stop2\" />\n      <stop\n         offset=\"1\"\n         stop-color=\"#ff5454\"\n         id=\"stop4\" />\n    </linearGradient>\n  </defs>\n  <g\n     transform=\"matrix(.99999 0 0 .99999-58.37.882)\"\n     enable-background=\"new\"\n     id=\"g13\"\n     style=\"fill-opacity:1\">\n    <circle\n       cx=\"82.37\"\n       cy=\"23.12\"\n       r=\"24\"\n       fill=\"url(#0)\"\n       id=\"circle9\"\n       style=\"fill-opacity:1;fill:#dd3333\" />\n    <path\n       d=\"m87.77 23.725l5.939-5.939c.377-.372.566-.835.566-1.373 0-.54-.189-.997-.566-1.374l-2.747-2.747c-.377-.372-.835-.564-1.373-.564-.539 0-.997.186-1.374.564l-5.939 5.939-5.939-5.939c-.377-.372-.835-.564-1.374-.564-.539 0-.997.186-1.374.564l-2.748 2.747c-.377.378-.566.835-.566 1.374 0 .54.188.997.566 1.373l5.939 5.939-5.939 5.94c-.377.372-.566.835-.566 1.373 0 .54.188.997.566 1.373l2.748 2.747c.377.378.835.564 1.374.564.539 0 .997-.186 1.374-.564l5.939-5.939 5.94 5.939c.377.378.835.564 1.374.564.539 0 .997-.186 1.373-.564l2.747-2.747c.377-.372.566-.835.566-1.373 0-.54-.188-.997-.566-1.373l-5.939-5.94\"\n       fill=\"#fff\"\n       fill-opacity=\".842\"\n       id=\"path11\"\n       style=\"fill-opacity:1;fill:#ffffff\" />\n  </g>\n</svg>";
+
 var PromoCodeSection = function PromoCodeSection(_ref) {
   var code = _ref.code,
     codeIsApplied = _ref.codeIsApplied,
@@ -4962,7 +4957,7 @@ var PromoCodeSection = function PromoCodeSection(_ref) {
   return React__default.createElement("div", null, codeIsApplied ? React__default.createElement("div", {
     className: "alert-info"
   }, React__default.createElement(SVG, {
-    src: getImage('done.svg'),
+    src: DoneSvg,
     preProcessor: function preProcessor(code) {
       return code.replace(/fill=".*?"/g, 'fill="currentColor"');
     }
@@ -4971,7 +4966,7 @@ var PromoCodeSection = function PromoCodeSection(_ref) {
   }, "PROMO CODE APPLIED SUCCESSFULLY")) : null, codeIsInvalid ? React__default.createElement("div", {
     className: "alert-info fail"
   }, React__default.createElement(SVG, {
-    src: getImage('xmark.svg')
+    src: XmarkSvg
   }), React__default.createElement("p", {
     className: "promo-code-fail"
   }, "Invalid Promo Code")) : null, !showPromoInput && React__default.createElement(Button$1, {
@@ -6091,6 +6086,10 @@ var MyTicketsContainer = function MyTicketsContainer(_ref) {
   })));
 };
 
+var EmailSvg = "<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"envelope\" class=\"svg-inline--fa fa-envelope fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M502.3 190.8c3.9-3.1 9.7-.2 9.7 4.7V400c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V195.6c0-5 5.7-7.8 9.7-4.7 22.4 17.4 52.1 39.5 154.1 113.6 21.1 15.4 56.7 47.8 92.2 47.6 35.7.3 72-32.8 92.3-47.6 102-74.1 131.6-96.3 154-113.7zM256 320c23.2.4 56.6-29.2 73.4-41.4 132.7-96.3 142.8-104.7 173.4-128.7 5.8-4.5 9.2-11.5 9.2-18.9v-19c0-26.5-21.5-48-48-48H48C21.5 64 0 85.5 0 112v19c0 7.4 3.4 14.3 9.2 18.9 30.6 23.9 40.7 32.4 173.4 128.7 16.8 12.2 50.2 41.8 73.4 41.4z\"></path></svg>";
+
+var UserSvg = "<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"user\" class=\"svg-inline--fa fa-user fa-w-14\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 448 512\"><path fill=\"currentColor\" d=\"M224 256c70.7 0 128-57.3 128-128S294.7 0 224 0 96 57.3 96 128s57.3 128 128 128zm89.6 32h-16.7c-22.2 10.2-46.9 16-72.9 16s-50.6-5.8-72.9-16h-16.7C60.2 288 0 348.2 0 422.4V464c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48v-41.6c0-74.2-60.2-134.4-134.4-134.4z\"></path></svg>";
+
 var _excluded$2 = ["label", "field", "theme", "disableDropdown"];
 var RadioField = function RadioField(_ref) {
   var label = _ref.label,
@@ -6201,7 +6200,7 @@ var TicketResaleModal = function TicketResaleModal(_ref) {
     }, React__default.createElement("div", {
       className: 'icon'
     }, React__default.createElement(SVG, {
-      src: getImage('user.svg'),
+      src: UserSvg,
       width: '24',
       height: '24'
     })), React__default.createElement(formik.Field, {
@@ -6225,7 +6224,7 @@ var TicketResaleModal = function TicketResaleModal(_ref) {
     }, React__default.createElement("div", {
       className: 'icon'
     }, React__default.createElement(SVG, {
-      src: getImage('email.svg'),
+      src: EmailSvg,
       width: '24',
       height: '24'
     })), React__default.createElement(formik.Field, {
@@ -7812,7 +7811,8 @@ var TicketsSection$1 = function TicketsSection(props) {
     _props$tableMapEnable = props.tableMapEnabled,
     tableMapEnabled = _props$tableMapEnable === void 0 ? false : _props$tableMapEnable,
     guestCounts = props.guestCounts,
-    setGuestCounts = props.setGuestCounts;
+    setGuestCounts = props.setGuestCounts,
+    isAddingToCart = props.isAddingToCart;
   var bookButtonIsDisabled = _some(selectedTickets, function (item) {
     return !item;
   }) || _isEmpty(reservedSeats) || reservedSeats.length !== _keys(selectedTickets).length;
@@ -7957,8 +7957,14 @@ var TicketsSection$1 = function TicketsSection(props) {
     }))))));
   })), React__default.createElement("div", null, React__default.createElement(reactBootstrap.Button, {
     className: "book-button\n              " + (bookButtonIsDisabled ? 'disabled' : '') + "\n              " + (isButtonScrollable ? 'is-scrollable' : '') + "\n            ",
-    onClick: !bookButtonIsDisabled ? handleGetTicketClick : _identity
-  }, getTicketsBtnLabel || getButtonLabel(reservedSeats.length, tableMapEnabled)))));
+    onClick: !bookButtonIsDisabled ? handleGetTicketClick : _identity,
+    disabled: isAddingToCart
+  }, isAddingToCart ? React__default.createElement(CircularProgress, {
+    size: 20,
+    style: {
+      marginLeft: 10
+    }
+  }) : getTicketsBtnLabel || getButtonLabel(reservedSeats.length, tableMapEnabled)))));
 };
 
 var SeatMapContainer = function SeatMapContainer(props) {
@@ -7992,15 +7998,18 @@ var SeatMapContainer = function SeatMapContainer(props) {
   var _useState5 = React.useState(false),
     isReserving = _useState5[0],
     setIsReserving = _useState5[1];
-  var _useState6 = React.useState(null),
-    error = _useState6[0],
-    setError = _useState6[1];
-  var _useState7 = React.useState(Date.now() <= Number(localStorage.getItem('reservationStart'))),
-    showTimer = _useState7[0],
-    setShowTimer = _useState7[1];
-  var _useState8 = React.useState({}),
-    guestCounts = _useState8[0],
-    setGuestCounts = _useState8[1];
+  var _useState6 = React.useState(false),
+    isAddingToCart = _useState6[0],
+    setIsAddingToCart = _useState6[1];
+  var _useState7 = React.useState(null),
+    error = _useState7[0],
+    setError = _useState7[1];
+  var _useState8 = React.useState(Date.now() <= Number(localStorage.getItem('reservationStart'))),
+    showTimer = _useState8[0],
+    setShowTimer = _useState8[1];
+  var _useState9 = React.useState({}),
+    guestCounts = _useState9[0],
+    setGuestCounts = _useState9[1];
   var updateGuestCounts = function updateGuestCounts(reservationData) {
     _forEach(reservationData, function (item) {
       var tierTickets = seatMapData.ticketTypeTierRelations[item.tierId];
@@ -8231,6 +8240,7 @@ var SeatMapContainer = function SeatMapContainer(props) {
       return _regeneratorRuntime().wrap(function _callee6$(_context6) {
         while (1) switch (_context6.prev = _context6.next) {
           case 0:
+            setIsAddingToCart(true);
             ticketsDropdownsData = getTicketDropdownData(reservedSeats, seatMapData.ticketTypeTierRelations);
             selectedSeats = {};
             _forEach(ticketsDropdownsData, function (ticketData) {
@@ -8246,31 +8256,35 @@ var SeatMapContainer = function SeatMapContainer(props) {
               selectedTickets: selectedTickets,
               guestCounts: guestCounts
             });
-            _context6.prev = 4;
-            _context6.next = 7;
+            _context6.prev = 5;
+            _context6.next = 8;
             return addToCartFunc({
               eventId: eventId,
               data: addToCartData,
               ticketQuantity: addToCartData == null ? void 0 : (_addToCartData$attrib = addToCartData.attributes) == null ? void 0 : _addToCartData$attrib.product_cart_quantity
             });
-          case 7:
+          case 8:
             response = _context6.sent;
             localStorage.removeItem('reservationData');
             onAddToCartSuccess(response);
-            _context6.next = 15;
+            _context6.next = 16;
             break;
-          case 12:
-            _context6.prev = 12;
-            _context6.t0 = _context6["catch"](4);
+          case 13:
+            _context6.prev = 13;
+            _context6.t0 = _context6["catch"](5);
             if (axios.isAxiosError(_context6.t0)) {
               message = _get(_context6.t0, 'response.data.message', '');
               setError(message);
             }
-          case 15:
+          case 16:
+            _context6.prev = 16;
+            setIsAddingToCart(false);
+            return _context6.finish(16);
+          case 19:
           case "end":
             return _context6.stop();
         }
-      }, _callee6, null, [[4, 12]]);
+      }, _callee6, null, [[5, 13, 16, 19]]);
     }));
     return function handleGetTicketBtnClick() {
       return _ref6.apply(this, arguments);
@@ -8325,6 +8339,7 @@ var SeatMapContainer = function SeatMapContainer(props) {
       return handleCancelSeatReservtion(eventId, tireId, seatId);
     },
     handleGetTicketClick: handleGetTicketBtnClick,
+    isAddingToCart: isAddingToCart,
     reservedSeats: reservedSeats,
     ticketDeleteButtonContent: ticketDeleteButtonContent,
     ticketTypeTierRelations: seatMapData.ticketTypeTierRelations,