@janiscommerce/ui-web 0.39.0 → 0.40.0

package/CHANGELOG.md

@@ -11,6 +11,17 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 
 ### Added
 
+- startAnimation and stopAnimation functions
+- zIndex prop
+
+### CHANGED
+
+- onDragEnd, onMouseOver and onMouseOut event functions
+
+## [0.39.0] - 2025-05-13
+
+### Added
+
 - Enhanced map markers with animation support, including the ability to specify animation duration for each marker. Markers now animate automatically when added to the map.
 
 ## [0.38.0] - 2025-05-08

package/dist/index.esm.js

@@ -15966,6 +15966,7 @@ var isValidAnimation = function isValidAnimation() {
 
   var animation = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   var validAnimations = (_window$google = window.google) === null || _window$google === void 0 ? void 0 : (_window$google$maps = _window$google.maps) === null || _window$google$maps === void 0 ? void 0 : _window$google$maps.Animation;
+  if (!animation || !isObject$2(animation)) return false;
   return (animation === null || animation === void 0 ? void 0 : animation.name) && validAnimations && validAnimations[animation === null || animation === void 0 ? void 0 : animation.name] !== undefined;
 };
 
@@ -15988,7 +15989,8 @@ var Marker = function Marker(_ref) {
       animation = _ref2.animation,
       overlay = _ref2.overlay,
       infoWindowChildren = _ref2.infoWindowChildren,
-      isDraggable = _ref2.isDraggable;
+      isDraggable = _ref2.isDraggable,
+      zIndex = _ref2.zIndex;
 
   var _markerOptions$onLoad = markerOptions.onLoad,
       _onLoad = _markerOptions$onLoad === void 0 ? function () {} : _markerOptions$onLoad,
@@ -16051,27 +16053,26 @@ var Marker = function Marker(_ref) {
     };
   };
 
-  var animate = function animate() {
-    var _markerRef$current2, _markerRef$current2$m;
+  var stopAnimation = function stopAnimation() {
+    var _markerRef$current2;
 
-    if (!markerRef.current) return;
-    if (!isValidAnimation(animation)) return;
-    (_markerRef$current2 = markerRef.current) === null || _markerRef$current2 === void 0 ? void 0 : (_markerRef$current2$m = _markerRef$current2.marker) === null || _markerRef$current2$m === void 0 ? void 0 : _markerRef$current2$m.setAnimation(window.google.maps.Animation[animation === null || animation === void 0 ? void 0 : animation.name]);
     if (timeoutRef.current) clearTimeout(timeoutRef.current);
+    if ((_markerRef$current2 = markerRef.current) !== null && _markerRef$current2 !== void 0 && _markerRef$current2.marker) markerRef.current.marker.setAnimation(null);
+  };
 
-    if (animation !== null && animation !== void 0 && animation.duration && isNumber(animation === null || animation === void 0 ? void 0 : animation.duration)) {
-      timeoutRef.current = setTimeout(function () {
-        var _markerRef$current3, _markerRef$current3$m;
-
-        (_markerRef$current3 = markerRef.current) === null || _markerRef$current3 === void 0 ? void 0 : (_markerRef$current3$m = _markerRef$current3.marker) === null || _markerRef$current3$m === void 0 ? void 0 : _markerRef$current3$m.setAnimation(null);
-      }, animation === null || animation === void 0 ? void 0 : animation.duration);
-    }
+  var startAnimation = function startAnimation() {
+    if (!markerRef.current) return;
+    stopAnimation();
+    markerRef.current.marker.setAnimation(window.google.maps.Animation[animation === null || animation === void 0 ? void 0 : animation.name]);
+    if (animation !== null && animation !== void 0 && animation.duration && isNumber(animation === null || animation === void 0 ? void 0 : animation.duration)) timeoutRef.current = setTimeout(function () {
+      return stopAnimation();
+    }, animation.duration);
   };
 
   useEffect(function () {
-    if (animation && isObject$2(animation)) animate();
+    if (isValidAnimation(animation)) startAnimation();
     return function () {
-      if (timeoutRef.current) clearTimeout(timeoutRef.current);
+      stopAnimation();
     };
   }, [animation]);
   var markerProps = {
@@ -16079,6 +16080,7 @@ var Marker = function Marker(_ref) {
     position: position,
     draggable: isDraggable || !readOnly,
     icon: icon,
+    zIndex: zIndex,
     onLoad: function onLoad(instance) {
       return _onLoad({
         prevMarker: marker,
@@ -16092,16 +16094,20 @@ var Marker = function Marker(_ref) {
       return _onDrag(event);
     },
     onDragEnd: function onDragEnd(event) {
-      return _onDragEnd(getEventHandlerData(event));
+      if (isValidAnimation(animation)) startAnimation();
+
+      _onDragEnd(getEventHandlerData(event));
     },
     onDragStart: function onDragStart(event) {
       return _onDragStart(getEventHandlerData(event));
     },
     onMouseOver: function onMouseOver() {
-      return openInfoWindow();
+      if (isValidAnimation(animation)) stopAnimation();
+      openInfoWindow();
     },
     onMouseOut: function onMouseOut() {
-      return delayedInfoWindowHover();
+      if (isValidAnimation(animation)) startAnimation();
+      delayedInfoWindowHover();
     }
   };
   var infoWindowHandles = {