@blaze-cms/plugin-google-maps-fe 0.146.0-translations.8 → 0.147.0-rc-eagle.4

package/lib/GoogleMaps/helpers/set-shapes.js

@@ -1,274 +1,197 @@
 "use strict";
 
-require("core-js/modules/es.symbol.js");
-require("core-js/modules/es.array.filter.js");
-require("core-js/modules/es.object.define-properties.js");
-require("core-js/modules/es.object.define-property.js");
-require("core-js/modules/es.object.get-own-property-descriptor.js");
-require("core-js/modules/es.object.get-own-property-descriptors.js");
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = void 0;
+exports.default = void 0;
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-require("core-js/modules/es.array.every.js");
-require("core-js/modules/es.array.find.js");
-require("core-js/modules/es.array.for-each.js");
-require("core-js/modules/es.array.includes.js");
-require("core-js/modules/es.array.iterator.js");
-require("core-js/modules/es.array.map.js");
-require("core-js/modules/es.array.reduce.js");
-require("core-js/modules/es.object.keys.js");
-require("core-js/modules/es.object.to-string.js");
-require("core-js/modules/es.promise.js");
-require("core-js/modules/es.string.includes.js");
-require("core-js/modules/es.string.iterator.js");
-require("core-js/modules/web.dom-collections.for-each.js");
-require("core-js/modules/web.dom-collections.iterator.js");
 var _react = _interopRequireDefault(require("react"));
 var _lodash = _interopRequireDefault(require("lodash.isnumber"));
-var _server = _interopRequireDefault(require("react-dom/server"));
+var ReactDOMServer = _interopRequireWildcard(require("react-dom/server"));
 var _nextjsComponents = require("@blaze-cms/nextjs-components");
 var _client = require("@apollo/client");
 var _reactPageBuilder = require("@blaze-cms/react-page-builder");
 var _getPath = _interopRequireDefault(require("./get-path"));
 var _constants = require("../../constants");
