iticket-seatingplan-dev 1.0.16 → 1.0.18

package/dist/components/SeatingPlan.js

@@ -10,19 +10,24 @@ var _reactLeaflet = require("react-leaflet");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 const wheelchairSeat = require('.//assets/wheelchair.png');
+let NZDollar = new Intl.NumberFormat('en-NZ', {
+  style: 'currency',
+  currency: 'NZD'
+});
 const SeatingPlan = _ref => {
   let {
     eventId,
-    showingUid,
+    eventVenueId,
     sessionId,
     showingId,
-    priceAgeId,
+    areaId,
     priceSectionId,
     price,
     quantity,
     callbackFunction,
     apiKey,
-    baseUrl
+    baseUrl,
+    countryCode
   } = _ref;
   const [position, setPosition] = (0, _react.useState)(null);
   const [height, setHeight] = (0, _react.useState)(0);
@@ -43,13 +48,94 @@ const SeatingPlan = _ref => {
   };
   const setInitialColor = s => {
     return {
-      fillColor: s.status === 1 ? statusColors.available : s.status === 4 ? s.bookedPrice === price ? statusColors.booked : statusColors.bookedWithDifferentPrice : statusColors.sold,
+      fillColor: s.s === 1 ? statusColors.available : s.s === 4 ? s.bookedPrice === price ? statusColors.booked : statusColors.bookedWithDifferentPrice : statusColors.sold,
       color: 'none',
       fillOpacity: 100
     };
   };
+  const addTicketToCart = (s, priceAgeId) => {
+    setProcessing(true);
+    fetch("".concat(baseUrl, "/legacy/").concat(countryCode, "/shop/events/").concat(eventId, "/").concat(eventVenueId, "/showings/").concat(showingId, "/tickets/allocated/").concat(areaId), {
+      method: 'POST',
+      body: JSON.stringify({
+        priceAgeId: priceAgeId,
+        seatId: s.ssId
+      }),
+      headers: {
+        'content-type': 'application/json',
+        'basket-key': sessionId
+      }
+    }).then(response => response.json()).then(response => {
+      s.s = 4;
+      s.bookedPrice = price;
+      chosenSeat.circle.target.setStyle({
+        fillColor: statusColors.booked
+      });
+      setProcessing(false);
+      setBookedSeats([...bookedSeats, {
+        ssId: s.ssId,
+        r: s.r,
+        c: s.c,
+        showingId: showingId,
+        p: price || s.defaultPrice,
+        paName: s.priceAgeName
+      }]);
+    }).catch(error => {
+      chosenSeat.circle.target.setStyle({
+        fillColor: statusColors.available
+      });
+      const event = {
+        type: 'error',
+        details: s.pMin && s.pMax && (price < s.pMin || price > s.pMax) ? {
+          error: {
+            code: 403,
+            message: 'Price specified not allowed.'
+          }
+        } : {
+          error: {
+            code: 500,
+            message: 'Oops! Something went wrong. Please try again.'
+          }
+        }
+      };
+      callbackFunction(event);
+      setProcessing(false);
+    });
+  };
+  const removeTicketFromCart = (s, e) => {
+    setProcessing(true);
+    fetch("".concat(baseUrl, "/legacy/").concat(countryCode, "/shop/events/").concat(eventId, "/").concat(eventVenueId, "/showings/").concat(showingId, "/tickets/allocated/").concat(areaId, "/seat/").concat(s.ssId), {
+      method: 'DELETE',
+      headers: {
+        'basket-key': sessionId
+      }
+    }).then(response => response.json()).then(response => {
+      s.s = 1;
+      s.bookedPrice = null;
+      e.target.setStyle({
+        fillColor: statusColors.available
+      });
+      setBookedSeats(bookedSeats.filter(bs => bs.ssId !== s.ssId));
+      setProcessing(false);
+    }).catch(error => {
+      e.target.setStyle({
+        fillColor: statusColors.booked
+      });
+      const event = {
+        type: 'error',
+        details: {
+          error: {
+            code: 500,
+            message: 'Oops! Something went wrong. Please try again.'
+          }
+        }
+      };
+      callbackFunction(event);
+      setProcessing(false);
+    });
+  };
   const handleClick = (e, s) => {
-    if (s.status !== 1 && s.status !== 4 || processing || bookedSeats.length >= quantity && s.status === 1) {
+    if (s.s !== 1 && s.s !== 4 || processing || bookedSeats.length >= quantity && s.s === 1) {
       if (bookedSeats.length >= quantity) {
         const event = {
           type: 'error',
@@ -65,127 +151,28 @@ const SeatingPlan = _ref => {
       circle: e,
       seat: s
     });
-    setProcessing(true);
-    if (s.status === 1) {
-      fetch("https://iticket-shop-dev.azurewebsites.net/seatingplan/addseat", {
-        method: 'POST',
-        body: JSON.stringify({
-          basketKey: '',
-          eventId: eventId,
-          showingId: showingId,
-          priceAgeId: priceAgeId,
-          seatId: s.showingSeatId,
-          status: s.status,
-          price: price
-        }),
-        headers: {
-          'content-type': 'application/json',
-          'session-id': "ASP.NET_SessionId=".concat(sessionId),
-          'showingseat-id': s.showingSeatId
-        }
-      }).then(response => response.json()).then(response => {
-        s.status = 4;
-        s.bookedPrice = price;
-        e.target.setStyle({
-          fillColor: statusColors.booked
-        });
-        setProcessing(false);
-        setBookedSeats([...bookedSeats, {
-          showingSeatId: s.showingSeatId,
-          rowName: s.rowName,
-          columnName: s.columnName,
-          showingId: showingId,
-          price: price || s.defaultPrice,
-          priceAgeName: s.priceAgeName
-        }]);
-      }).catch(error => {
-        e.target.setStyle({
-          fillColor: statusColors.available
-        });
-        const event = {
-          type: 'error',
-          details: s.priceMinimum && s.priceMaximum && (price < s.priceMinimum || price > s.priceMaximum) ? {
-            error: {
-              code: 403,
-              message: 'Price specified not allowed.'
-            }
-          } : {
-            error: {
-              code: 500,
-              message: 'Oops! Something went wrong. Please try again.'
-            }
-          }
-        };
-        callbackFunction(event);
-        setProcessing(false);
-      });
+    if (s.s === 1) {
+      const availablePrices = seats.pricing.filter(price => price.psId === priceSectionId);
+      availablePrices.length === 1 && addTicketToCart(s, availablePrices[0].paId);
     } else {
-      if (s.bookedPrice === price) {
-        fetch("https://iticket-shop-dev.azurewebsites.net/seatingplan/removeseat", {
-          method: 'POST',
-          body: JSON.stringify({
-            basketKey: '',
-            seatId: s.showingSeatId
-          }),
-          headers: {
-            'content-type': 'application/json',
-            'session-id': "ASP.NET_SessionId=".concat(sessionId),
-            'showingseat-id': s.showingSeatId
-          }
-        }).then(response => response.json()).then(response => {
-          s.status = 1;
-          s.bookedPrice = null;
-          e.target.setStyle({
-            fillColor: statusColors.available
-          });
-          setBookedSeats(bookedSeats.filter(bs => bs.showingSeatId !== s.showingSeatId));
-          setProcessing(false);
-        }).catch(error => {
-          e.target.setStyle({
-            fillColor: statusColors.booked
-          });
-          const event = {
-            type: 'error',
-            details: {
-              error: {
-                code: 500,
-                message: 'Oops! Something went wrong. Please try again.'
-              }
-            }
-          };
-          callbackFunction(event);
-          setProcessing(false);
-        });
-      } else {
-        const event = {
-          type: 'error',
-          details: {
-            error: {
-              code: 403,
-              message: "Unable to remove seat. Price specified does not match the selected seat price, please select $".concat(s.bookedPrice, " to be able to remove this seat.")
-            }
-          }
-        };
-        callbackFunction(event);
-        setProcessing(false);
-      }
+      removeTicketFromCart(s, e);
     }
   };
   // https://ecommerce-main-f0c3c0b.d2.zuplo.dev
   (0, _react.useEffect)(() => {
     if (!position && !error) {
-      fetch("".concat(baseUrl, "/ecommerce/v1/events/").concat(eventId, "/showings/").concat(showingId, "/seats?priceage=").concat(priceAgeId), {
+      fetch("".concat(baseUrl, "/legacy/").concat(countryCode, "/shop/events/").concat(eventId, "/").concat(eventVenueId, "/showings/").concat(showingId, "/tickets/allocated/").concat(areaId), {
         headers: {
-          basketId: sessionId,
+          'basket-key': sessionId,
           Authorization: "Bearer ".concat(apiKey)
         }
       }).then(response => response.json() || null).then(data => {
         const img = new Image();
         img.src = data.background;
-        setBookedSeats(data.seats.filter(s => s.status === 4 && s.bookedPrice === price).map(s => ({
-          showingSeatId: s.showingSeatId,
-          rowName: s.rowName,
-          columnName: s.columnName,
+        setBookedSeats(data.seats.filter(s => s.s === 4 && s.bookedPrice === price).map(s => ({
+          showingSeatId: s.ssId,
+          rowName: s.r,
+          columnName: s.c,
           showingId: showingId,
           price: price || s.defaultPrice,
           priceAgeName: s.priceAgeName
@@ -222,7 +209,7 @@ const SeatingPlan = _ref => {
         fillOpacity: 0
       });
     }
-  }, [chosenSeat]);
+  }, [chosenSeat, processing]);
 
   // return seating plan
   return /*#__PURE__*/_react.default.createElement("div", {
@@ -240,7 +227,6 @@ const SeatingPlan = _ref => {
       minHeight: '500px',
       height: '100%'
     }
-    // onClick={handleClick}
   }, /*#__PURE__*/_react.default.createElement(_reactLeaflet.ImageOverlay, {
     url: seats.background,
     bounds: [[0, 0], [height * 0.03, width * 0.03]],
@@ -249,18 +235,18 @@ const SeatingPlan = _ref => {
     key: i
   }, /*#__PURE__*/_react.default.createElement(_reactLeaflet.ImageOverlay, {
     url: "https://iticketseatingplan.blob.core.windows.net/embed/static/media/rippleload.08e6a08dd832819226ef.gif",
-    bounds: [[height * 0.03 - s.raw_y * 0.61 - 0.2, s.raw_x * 0.615 - 0.2], [height * 0.03 - s.raw_y * 0.61 + 0.2, s.raw_x * 0.615 + 0.2]],
-    opacity: chosenSeat && chosenSeat.seat.showingSeatId === s.showingSeatId ? 100 : 0,
+    bounds: [[height * 0.03 - s.y * 0.61 - 0.2, s.x * 0.615 - 0.2], [height * 0.03 - s.y * 0.61 + 0.2, s.x * 0.615 + 0.2]],
+    opacity: chosenSeat && chosenSeat.seat.ssId === s.ssId ? 100 : 0,
     zIndex: 10
-  }), !priceSectionId || s.priceSectionId === priceSectionId ? s.status === 6 ? /*#__PURE__*/_react.default.createElement(_reactLeaflet.ImageOverlay, {
+  }), !priceSectionId || s.psId === priceSectionId ? s.s === 6 ? /*#__PURE__*/_react.default.createElement(_reactLeaflet.ImageOverlay, {
     url: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNTBweCIgaGVpZ2h0PSI1MHB4IiB2aWV3Qm94PSIwIDAgNTAgNTAiIHZlcnNpb249IjEuMSI+CjxnIGlkPSJzdXJmYWNlMSI+CjxwYXRoIHN0eWxlPSIgc3Ryb2tlOm5vbmU7ZmlsbC1ydWxlOm5vbnplcm87ZmlsbDpyZ2IoMCUsMCUsMCUpO2ZpbGwtb3BhY2l0eToxOyIgZD0iTSAzNC4xMjg5MDYgNDEuMzA0Njg4IEMgMzMuMjY5NTMxIDQwLjQ0OTIxOSAzMS45MDYyNSA0MC4zNzUgMzAuOTY0ODQ0IDQxLjE0MDYyNSBDIDI4LjY0ODQzOCA0My4wMTk1MzEgMjUuNzczNDM4IDQ0LjA2NjQwNiAyMi43MzgyODEgNDQuMDY2NDA2IEMgMTUuNDU3MDMxIDQ0LjA2NjQwNiA5LjUzMTI1IDM4LjE0MDYyNSA5LjUzMTI1IDMwLjg1NTQ2OSBDIDkuNTMxMjUgMjcuNjI4OTA2IDEwLjcxODc1IDI0LjU2NjQwNiAxMi44MzU5MzggMjIuMTcxODc1IEMgMTMuNSAyMS40MTc5NjkgMTMuNDg0Mzc1IDIwLjI4MTI1IDEyLjc4OTA2MiAxOS41NTA3ODEgQyAxMi4zMzk4NDQgMTkuMDc0MjE5IDExLjg5NDUzMSAxOC41OTc2NTYgMTEuNDQ1MzEyIDE4LjEyMTA5NCBDIDExLjA4MjAzMSAxNy43MzgyODEgMTAuNTc4MTI1IDE3LjUyMzQzOCAxMC4wNTA3ODEgMTcuNTIzNDM4IEMgOS41MjM0MzggMTcuNTI3MzQ0IDkuMDIzNDM4IDE3Ljc1IDguNjY3OTY5IDE4LjEzNjcxOSBDIDcuNTY2NDA2IDE5LjMyODEyNSA2LjYxNzE4OCAyMC42NTIzNDQgNS44NjcxODggMjIuMDg1OTM4IEMgNC40NjA5MzggMjQuNzczNDM4IDMuNzE4NzUgMjcuODA4NTk0IDMuNzE4NzUgMzAuODU1NDY5IEMgMy43MTg3NSA0MS4zNDM3NSAxMi4yNTM5MDYgNDkuODc4OTA2IDIyLjc0MjE4OCA0OS44Nzg5MDYgQyAyNS43Njk1MzEgNDkuODc4OTA2IDI4Ljc4NTE1NiA0OS4xNDQ1MzEgMzEuNDY0ODQ0IDQ3Ljc1NzgxMiBDIDMyLjYyNSA0Ny4xNTYyNSAzMy43MjI2NTYgNDYuNDI5Njg4IDM0LjczODI4MSA0NS42MDE1NjIgQyAzNS4yNTM5MDYgNDUuMTc5Njg4IDM1LjU3MDMxMiA0NC41NTQ2ODggMzUuNjA1NDY5IDQzLjg4NjcxOSBDIDM1LjYzNjcxOSA0My4yMTg3NSAzNS4zOTA2MjUgNDIuNTY2NDA2IDM0LjkxNDA2MiA0Mi4wOTM3NSBaIE0gMzQuMTI4OTA2IDQxLjMwNDY4OCAiLz4KPHBhdGggc3R5bGU9IiBzdHJva2U6bm9uZTtmaWxsLXJ1bGU6bm9uemVybztmaWxsOnJnYigwJSwwJSwwJSk7ZmlsbC1vcGFjaXR5OjE7IiBkPSJNIDE2LjgxMjUgOS4yODUxNTYgQyAxOS4zNzEwOTQgOS4yODUxNTYgMjEuNDUzMTI1IDcuMjAzMTI1IDIxLjQ1MzEyNSA0LjY0NDUzMSBDIDIxLjQ1MzEyNSAyLjA4MjAzMSAxOS4zNzEwOTQgMCAxNi44MTI1IDAgQyAxNC4yNSAwIDEyLjE2Nzk2OSAyLjA4MjAzMSAxMi4xNjc5NjkgNC42NDQ1MzEgQyAxMi4xNjc5NjkgNy4yMDMxMjUgMTQuMjUgOS4yODUxNTYgMTYuODEyNSA5LjI4NTE1NiBaIE0gMTYuODEyNSA5LjI4NTE1NiAiLz4KPHBhdGggc3R5bGU9IiBzdHJva2U6bm9uZTtmaWxsLXJ1bGU6bm9uemVybztmaWxsOnJnYigwJSwwJSwwJSk7ZmlsbC1vcGFjaXR5OjE7IiBkPSJNIDQ2LjIzNDM3NSA0Ni41NzAzMTIgTCA0My4zMTY0MDYgMzAuNjA5Mzc1IEMgNDMuMTQwNjI1IDI5LjYyNSA0Mi41NTg1OTQgMjguNzQyMTg4IDQxLjczNDM3NSAyOC4xNzk2ODggQyA0MS4xMTMyODEgMjcuNzU3ODEyIDQwLjM4MjgxMiAyNy41MzEyNSAzOS42Mjg5MDYgMjcuNTMxMjUgQyAzOS4zODI4MTIgMjcuNTMxMjUgMzkuMTMyODEyIDI3LjU1NDY4OCAzOC44OTQ1MzEgMjcuNjAxNTYyIEwgMjUuNTg1OTM4IDMwLjI2MTcxOSBDIDI1LjUzOTA2MiAzMC4yNzM0MzggMjUuNDkyMTg4IDMwLjI3NzM0NCAyNS40NDUzMTIgMzAuMjc3MzQ0IEMgMjUuMTEzMjgxIDMwLjI3NzM0NCAyNC44MjQyMTkgMzAuMDM5MDYyIDI0Ljc1NzgxMiAyOS43MTA5MzggTCAyMy42NjAxNTYgMjQuMzA4NTk0IEwgMzIuODk4NDM4IDIyLjczNDM3NSBDIDM0LjM0NzY1NiAyMi40ODQzNzUgMzUuMzI4MTI1IDIxLjEwNTQ2OSAzNS4wNzgxMjUgMTkuNjU2MjUgQyAzNC44NTkzNzUgMTguMzcxMDk0IDMzLjc1MzkwNiAxNy40Mzc1IDMyLjQ0NTMxMiAxNy40Mzc1IEMgMzIuMjk2ODc1IDE3LjQzNzUgMzIuMTQ4NDM4IDE3LjQ0OTIxOSAzMiAxNy40NzI2NTYgTCAyMi41OTc2NTYgMTkuMDc4MTI1IEwgMjEuMzkwNjI1IDEzLjEyODkwNiBDIDIxLjEzNjcxOSAxMS43NDYwOTQgMTkuOTM3NSAxMC43NDYwOTQgMTguNTM1MTU2IDEwLjc0NjA5NCBDIDE4LjM1OTM3NSAxMC43NDYwOTQgMTguMTc5Njg4IDEwLjc2MTcxOSAxOC4wMDc4MTIgMTAuNzkyOTY5IEMgMTcuMjQyMTg4IDEwLjkyOTY4OCAxNi41NzgxMjUgMTEuMzU5Mzc1IDE2LjE0MDYyNSAxMiBDIDE1LjY5NTMxMiAxMi42NDA2MjUgMTUuNTMxMjUgMTMuNDEwMTU2IDE1LjY3MTg3NSAxNC4xNzk2ODggTCAxOS41MTk1MzEgMzMuNTc0MjE5IEMgMTkuNzE0ODQ0IDM0LjU1ODU5NCAyMC4yODEyNSAzNS40MDYyNSAyMS4xMTMyODEgMzUuOTYwOTM4IEMgMjEuNzM0Mzc1IDM2LjM3NSAyMi40NTMxMjUgMzYuNTkzNzUgMjMuMTk5MjE5IDM2LjU5Mzc1IEMgMjMuNDQ1MzEyIDM2LjU5Mzc1IDIzLjY5MTQwNiAzNi41NzAzMTIgMjMuOTMzNTk0IDM2LjUxOTUzMSBMIDM3LjI2OTUzMSAzMy44NTkzNzUgQyAzNy40NTcwMzEgMzMuODIwMzEyIDM3LjY1MjM0NCAzMy44NTkzNzUgMzcuODA4NTk0IDMzLjk2NDg0NCBDIDM3Ljk2MDkzOCAzNC4wNzAzMTIgMzguMDcwMzEyIDM0LjIzODI4MSAzOC4xMDU0NjkgMzQuNDIxODc1IEwgNDAuNTE1NjI1IDQ3LjYxNzE4OCBDIDQwLjc2NTYyNSA0OSA0MS45Njg3NSA1MC4wMDM5MDYgNDMuMzcxMDk0IDUwLjAwMzkwNiBDIDQzLjU0Njg3NSA1MC4wMDM5MDYgNDMuNzE4NzUgNDkuOTg0Mzc1IDQzLjg5NDUzMSA0OS45NTMxMjUgQyA0NC42NjAxNTYgNDkuODE2NDA2IDQ1LjMyMDMxMiA0OS4zODY3MTkgNDUuNzYxNzE5IDQ4Ljc0NjA5NCBDIDQ2LjIwNzAzMSA0OC4xMDkzNzUgNDYuMzcxMDk0IDQ3LjMzNTkzOCA0Ni4yMzQzNzUgNDYuNTcwMzEyIFogTSA0Ni4yMzQzNzUgNDYuNTcwMzEyICIvPgo8L2c+Cjwvc3ZnPgo=',
-    bounds: [[height * 0.03 - s.raw_y * 0.61 - 0.17, s.raw_x * 0.615 - 0.17], [height * 0.03 - s.raw_y * 0.61 + 0.17, s.raw_x * 0.615 + 0.17]],
+    bounds: [[height * 0.03 - s.y * 0.61 - 0.17, s.x * 0.615 - 0.17], [height * 0.03 - s.y * 0.61 + 0.17, s.x * 0.615 + 0.17]],
     zIndex: 10
   }) : /*#__PURE__*/_react.default.createElement(_reactLeaflet.Circle, {
     center: [
-    // (width * 0.03 - (s.raw_y - 11.5)) * 0.65,
-    // s.raw_x * 0.64,
-    height * 0.03 - s.raw_y * 0.61, s.raw_x * 0.615],
+    // (width * 0.03 - (s.y - 11.5)) * 0.65,
+    // s.x * 0.64,
+    height * 0.03 - s.y * 0.61, s.x * 0.615],
     pathOptions: setInitialColor(s),
     radius: 20000,
     eventHandlers: {
@@ -270,7 +256,32 @@ const SeatingPlan = _ref => {
   }, /*#__PURE__*/_react.default.createElement(_reactLeaflet.Tooltip, {
     direction: 'top',
     offset: [0, height * 0.03 + -30]
-  }, s.rowName + '-' + s.columnName, ' ', s.bookedPrice && s.bookedPrice !== price && "(Select $".concat(s.bookedPrice, " to remove from cart.)"))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)))) : /*#__PURE__*/_react.default.createElement("div", {
+  }, s.r + '-' + s.c, ' '), s.s === 1 && /*#__PURE__*/_react.default.createElement(_reactLeaflet.Popup, null, /*#__PURE__*/_react.default.createElement("p", {
+    style: {
+      marginTop: '0.2rem',
+      marginBottom: '0.2rem',
+      fontWeight: 'bold'
+    }
+  }, "Select option:"), seats.pricing.filter(price => price.psId === priceSectionId).map(price => /*#__PURE__*/_react.default.createElement("div", {
+    key: price.paId,
+    style: {
+      minWidth: '10rem',
+      borderRadius: '0.25rem',
+      padding: '0.5rem',
+      border: '1px solid #bdc3c7',
+      marginBottom: '0.2rem',
+      cursor: 'pointer'
+    },
+    onClick: () => addTicketToCart(s, price.paId)
+  }, /*#__PURE__*/_react.default.createElement("p", {
+    style: {
+      margin: '0px'
+    }
+  }, price.paName, /*#__PURE__*/_react.default.createElement("span", {
+    style: {
+      float: 'right'
+    }
+  }, NZDollar.format(price.p))))))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)))) : /*#__PURE__*/_react.default.createElement("div", {
     className: "loading"
   }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("svg", {
     width: "105",

package/dist/components/styles/index.css

@@ -248,7 +248,7 @@ svg.leaflet-zoom-animated {
 /* cursors */
 
 .leaflet-interactive {
-	cursor: default;
+	cursor: pointer;
 	}
 .leaflet-grab {
 	cursor: -webkit-grab;
@@ -519,7 +519,7 @@ svg.leaflet-image-layer.leaflet-interactive path {
 	border-radius: 12px;
 	}
 .leaflet-popup-content {
-	margin: 13px 24px 13px 20px;
+	margin: 0.5rem;
 	line-height: 1.3;
 	font-size: 13px;
 	font-size: 1.08333em;
@@ -570,6 +570,7 @@ svg.leaflet-image-layer.leaflet-interactive path {
 	color: #757575;
 	text-decoration: none;
 	background: transparent;
+	display: none;
 	}
 .leaflet-container a.leaflet-popup-close-button:hover,
 .leaflet-container a.leaflet-popup-close-button:focus {

package/package.json

@@ -2,7 +2,7 @@
   "name": "iticket-seatingplan-dev",
   "description": "Seating plan with FLEXi pricing",
   "author": "gedwyne",
-  "version": "1.0.16",
+  "version": "1.0.18",
   "private": false,
   "keywords": [
     "iticket",