@janiscommerce/ui-web 0.37.0 → 0.39.0

package/CHANGELOG.md

@@ -7,6 +7,22 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 
 ## [Unreleased]
 
+## [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
+
+### ADDED
+
+- forwardRef, useImperativeHandle and useEffect for set bounds and zoom in Map component
+
+### REMOVED
+
+- getCenterByGeolocationOrCenter, getGeolocationCoordinates map utils
+
 ## [0.37.0] - 2025-05-02
 
 ### Removed

package/dist/index.esm.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import React__default, { useState, useEffect, useRef, PureComponent, useMemo, useCallback, useLayoutEffect, createContext } from 'react';
+import React__default, { useState, useEffect, useRef, PureComponent, useMemo, useCallback, useLayoutEffect, createContext, forwardRef, useImperativeHandle } from 'react';
 import styled$g, { css, keyframes } from 'styled-components';
 import * as ReactDOM from 'react-dom';
 import ReactDOM__default from 'react-dom';
@@ -4717,6 +4717,166 @@ fixRegExpWellKnownSymbolLogic('split', function (SPLIT, nativeSplit, maybeCallNa
   ];
 }, !SPLIT_WORKS_WITH_OVERWRITTEN_EXEC, UNSUPPORTED_Y);
 
+var $$d = _export;
+
+// `Number.isNaN` method
+// https://tc39.es/ecma262/#sec-number.isnan
+$$d({ target: 'Number', stat: true }, {
+  isNaN: function isNaN(number) {
+    // eslint-disable-next-line no-self-compare -- NaN check
+    return number != number;
+  }
+});
+
+var isCallable$2 = isCallable$k;
+var isObject$3 = isObject$d;
+var setPrototypeOf$1 = objectSetPrototypeOf;
+
+// makes subclassing work correct for wrapped built-ins
+var inheritIfRequired$1 = function ($this, dummy, Wrapper) {
+  var NewTarget, NewTargetPrototype;
+  if (
+    // it can work only with native `setPrototypeOf`
+    setPrototypeOf$1 &&
+    // we haven't completely correct pre-ES6 way for getting `new.target`, so use this
+    isCallable$2(NewTarget = dummy.constructor) &&
+    NewTarget !== Wrapper &&
+    isObject$3(NewTargetPrototype = NewTarget.prototype) &&
+    NewTargetPrototype !== Wrapper.prototype
+  ) setPrototypeOf$1($this, NewTargetPrototype);
+  return $this;
+};
+
+var uncurryThis$a = functionUncurryThis;
+
+// `thisNumberValue` abstract operation
+// https://tc39.es/ecma262/#sec-thisnumbervalue
+var thisNumberValue$1 = uncurryThis$a(1.0.valueOf);
+
+// a string of all valid unicode whitespaces
+var whitespaces$2 = '\u0009\u000A\u000B\u000C\u000D\u0020\u00A0\u1680\u2000\u2001\u2002' +
+  '\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200A\u202F\u205F\u3000\u2028\u2029\uFEFF';
+
+var uncurryThis$9 = functionUncurryThis;
+var requireObjectCoercible$2 = requireObjectCoercible$8;
+var toString$3 = toString$9;
+var whitespaces$1 = whitespaces$2;
+
+var replace$1 = uncurryThis$9(''.replace);
+var whitespace = '[' + whitespaces$1 + ']';
+var ltrim = RegExp('^' + whitespace + whitespace + '*');
+var rtrim = RegExp(whitespace + whitespace + '*$');
+
+// `String.prototype.{ trim, trimStart, trimEnd, trimLeft, trimRight }` methods implementation
+var createMethod$2 = function (TYPE) {
+  return function ($this) {
+    var string = toString$3(requireObjectCoercible$2($this));
+    if (TYPE & 1) string = replace$1(string, ltrim, '');
+    if (TYPE & 2) string = replace$1(string, rtrim, '');
+    return string;
+  };
+};
+
+var stringTrim = {
+  // `String.prototype.{ trimLeft, trimStart }` methods
+  // https://tc39.es/ecma262/#sec-string.prototype.trimstart
+  start: createMethod$2(1),
+  // `String.prototype.{ trimRight, trimEnd }` methods
+  // https://tc39.es/ecma262/#sec-string.prototype.trimend
+  end: createMethod$2(2),
+  // `String.prototype.trim` method
+  // https://tc39.es/ecma262/#sec-string.prototype.trim
+  trim: createMethod$2(3)
+};
+
+var DESCRIPTORS$2 = descriptors;
+var global$e = global$T;
+var uncurryThis$8 = functionUncurryThis;
+var isForced$1 = isForced_1;
+var redefine$2 = redefine$b.exports;
+var hasOwn$1 = hasOwnProperty_1;
+var inheritIfRequired = inheritIfRequired$1;
+var isPrototypeOf$2 = objectIsPrototypeOf;
+var isSymbol = isSymbol$3;
+var toPrimitive = toPrimitive$2;
+var fails$6 = fails$q;
+var getOwnPropertyNames = objectGetOwnPropertyNames.f;
+var getOwnPropertyDescriptor$1 = objectGetOwnPropertyDescriptor.f;
+var defineProperty$1 = objectDefineProperty.f;
+var thisNumberValue = thisNumberValue$1;
+var trim$1 = stringTrim.trim;
+
+var NUMBER = 'Number';
+var NativeNumber = global$e[NUMBER];
+var NumberPrototype = NativeNumber.prototype;
+var TypeError$6 = global$e.TypeError;
+var arraySlice$2 = uncurryThis$8(''.slice);
+var charCodeAt = uncurryThis$8(''.charCodeAt);
+
+// `ToNumeric` abstract operation
+// https://tc39.es/ecma262/#sec-tonumeric
+var toNumeric = function (value) {
+  var primValue = toPrimitive(value, 'number');
+  return typeof primValue == 'bigint' ? primValue : toNumber(primValue);
+};
+
+// `ToNumber` abstract operation
+// https://tc39.es/ecma262/#sec-tonumber
+var toNumber = function (argument) {
+  var it = toPrimitive(argument, 'number');
+  var first, third, radix, maxCode, digits, length, index, code;
+  if (isSymbol(it)) throw TypeError$6('Cannot convert a Symbol value to a number');
+  if (typeof it == 'string' && it.length > 2) {
+    it = trim$1(it);
+    first = charCodeAt(it, 0);
+    if (first === 43 || first === 45) {
+      third = charCodeAt(it, 2);
+      if (third === 88 || third === 120) return NaN; // Number('+0x1') should be NaN, old V8 fix
+    } else if (first === 48) {
+      switch (charCodeAt(it, 1)) {
+        case 66: case 98: radix = 2; maxCode = 49; break; // fast equal of /^0b[01]+$/i
+        case 79: case 111: radix = 8; maxCode = 55; break; // fast equal of /^0o[0-7]+$/i
+        default: return +it;
+      }
+      digits = arraySlice$2(it, 2);
+      length = digits.length;
+      for (index = 0; index < length; index++) {
+        code = charCodeAt(digits, index);
+        // parseInt parses a string to a first unavailable symbol
+        // but ToNumber should return NaN if a string contains unavailable symbols
+        if (code < 48 || code > maxCode) return NaN;
+      } return parseInt(digits, radix);
+    }
+  } return +it;
+};
+
+// `Number` constructor
+// https://tc39.es/ecma262/#sec-number-constructor
+if (isForced$1(NUMBER, !NativeNumber(' 0o1') || !NativeNumber('0b1') || NativeNumber('+0x1'))) {
+  var NumberWrapper = function Number(value) {
+    var n = arguments.length < 1 ? 0 : NativeNumber(toNumeric(value));
+    var dummy = this;
+    // check on 1..constructor(foo) case
+    return isPrototypeOf$2(NumberPrototype, dummy) && fails$6(function () { thisNumberValue(dummy); })
+      ? inheritIfRequired(Object(n), dummy, NumberWrapper) : n;
+  };
+  for (var keys = DESCRIPTORS$2 ? getOwnPropertyNames(NativeNumber) : (
+    // ES3:
+    'MAX_VALUE,MIN_VALUE,NaN,NEGATIVE_INFINITY,POSITIVE_INFINITY,' +
+    // ES2015 (in case, if modules with ES2015 Number statics required before):
+    'EPSILON,MAX_SAFE_INTEGER,MIN_SAFE_INTEGER,isFinite,isInteger,isNaN,isSafeInteger,parseFloat,parseInt,' +
+    // ESNext
+    'fromString,range'
+  ).split(','), j = 0, key$1; keys.length > j; j++) {
+    if (hasOwn$1(NativeNumber, key$1 = keys[j]) && !hasOwn$1(NumberWrapper, key$1)) {
+      defineProperty$1(NumberWrapper, key$1, getOwnPropertyDescriptor$1(NativeNumber, key$1));
+    }
+  }
+  NumberWrapper.prototype = NumberPrototype;
+  NumberPrototype.constructor = NumberWrapper;
+  redefine$2(global$e, NUMBER, NumberWrapper);
+}
+
 /**
  * Creates a debounced function that delays invoking func until after wait milliseconds have
  * elapsed since the last time the debounced function was invoked.
@@ -4745,6 +4905,12 @@ function debounce(fn, wait) {
 
   return debounced;
 }
+var isObject$2 = function isObject(value) {
+  return _typeof(value) === 'object' && !Array.isArray(value) && value instanceof Object;
+};
+var isNumber = function isNumber(num) {
+  return typeof num === 'number' && !Number.isNaN(Number(num));
+};
 
 var breakpoints = {
   values: {
@@ -4945,166 +5111,6 @@ var palette = {
   yellowPressed: '#FFBA0C'
 };
 
-var $$d = _export;
-
-// `Number.isNaN` method
-// https://tc39.es/ecma262/#sec-number.isnan
-$$d({ target: 'Number', stat: true }, {
-  isNaN: function isNaN(number) {
-    // eslint-disable-next-line no-self-compare -- NaN check
-    return number != number;
-  }
-});
-
-var isCallable$2 = isCallable$k;
-var isObject$3 = isObject$d;
-var setPrototypeOf$1 = objectSetPrototypeOf;
-
-// makes subclassing work correct for wrapped built-ins
-var inheritIfRequired$1 = function ($this, dummy, Wrapper) {
-  var NewTarget, NewTargetPrototype;
-  if (
-    // it can work only with native `setPrototypeOf`
-    setPrototypeOf$1 &&
-    // we haven't completely correct pre-ES6 way for getting `new.target`, so use this
-    isCallable$2(NewTarget = dummy.constructor) &&
-    NewTarget !== Wrapper &&
-    isObject$3(NewTargetPrototype = NewTarget.prototype) &&
-    NewTargetPrototype !== Wrapper.prototype
-  ) setPrototypeOf$1($this, NewTargetPrototype);
-  return $this;
-};
-
-var uncurryThis$a = functionUncurryThis;
-
-// `thisNumberValue` abstract operation
-// https://tc39.es/ecma262/#sec-thisnumbervalue
-var thisNumberValue$1 = uncurryThis$a(1.0.valueOf);
-
-// a string of all valid unicode whitespaces
-var whitespaces$2 = '\u0009\u000A\u000B\u000C\u000D\u0020\u00A0\u1680\u2000\u2001\u2002' +
-  '\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200A\u202F\u205F\u3000\u2028\u2029\uFEFF';
-
-var uncurryThis$9 = functionUncurryThis;
-var requireObjectCoercible$2 = requireObjectCoercible$8;
-var toString$3 = toString$9;
-var whitespaces$1 = whitespaces$2;
-
-var replace$1 = uncurryThis$9(''.replace);
-var whitespace = '[' + whitespaces$1 + ']';
-var ltrim = RegExp('^' + whitespace + whitespace + '*');
-var rtrim = RegExp(whitespace + whitespace + '*$');
-
-// `String.prototype.{ trim, trimStart, trimEnd, trimLeft, trimRight }` methods implementation
-var createMethod$2 = function (TYPE) {
-  return function ($this) {
-    var string = toString$3(requireObjectCoercible$2($this));
-    if (TYPE & 1) string = replace$1(string, ltrim, '');
-    if (TYPE & 2) string = replace$1(string, rtrim, '');
-    return string;
-  };
-};
-
-var stringTrim = {
-  // `String.prototype.{ trimLeft, trimStart }` methods
-  // https://tc39.es/ecma262/#sec-string.prototype.trimstart
-  start: createMethod$2(1),
-  // `String.prototype.{ trimRight, trimEnd }` methods
-  // https://tc39.es/ecma262/#sec-string.prototype.trimend
-  end: createMethod$2(2),
-  // `String.prototype.trim` method
-  // https://tc39.es/ecma262/#sec-string.prototype.trim
-  trim: createMethod$2(3)
-};
-
-var DESCRIPTORS$2 = descriptors;
-var global$e = global$T;
-var uncurryThis$8 = functionUncurryThis;
-var isForced$1 = isForced_1;
-var redefine$2 = redefine$b.exports;
-var hasOwn$1 = hasOwnProperty_1;
-var inheritIfRequired = inheritIfRequired$1;
-var isPrototypeOf$2 = objectIsPrototypeOf;
-var isSymbol = isSymbol$3;
-var toPrimitive = toPrimitive$2;
-var fails$6 = fails$q;
-var getOwnPropertyNames = objectGetOwnPropertyNames.f;
-var getOwnPropertyDescriptor$1 = objectGetOwnPropertyDescriptor.f;
-var defineProperty$1 = objectDefineProperty.f;
-var thisNumberValue = thisNumberValue$1;
-var trim$1 = stringTrim.trim;
-
-var NUMBER = 'Number';
-var NativeNumber = global$e[NUMBER];
-var NumberPrototype = NativeNumber.prototype;
-var TypeError$6 = global$e.TypeError;
-var arraySlice$2 = uncurryThis$8(''.slice);
-var charCodeAt = uncurryThis$8(''.charCodeAt);
-
-// `ToNumeric` abstract operation
-// https://tc39.es/ecma262/#sec-tonumeric
-var toNumeric = function (value) {
-  var primValue = toPrimitive(value, 'number');
-  return typeof primValue == 'bigint' ? primValue : toNumber(primValue);
-};
-
-// `ToNumber` abstract operation
-// https://tc39.es/ecma262/#sec-tonumber
-var toNumber = function (argument) {
-  var it = toPrimitive(argument, 'number');
-  var first, third, radix, maxCode, digits, length, index, code;
-  if (isSymbol(it)) throw TypeError$6('Cannot convert a Symbol value to a number');
-  if (typeof it == 'string' && it.length > 2) {
-    it = trim$1(it);
-    first = charCodeAt(it, 0);
-    if (first === 43 || first === 45) {
-      third = charCodeAt(it, 2);
-      if (third === 88 || third === 120) return NaN; // Number('+0x1') should be NaN, old V8 fix
-    } else if (first === 48) {
-      switch (charCodeAt(it, 1)) {
-        case 66: case 98: radix = 2; maxCode = 49; break; // fast equal of /^0b[01]+$/i
-        case 79: case 111: radix = 8; maxCode = 55; break; // fast equal of /^0o[0-7]+$/i
-        default: return +it;
-      }
-      digits = arraySlice$2(it, 2);
-      length = digits.length;
-      for (index = 0; index < length; index++) {
-        code = charCodeAt(digits, index);
-        // parseInt parses a string to a first unavailable symbol
-        // but ToNumber should return NaN if a string contains unavailable symbols
-        if (code < 48 || code > maxCode) return NaN;
-      } return parseInt(digits, radix);
-    }
-  } return +it;
-};
-
-// `Number` constructor
-// https://tc39.es/ecma262/#sec-number-constructor
-if (isForced$1(NUMBER, !NativeNumber(' 0o1') || !NativeNumber('0b1') || NativeNumber('+0x1'))) {
-  var NumberWrapper = function Number(value) {
-    var n = arguments.length < 1 ? 0 : NativeNumber(toNumeric(value));
-    var dummy = this;
-    // check on 1..constructor(foo) case
-    return isPrototypeOf$2(NumberPrototype, dummy) && fails$6(function () { thisNumberValue(dummy); })
-      ? inheritIfRequired(Object(n), dummy, NumberWrapper) : n;
-  };
-  for (var keys = DESCRIPTORS$2 ? getOwnPropertyNames(NativeNumber) : (
-    // ES3:
-    'MAX_VALUE,MIN_VALUE,NaN,NEGATIVE_INFINITY,POSITIVE_INFINITY,' +
-    // ES2015 (in case, if modules with ES2015 Number statics required before):
-    'EPSILON,MAX_SAFE_INTEGER,MIN_SAFE_INTEGER,isFinite,isInteger,isNaN,isSafeInteger,parseFloat,parseInt,' +
-    // ESNext
-    'fromString,range'
-  ).split(','), j = 0, key$1; keys.length > j; j++) {
-    if (hasOwn$1(NativeNumber, key$1 = keys[j]) && !hasOwn$1(NumberWrapper, key$1)) {
-      defineProperty$1(NumberWrapper, key$1, getOwnPropertyDescriptor$1(NativeNumber, key$1));
-    }
-  }
-  NumberWrapper.prototype = NumberPrototype;
-  NumberPrototype.constructor = NumberWrapper;
-  redefine$2(global$e, NUMBER, NumberWrapper);
-}
-
 var uncurryThis$7 = functionUncurryThis;
 var requireObjectCoercible$1 = requireObjectCoercible$8;
 var toString$2 = toString$9;
@@ -15955,6 +15961,13 @@ var markerHasEqualPosition = function markerHasEqualPosition() {
   var hasEqualLng = (prevPosition === null || prevPosition === void 0 ? void 0 : prevPosition.lng) === (newPosition === null || newPosition === void 0 ? void 0 : newPosition.lng);
   return hasEqualLat && hasEqualLng;
 };
+var isValidAnimation = function isValidAnimation() {
+  var _window$google, _window$google$maps;
+
+  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;
+  return (animation === null || animation === void 0 ? void 0 : animation.name) && validAnimations && validAnimations[animation === null || animation === void 0 ? void 0 : animation.name] !== undefined;
+};
 
 var Marker = function Marker(_ref) {
   var _ref$markerData = _ref.markerData,
@@ -15972,6 +15985,7 @@ var Marker = function Marker(_ref) {
   var _ref2 = marker || {},
       icon = _ref2.icon,
       position = _ref2.position,
+      animation = _ref2.animation,
       overlay = _ref2.overlay,
       infoWindowChildren = _ref2.infoWindowChildren,
       isDraggable = _ref2.isDraggable;
@@ -15988,6 +16002,7 @@ var Marker = function Marker(_ref) {
       _onDragEnd = _markerOptions$onDrag3 === void 0 ? function () {} : _markerOptions$onDrag3;
 
   var markerRef = useRef(null);
+  var timeoutRef = useRef(null);
 
   var _useState3 = useState(false),
       _useState4 = _slicedToArray(_useState3, 2),
@@ -16036,6 +16051,29 @@ var Marker = function Marker(_ref) {
     };
   };
 
+  var animate = function animate() {
+    var _markerRef$current2, _markerRef$current2$m;
+
+    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 (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);
+    }
+  };
+
+  useEffect(function () {
+    if (animation && isObject$2(animation)) animate();
+    return function () {
+      if (timeoutRef.current) clearTimeout(timeoutRef.current);
+    };
+  }, [animation]);
   var markerProps = {
     ref: markerRef,
     position: position,
@@ -17057,40 +17095,6 @@ var getBoundsFromMarkers = (function () {
   return getBounds(markersFlatted);
 });
 
-/**
- * Sets the map center based on the provided markers or a default center value.
- * @param {Object} center A default center object with latitude and longitude values.
- * @param {number} center.lat The latitude value of the default center.
- * @param {number} center.lng The longitude value of the default center.
- */
-
-var getCenterByGeolocationOrCenter = (function () {
-  var center = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  if (validateCoordinates(center)) return center;
-  return getGeolocationCoordinates();
-});
-
-/**
- * Retrieves the current geolocation of the user and updates the map's center coordinates.
- */
-var getGeolocationCoordinates = (function () {
-  try {
-    navigator.geolocation.getCurrentPosition(function () {
-      var pos = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-      var _pos$coords = pos.coords,
-          lat = _pos$coords.latitude,
-          lng = _pos$coords.longitude;
-      return {
-        lat: lat,
-        lng: lng
-      };
-    });
-  } catch (error) {
-    console.log(error);
-    return {};
-  }
-});
-
 var LIBRARIES = ['geometry', 'drawing', 'places'];
 var DEFAULT_CENTER = {
   lat: 0,
@@ -17269,15 +17273,6 @@ var getParsedComponents = (function () {
   });
 });
 