-var _excluded = ["elementTitle", "type", "propsToDisplay"];
+const _excluded = ["elementTitle", "type", "propsToDisplay"];
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var shapesArray = [];
-var infoWindowArray = [];
-var clearShapes = function clearShapes() {
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+const shapesArray = [];
+const infoWindowArray = [];
+const clearShapes = () => {
   if (shapesArray.length) {
-    shapesArray.forEach(function (shape) {
-      return shape.setMap(null);
-    });
+    shapesArray.forEach(shape => shape.setMap(null));
     shapesArray.length = 0;
   }
 };
-var closeInfoWindows = function closeInfoWindows() {
+const closeInfoWindows = () => {
   if (infoWindowArray.length) {
-    infoWindowArray.forEach(function (infoWindow) {
-      return infoWindow.close();
-    });
+    infoWindowArray.forEach(infoWindow => infoWindow.close());
     infoWindowArray.length = 0;
   }
 };
-var addShapeListeners = function addShapeListeners(map, router, shape, imageData, shapeInstance, client) {
-  var _shape$enableInfoPane = shape.enableInfoPane,
-    enableInfoPane = _shape$enableInfoPane === void 0 ? false : _shape$enableInfoPane,
-    _shape$dataSummaries = shape.dataSummaries,
-    dataSummaries = _shape$dataSummaries === void 0 ? [] : _shape$dataSummaries,
-    url = shape.url,
-    shapeData = shape.shapeData;
+const addShapeListeners = (map, router, shape, imageData, shapeInstance, client) => {
+  const {
+    enableInfoPane = false,
+    dataSummaries = [],
+    url,
+    shapeData
+  } = shape;
   if (enableInfoPane) {
-    var infoWindow = new window.google.maps.InfoWindow({
+    const infoWindow = new window.google.maps.InfoWindow({
       content: ''
     });
-    shapeInstance.addListener(_constants.CLICK, /*#__PURE__*/function () {
-      var _ref = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(event) {
-        var content;
-        return _regenerator["default"].wrap(function _callee$(_context) {
-          while (1) switch (_context.prev = _context.next) {
-            case 0:
-              closeInfoWindows();
-              _context.t0 = _server["default"];
-              _context.next = 4;
-              return infoWindowContent(imageData, dataSummaries, url, shapeData, client);
-            case 4:
-              _context.t1 = _context.sent;
-              content = _context.t0.renderToString.call(_context.t0, _context.t1);
-              infoWindow.setContent(content);
-              infoWindow.setPosition(event.latLng);
-              infoWindow.open(map, shapeInstance);
-              infoWindowArray.push(infoWindow);
-            case 10:
-            case "end":
-              return _context.stop();
-          }
-        }, _callee);
-      }));
-      return function (_x) {
-        return _ref.apply(this, arguments);
-      };
-    }());
+    shapeInstance.addListener(_constants.CLICK, async event => {
+      closeInfoWindows();
+      const content = ReactDOMServer.renderToString(await infoWindowContent(imageData, dataSummaries, url, shapeData, client));
+      infoWindow.setContent(content);
+      infoWindow.setPosition(event.latLng);
+      infoWindow.open(map, shapeInstance);
+      infoWindowArray.push(infoWindow);
+    });
   } else if (url) {
-    shapeInstance.addListener(_constants.CLICK, function () {
+    shapeInstance.addListener(_constants.CLICK, () => {
       router.push(url);
     });
   }
 };
-var setStyleOptions = function setStyleOptions(shape) {
-  var strokeColor = shape.strokeColor,
-    strokeOpacity = shape.strokeOpacity,
-    strokeWeight = shape.strokeWeight,
-    fillColor = shape.fillColor,
-    fillOpacity = shape.fillOpacity;
-  var styleSettings = {
-    strokeColor: strokeColor,
-    fillColor: fillColor,
-    strokeOpacity: strokeOpacity,
-    strokeWeight: strokeWeight,
-    fillOpacity: fillOpacity
+const setStyleOptions = shape => {
+  const {
+    strokeColor,
+    strokeOpacity,
+    strokeWeight,
+    fillColor,
+    fillOpacity
+  } = shape;
+  const styleSettings = {
+    strokeColor,
+    fillColor,
+    strokeOpacity,
+    strokeWeight,
+    fillOpacity
   };
-  return _objectSpread({}, Object.keys(styleSettings).reduce(function (acc, key) {
-    var settingValue = styleSettings[key];
-    var shouldValueBeNumber = !key.includes(_constants.COLOR);
-    var hasValuePassedCondition = shouldValueBeNumber ? (0, _lodash["default"])(settingValue) : settingValue;
+  return _objectSpread({}, Object.keys(styleSettings).reduce((acc, key) => {
+    const settingValue = styleSettings[key];
+    const shouldValueBeNumber = !key.includes(_constants.COLOR);
+    const hasValuePassedCondition = shouldValueBeNumber ? (0, _lodash.default)(settingValue) : settingValue;
     if (hasValuePassedCondition) acc[key] = settingValue;
     return acc;
   }, {}));
 };
-var areRectangleBoundsNumbers = function areRectangleBoundsNumbers(bounds) {
-  return bounds.every(function (bound) {
-    return (0, _lodash["default"])(bound);
-  });
-};
-var isPositionCorrect = function isPositionCorrect(lat, lng) {
-  return (0, _lodash["default"])(lat) && (0, _lodash["default"])(lng);
-};
-var getIconUrl = function getIconUrl(imageId, imageData) {
+const areRectangleBoundsNumbers = bounds => bounds.every(bound => (0, _lodash.default)(bound));
+const isPositionCorrect = (lat, lng) => (0, _lodash.default)(lat) && (0, _lodash.default)(lng);
+const getIconUrl = (imageId, imageData) => {
   if (!imageId) return '';
-  var image = imageData.find(function (_ref2) {
-    var id = _ref2.id;
-    return id === imageId;
-  });
+  const image = imageData.find(({
+    id
+  }) => id === imageId);
   if (!image || !image.url) return '';
   return image.url;
 };
-var infoWindowContent = /*#__PURE__*/function () {
-  var _ref3 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3(imageData, dataSummaries, url, shapeData, client) {
-    var summariesWithContent, _ref5, imageId, image, shouldShowImage, getImageElement;
-    return _regenerator["default"].wrap(function _callee3$(_context3) {
-      while (1) switch (_context3.prev = _context3.next) {
-        case 0:
-          _context3.next = 2;
-          return Promise.all(dataSummaries.map( /*#__PURE__*/function () {
-            var _ref4 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2(dataSummary) {
-              var elementTitle, type, propsToDisplay, otherProps, isTypeHeading, summaryPropsWithContent, modifier, SummaryComponent, getDataSummaryComponent;
-              return _regenerator["default"].wrap(function _callee2$(_context2) {
-                while (1) switch (_context2.prev = _context2.next) {
-                  case 0:
-                    elementTitle = dataSummary.elementTitle, type = dataSummary.type, propsToDisplay = dataSummary.propsToDisplay, otherProps = (0, _objectWithoutProperties2["default"])(dataSummary, _excluded);
-                    isTypeHeading = type === _constants.HEADING_LARGE;
-                    summaryPropsWithContent = (0, _reactPageBuilder.buildPropsToDisplayWithContent)(shapeData, propsToDisplay);
-                    modifier = (0, _reactPageBuilder.getClassModifiers)(_constants.LIST, otherProps);
-                    SummaryComponent = _reactPageBuilder.summaryComponents[type];
-                    _context2.next = 7;
-                    return SummaryComponent.render.preload();
-                  case 7:
-                    if (summaryPropsWithContent.length) {
-                      _context2.next = 9;
-                      break;
-                    }
-                    return _context2.abrupt("return", null);
-                  case 9:
-                    getDataSummaryComponent = function getDataSummaryComponent() {
-                      var component = /*#__PURE__*/_react["default"].createElement(_client.ApolloProvider, {
-                        client: client
-                      }, /*#__PURE__*/_react["default"].createElement(SummaryComponent, {
-                        key: type,
-                        modifier: modifier,
-                        elementTitle: elementTitle,
-                        summaryPropsWithContent: summaryPropsWithContent
-                      }));
-                      if (isTypeHeading && url) return /*#__PURE__*/_react["default"].createElement(_nextjsComponents.Link, {
-                        href: url
-                      }, component);
-                      return component;
-                    };
-                    return _context2.abrupt("return", getDataSummaryComponent());
-                  case 11:
-                  case "end":
-                    return _context2.stop();
-                }
-              }, _callee2);
-            }));
-            return function (_x7) {
-              return _ref4.apply(this, arguments);
-            };
-          }()));
-        case 2:
-          summariesWithContent = _context3.sent;
-          _ref5 = shapeData || {}, imageId = _ref5.imageId;
-          image = imageData.find(function (_ref6) {
-            var id = _ref6.id;
-            return id === imageId;
-          });
-          shouldShowImage = image && image.url;
-          getImageElement = function getImageElement() {
-            var imageUrl = image.url,
-              data = image.data;
-            var imageElement = /*#__PURE__*/_react["default"].createElement("img", {
-              className: "info__window",
-              src: imageUrl,
-              alt: data && data.altText ? data.altText : ''
-            });
-            if (url) return /*#__PURE__*/_react["default"].createElement(_nextjsComponents.Link, {
-              href: url
-            }, imageElement);
-            return imageElement;
-          };
-          return _context3.abrupt("return", /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, shouldShowImage && getImageElement(), summariesWithContent));
-        case 8:
-        case "end":
-          return _context3.stop();
-      }
-    }, _callee3);
+const infoWindowContent = async (imageData, dataSummaries, url, shapeData, client) => {
+  const summariesWithContent = await Promise.all(dataSummaries.map(async dataSummary => {
+    const {
+        elementTitle,
+        type,
+        propsToDisplay
+      } = dataSummary,
+      otherProps = (0, _objectWithoutProperties2.default)(dataSummary, _excluded);
+    const isTypeHeading = type === _constants.HEADING_LARGE;
+    const summaryPropsWithContent = (0, _reactPageBuilder.buildPropsToDisplayWithContent)(shapeData, propsToDisplay);
+    const modifier = (0, _reactPageBuilder.getClassModifiers)(_constants.LIST, otherProps);
+    const SummaryComponent = _reactPageBuilder.summaryComponents[type];
+    await SummaryComponent.render.preload(); // preload dynamic nextjs component
+
+    if (!summaryPropsWithContent.length) return null;
+    const getDataSummaryComponent = () => {
+      const component = /*#__PURE__*/_react.default.createElement(_client.ApolloProvider, {
+        client: client
+      }, /*#__PURE__*/_react.default.createElement(SummaryComponent, {
+        key: type,
+        modifier: modifier,
+        elementTitle: elementTitle,
+        summaryPropsWithContent: summaryPropsWithContent
+      }));
+      if (isTypeHeading && url) return /*#__PURE__*/_react.default.createElement(_nextjsComponents.Link, {
+        href: url
+      }, component);
+      return component;
+    };
+    return getDataSummaryComponent();
   }));
-  return function infoWindowContent(_x2, _x3, _x4, _x5, _x6) {
-    return _ref3.apply(this, arguments);
+  const {
+    imageId
+  } = shapeData || {};
+  const image = imageData.find(({
+    id
+  }) => id === imageId);
+  const shouldShowImage = image && image.url;
+  const getImageElement = () => {
+    const {
+      url: imageUrl,
+      data
+    } = image;
+    const imageElement = /*#__PURE__*/_react.default.createElement("img", {
+      className: "info__window",
+      src: imageUrl,
+      alt: data && data.altText ? data.altText : ''
+    });
+    if (url) return /*#__PURE__*/_react.default.createElement(_nextjsComponents.Link, {
+      href: url
+    }, imageElement);
+    return imageElement;
   };
-}();
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, shouldShowImage && getImageElement(), summariesWithContent);
+};
 function getIcon(imageData, shape) {
-  var imageId = shape.imageId,
-    _shape$markerWidth = shape.markerWidth,
-    markerWidth = _shape$markerWidth === void 0 ? 50 : _shape$markerWidth,
-    _shape$markerHeight = shape.markerHeight,
-    markerHeight = _shape$markerHeight === void 0 ? 50 : _shape$markerHeight,
-    strokeColor = shape.strokeColor,
-    strokeOpacity = shape.strokeOpacity,
-    strokeWeight = shape.strokeWeight,
-    fillColor = shape.fillColor,
-    fillOpacity = shape.fillOpacity,
-    svgPath = shape.svgPath;
-  var iconUrl = getIconUrl(imageId, imageData);
-  var icon = iconUrl ? {
+  const {
+    imageId,
+    markerWidth = 50,
+    markerHeight = 50,
+    strokeColor,
+    strokeOpacity,
+    strokeWeight,
+    fillColor,
+    fillOpacity,
+    svgPath
+  } = shape;
+  const iconUrl = getIconUrl(imageId, imageData);
+  const icon = iconUrl ? {
     url: iconUrl,
     scaledSize: new window.google.maps.Size(markerWidth || 50, markerHeight || 50)
   } : null;
   if (icon) return icon;
   if (!svgPath && !fillColor && !strokeColor) return {}; // any can be true for custom marker
 
-  var svgMarker = {
+  const svgMarker = {
     path: svgPath || _constants.DEFAULT_CUSTOM_MARKER_PATH,
-    strokeColor: strokeColor,
-    strokeOpacity: strokeOpacity,
-    strokeWeight: strokeWeight,
-    fillColor: fillColor,
-    fillOpacity: fillOpacity,
+    strokeColor,
+    strokeOpacity,
+    strokeWeight,
+    fillColor,
+    fillOpacity,
     rotation: 0,
     scale: 2
   };
   return svgMarker;
 }
-var setMarker = function setMarker(map, router, shape, imageData, client) {
-  var _shape$label = shape.label,
-    label = _shape$label === void 0 ? '' : _shape$label,
-    latitude = shape.latitude,
-    longitude = shape.longitude;
+const setMarker = (map, router, shape, imageData, client) => {
+  const {
+    label = '',
+    latitude,
+    longitude
+  } = shape;
   if (isPositionCorrect(latitude, longitude)) {
-    var svgMarker = getIcon(imageData, shape);
-    var marker = new window.google.maps.Marker({
+    const svgMarker = getIcon(imageData, shape);
+    const marker = new window.google.maps.Marker({
       position: {
         lat: latitude,
         lng: longitude
       },
-      map: map,
+      map,
       icon: svgMarker,
       title: label || ''
     });
@@ -277,12 +200,14 @@ var setMarker = function setMarker(map, router, shape, imageData, client) {
     marker.setMap(map);
   }
 };
-var setPolyline = function setPolyline(map, router, shape, imageData) {
-  var paths = shape.paths;
-  var path = (0, _getPath["default"])(paths);
+const setPolyline = (map, router, shape, imageData) => {
+  const {
+    paths
+  } = shape;
+  const path = (0, _getPath.default)(paths);
   if (path.length) {
-    var polyline = new window.google.maps.Polyline(_objectSpread({
-      path: path,
+    const polyline = new window.google.maps.Polyline(_objectSpread({
+      path,
       geodesic: true
     }, setStyleOptions(shape)));
     addShapeListeners(map, router, shape, imageData, polyline);
@@ -290,26 +215,30 @@ var setPolyline = function setPolyline(map, router, shape, imageData) {
     polyline.setMap(map);
   }
 };
-var setPolygon = function setPolygon(map, router, shape, imageData) {
-  var unParsedPaths = shape.paths;
-  var paths = (0, _getPath["default"])(unParsedPaths);
+const setPolygon = (map, router, shape, imageData) => {
+  const {
+    paths: unParsedPaths
+  } = shape;
+  const paths = (0, _getPath.default)(unParsedPaths);
   if (paths.length) {
-    var polygon = new window.google.maps.Polygon(_objectSpread({
-      paths: paths
+    const polygon = new window.google.maps.Polygon(_objectSpread({
+      paths
     }, setStyleOptions(shape)));
     addShapeListeners(map, router, shape, imageData, polygon);
     shapesArray.push(polygon);
     polygon.setMap(map);
   }
 };
-var setRectangle = function setRectangle(map, router, shape, imageData) {
-  var northBound = shape.northBound,
-    southBound = shape.southBound,
-    eastBound = shape.eastBound,
-    westBound = shape.westBound;
+const setRectangle = (map, router, shape, imageData) => {
+  const {
+    northBound,
+    southBound,
+    eastBound,
+    westBound
+  } = shape;
   if (areRectangleBoundsNumbers([northBound, southBound, eastBound, westBound])) {
-    var rectangle = new window.google.maps.Rectangle(_objectSpread(_objectSpread({}, setStyleOptions(shape)), {}, {
-      map: map,
+    const rectangle = new window.google.maps.Rectangle(_objectSpread(_objectSpread({}, setStyleOptions(shape)), {}, {
+      map,
       bounds: {
         north: northBound,
         south: southBound,
@@ -322,31 +251,35 @@ var setRectangle = function setRectangle(map, router, shape, imageData) {
     rectangle.setMap(map);
   }
 };
-var setCircle = function setCircle(map, router, shape, imageData) {
-  var latitude = shape.latitude,
-    longitude = shape.longitude,
-    radius = shape.radius;
-  if (isPositionCorrect(latitude, longitude) && (0, _lodash["default"])(radius)) {
-    var circle = new window.google.maps.Circle(_objectSpread(_objectSpread({}, setStyleOptions(shape)), {}, {
-      map: map,
+const setCircle = (map, router, shape, imageData) => {
+  const {
+    latitude,
+    longitude,
+    radius
+  } = shape;
+  if (isPositionCorrect(latitude, longitude) && (0, _lodash.default)(radius)) {
+    const circle = new window.google.maps.Circle(_objectSpread(_objectSpread({}, setStyleOptions(shape)), {}, {
+      map,
       center: {
         lat: latitude,
         lng: longitude
       },
-      radius: radius
+      radius
     }));
     addShapeListeners(map, router, shape, imageData, circle);
     shapesArray.push(circle);
     circle.setMap(map);
   }
 };
-var setShapes = function setShapes(map, router, shapes, imageData, client) {
-  var mapZoom = map.getZoom();
+const setShapes = (map, router, shapes, imageData, client) => {
+  const mapZoom = map.getZoom();
   clearShapes();
-  shapes.forEach(function (shape) {
-    var type = shape.type,
-      minZoom = shape.minZoom,
-      maxZoom = shape.maxZoom;
+  shapes.forEach(shape => {
+    const {
+      type,
+      minZoom,
+      maxZoom
+    } = shape;
     if (mapZoom >= minZoom && mapZoom <= maxZoom) {
       switch (type) {
         case _constants.MARKER:
@@ -380,5 +313,5 @@ var setShapes = function setShapes(map, router, shapes, imageData, client) {
     }
   });
 };
-var _default = exports["default"] = setShapes;
+var _default = exports.default = setShapes;
 //# sourceMappingURL=set-shapes.js.map