@janiscommerce/ui-web 0.33.0 → 0.34.0

package/dist/index.umd.js

@@ -15963,6 +15963,28 @@
     }, children));
   };
 
+  var getCoordsFromEvent = function getCoordsFromEvent() {
+    var event = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    if (_typeof(event) !== 'object') return;
+    var _event$latLng = event.latLng;
+    _event$latLng = _event$latLng === void 0 ? {} : _event$latLng;
+    var _event$latLng$lat = _event$latLng.lat,
+        lat = _event$latLng$lat === void 0 ? function () {} : _event$latLng$lat,
+        _event$latLng$lng = _event$latLng.lng,
+        lng = _event$latLng$lng === void 0 ? function () {} : _event$latLng$lng;
+    return {
+      lat: lat(),
+      lng: lng()
+    };
+  };
+  var markerHasEqualPosition = function markerHasEqualPosition() {
+    var prevPosition = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    var newPosition = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    var hasEqualLat = (prevPosition === null || prevPosition === void 0 ? void 0 : prevPosition.lat) === (newPosition === null || newPosition === void 0 ? void 0 : newPosition.lat);
+    var hasEqualLng = (prevPosition === null || prevPosition === void 0 ? void 0 : prevPosition.lng) === (newPosition === null || newPosition === void 0 ? void 0 : newPosition.lng);
+    return hasEqualLat && hasEqualLng;
+  };
+
   var Marker = function Marker(_ref) {
     var _ref$markerData = _ref.markerData,
         markerData = _ref$markerData === void 0 ? {} : _ref$markerData,
@@ -15971,7 +15993,12 @@
         _ref$readOnly = _ref.readOnly,
         readOnly = _ref$readOnly === void 0 ? true : _ref$readOnly;
 
-    var _ref2 = markerData || {},
+    var _useState = React.useState(markerData),
+        _useState2 = _slicedToArray(_useState, 2),
+        marker = _useState2[0],
+        setMarker = _useState2[1];
+
+    var _ref2 = marker || {},
         icon = _ref2.icon,
         position = _ref2.position,
         overlay = _ref2.overlay,
@@ -15982,20 +16009,24 @@
         _onLoad = _markerOptions$onLoad === void 0 ? function () {} : _markerOptions$onLoad,
         _markerOptions$onClic = markerOptions.onClick,
         _onClick = _markerOptions$onClic === void 0 ? function () {} : _markerOptions$onClic,
-        _markerOptions$onDrag = markerOptions.onDragStart,
-        _onDragStart = _markerOptions$onDrag === void 0 ? function () {} : _markerOptions$onDrag,
-        _markerOptions$onDrag2 = markerOptions.onDragEnd,
-        _onDragEnd = _markerOptions$onDrag2 === void 0 ? function () {} : _markerOptions$onDrag2;
+        _markerOptions$onDrag = markerOptions.onDrag,
+        _onDrag = _markerOptions$onDrag === void 0 ? function () {} : _markerOptions$onDrag,
+        _markerOptions$onDrag2 = markerOptions.onDragStart,
+        _onDragStart = _markerOptions$onDrag2 === void 0 ? function () {} : _markerOptions$onDrag2,
+        _markerOptions$onDrag3 = markerOptions.onDragEnd,
+        _onDragEnd = _markerOptions$onDrag3 === void 0 ? function () {} : _markerOptions$onDrag3;
 
-    var _useState = React.useState(false),
-        _useState2 = _slicedToArray(_useState, 2),
-        infoWindowOpen = _useState2[0],
-        setInfoWindowOpen = _useState2[1];
+    var markerRef = React.useRef(null);
 
     var _useState3 = React.useState(false),
         _useState4 = _slicedToArray(_useState3, 2),
-        mouseOverInfoWindow = _useState4[0],
-        setMouseOverInfoWindow = _useState4[1];
+        infoWindowOpen = _useState4[0],
+        setInfoWindowOpen = _useState4[1];
+
+    var _useState5 = React.useState(false),
+        _useState6 = _slicedToArray(_useState5, 2),
+        mouseOverInfoWindow = _useState6[0],
+        setMouseOverInfoWindow = _useState6[1];
 
     var openInfoWindow = function openInfoWindow() {
       return setInfoWindowOpen(true);
@@ -16008,21 +16039,51 @@
     var delayedInfoWindowHover = debounce(function () {
       if (!mouseOverInfoWindow) closeInfoWindow();
     }, 100);
+
+    var updateMarker = function updateMarker() {
+      var newData = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+      var updatedMarker = _objectSpread2(_objectSpread2({}, marker), newData);
+
+      setMarker(updatedMarker);
+      return updatedMarker;
+    };
+
+    var getEventHandlerData = function getEventHandlerData(event) {
+      var _markerRef$current;
+
+      var newPosition = getCoordsFromEvent(event);
+      return {
+        marker: markerHasEqualPosition(marker === null || marker === void 0 ? void 0 : marker.position, newPosition) ? marker : updateMarker({
+          position: newPosition
+        }),
+        prevMarker: marker,
+        instance: (_markerRef$current = markerRef.current) === null || _markerRef$current === void 0 ? void 0 : _markerRef$current.marker
+      };
+    };
+
     var markerProps = {
+      ref: markerRef,
       position: position,
       draggable: isDraggable || !readOnly,
       icon: icon,
-      onLoad: function onLoad(markerInstance) {
-        return _onLoad(markerData, markerInstance);
+      onLoad: function onLoad(instance) {
+        return _onLoad({
+          prevMarker: marker,
+          instance: instance
+        });
+      },
+      onClick: function onClick(event) {
+        return _onClick(getEventHandlerData(event));
       },
-      onClick: function onClick(eventData) {
-        return _onClick(markerData, eventData);
+      onDrag: function onDrag(event) {
+        return _onDrag(event);
       },
-      onDragEnd: function onDragEnd(eventData) {
-        return _onDragEnd(markerData, eventData);
+      onDragEnd: function onDragEnd(event) {
+        return _onDragEnd(getEventHandlerData(event));
       },
-      onDragStart: function onDragStart(eventData) {
-        return _onDragStart(markerData, eventData);
+      onDragStart: function onDragStart(event) {
+        return _onDragStart(getEventHandlerData(event));
       },
       onMouseOver: function onMouseOver() {
         return openInfoWindow();