-/**
- * Function to check if a value is an object
- * @param {*} value Value to check if it is an object
- * @returns Returns true if the value is an object
- */
-var isObject$2 = function isObject(value) {
-  return _typeof(value) === 'object' && !Array.isArray(value) && value instanceof Object;
-};
-
 var global$7 = global$T;
 
 var nativePromiseConstructor = global$7.Promise;
@@ -35397,28 +35392,6 @@ var parsePlaces = (function (places, parsedData) {
   }, _objectSpread2({}, parsedData));
 });
 
-/**
- * @function validateCoordinates
- * @description return true or false is region has latitude and longitude keys and type number
- * @param {object} coordinates - object with latitude and longitude
- * @param {number} coordinates.lng - longitude
- * @param {number} coordinates.lat - latitude
- * @returns {boolean}
- * @example isValidRegionData({latitude: -345345, longitude: -345435345}) => true
- * @example isValidRegionData({latitude: -345345, longitude: '3453453453'}) => false
- * @example isValidRegionData({latitude: -345345}) => false
- */
-
-var validateCoordinates = (function () {
-  var coordinates = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  if (!isObject$2(coordinates) || !Object.keys(coordinates).length) return false;
-  var lng = coordinates.lng,
-      lat = coordinates.lat;
-  if (!lng || !lat) return false;
-  if (!lodash.exports.isNumber(lng) || !lodash.exports.isNumber(lat)) return false;
-  return true;
-});
-
 var styled = {
   LoadingElement: styled$g.div.withConfig({
     displayName: "styles__LoadingElement",
@@ -35486,8 +35459,7 @@ var SearchBox = function SearchBox(_ref) {
 };
 
 var _excluded = ["googleMapsApiKey", "width", "height", "center", "zoom", "markers", "markerOptions", "options", "callbackOnSuccessDirections", "callbackOnErrorDirections"];
-
-var Map$1 = function Map(_ref) {
+var Map$1 = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var _mapRef$current;
 
   var _ref$googleMapsApiKey = _ref.googleMapsApiKey,
@@ -35496,8 +35468,7 @@ var Map$1 = function Map(_ref) {
       width = _ref$width === void 0 ? '800px' : _ref$width,
       _ref$height = _ref.height,
       height = _ref$height === void 0 ? '400px' : _ref$height,
-      _ref$center = _ref.center,
-      center = _ref$center === void 0 ? DEFAULT_CENTER : _ref$center,
+      center = _ref.center,
       _ref$zoom = _ref.zoom,
       zoom = _ref$zoom === void 0 ? 13 : _ref$zoom,
       _ref$markers = _ref.markers,
@@ -35540,7 +35511,7 @@ var Map$1 = function Map(_ref) {
     mapRef.current.panTo(newCenter);
   };
 
-  var onLoad = useCallback(function (map) {
+  var onLoad = function onLoad(map) {
     if (!map) return;
     mapRef.current = map;
     mapRef.current.setOptions({
@@ -35549,10 +35520,22 @@ var Map$1 = function Map(_ref) {
     var fullScreenPos = mapOptions.showSearchBar ? 'RIGHT_BOTTOM' : 'RIGHT_TOP';
     handlePositions('fullScreen', window.google.maps.ControlPosition[fullScreenPos]);
     handlePositions('zoom', window.google.maps.ControlPosition.RIGHT_BOTTOM);
-    if (!(markers !== null && markers !== void 0 && markers.length)) mapRef.current.setCenter(getCenterByGeolocationOrCenter(center || DEFAULT_CENTER));
-    if (markers !== null && markers !== void 0 && markers.length) mapRef.current.fitBounds(getBoundsFromMarkers(markers));
-    mapRef.current.setZoom(zoom);
-  }, [center, markers, options, zoom]);
+    if (!(markers !== null && markers !== void 0 && markers.length)) mapRef.current.setCenter(center || DEFAULT_CENTER);
+    mapRef.current.setZoom(!center ? 2 : zoom);
+  };
+
+  useImperativeHandle(ref, function () {
+    return {
+      setZoom: function setZoom(zoom) {
+        return mapRef.current.setZoom(zoom);
+      }
+    };
+  });
+  useEffect(function () {
+    if (mapRef.current && markers !== null && markers !== void 0 && markers.length) {
+      mapRef.current.fitBounds(getBoundsFromMarkers(markers));
+    }
+  }, [mapRef.current, markers]);
   if (!isLoaded) return null;
   return /*#__PURE__*/React__default.createElement(GoogleMap, _extends$1({
     className: "google-map-component",
@@ -35562,7 +35545,7 @@ var Map$1 = function Map(_ref) {
       width: width
     },
     options: mapOptions,
-    center: (_mapRef$current = mapRef.current) === null || _mapRef$current === void 0 ? void 0 : _mapRef$current.center
+    center: (_mapRef$current = mapRef.current) === null || _mapRef$current === void 0 ? void 0 : _mapRef$current.getCenter()
   }, props), mapOptions.showSearchBar && /*#__PURE__*/React__default.createElement(SearchBox, {
     updateMarker: updateMarker,
     className: "google-map-component__search-box"
@@ -35574,7 +35557,8 @@ var Map$1 = function Map(_ref) {
     callbackOnErrorDirections: callbackOnErrorDirections,
     googleMapsApiKey: googleMapsApiKey
   }));
-};
+});
+Map$1.displayName = 'Map';
 
 var rotate = keyframes(["to{transform:rotate(360deg);}"]);
 var Spinner$1 = styled$g.div.withConfig({