@janiscommerce/ui-web 0.36.0 → 0.38.0

package/CHANGELOG.md

@@ -7,6 +7,22 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 
 ## [Unreleased]
 
+## [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
+
+- Prop iconSize to chip and format styles
+
 ## [0.36.0] - 2025-04-30
 
 ### Added

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';
@@ -489,7 +489,7 @@ var isCallable$k = function (argument) {
 
 var isCallable$j = isCallable$k;
 
-var isObject$d = function (it) {
+var isObject$c = function (it) {
   return typeof it == 'object' ? it !== null : isCallable$j(it);
 };
 
@@ -614,7 +614,7 @@ var getMethod$5 = function (V, P) {
 var global$L = global$T;
 var call$f = functionCall;
 var isCallable$f = isCallable$k;
-var isObject$c = isObject$d;
+var isObject$b = isObject$c;
 
 var TypeError$k = global$L.TypeError;
 
@@ -622,9 +622,9 @@ var TypeError$k = global$L.TypeError;
 // https://tc39.es/ecma262/#sec-ordinarytoprimitive
 var ordinaryToPrimitive$1 = function (input, pref) {
   var fn, val;
-  if (pref === 'string' && isCallable$f(fn = input.toString) && !isObject$c(val = call$f(fn, input))) return val;
-  if (isCallable$f(fn = input.valueOf) && !isObject$c(val = call$f(fn, input))) return val;
-  if (pref !== 'string' && isCallable$f(fn = input.toString) && !isObject$c(val = call$f(fn, input))) return val;
+  if (pref === 'string' && isCallable$f(fn = input.toString) && !isObject$b(val = call$f(fn, input))) return val;
+  if (isCallable$f(fn = input.valueOf) && !isObject$b(val = call$f(fn, input))) return val;
+  if (pref !== 'string' && isCallable$f(fn = input.toString) && !isObject$b(val = call$f(fn, input))) return val;
   throw TypeError$k("Can't convert object to primitive value");
 };
 
@@ -724,7 +724,7 @@ var wellKnownSymbol$m = function (name) {
 
 var global$G = global$T;
 var call$e = functionCall;
-var isObject$b = isObject$d;
+var isObject$a = isObject$c;
 var isSymbol$2 = isSymbol$3;
 var getMethod$4 = getMethod$5;
 var ordinaryToPrimitive = ordinaryToPrimitive$1;
@@ -736,13 +736,13 @@ var TO_PRIMITIVE = wellKnownSymbol$l('toPrimitive');
 // `ToPrimitive` abstract operation
 // https://tc39.es/ecma262/#sec-toprimitive
 var toPrimitive$2 = function (input, pref) {
-  if (!isObject$b(input) || isSymbol$2(input)) return input;
+  if (!isObject$a(input) || isSymbol$2(input)) return input;
   var exoticToPrim = getMethod$4(input, TO_PRIMITIVE);
   var result;
   if (exoticToPrim) {
     if (pref === undefined) pref = 'default';
     result = call$e(exoticToPrim, input, pref);
-    if (!isObject$b(result) || isSymbol$2(result)) return result;
+    if (!isObject$a(result) || isSymbol$2(result)) return result;
     throw TypeError$j("Can't convert object to primitive value");
   }
   if (pref === undefined) pref = 'number';
@@ -760,11 +760,11 @@ var toPropertyKey$3 = function (argument) {
 };
 
 var global$F = global$T;
-var isObject$a = isObject$d;
+var isObject$9 = isObject$c;
 
 var document$3 = global$F.document;
 // typeof document.createElement is 'object' in old IE
-var EXISTS$1 = isObject$a(document$3) && isObject$a(document$3.createElement);
+var EXISTS$1 = isObject$9(document$3) && isObject$9(document$3.createElement);
 
 var documentCreateElement$2 = function (it) {
   return EXISTS$1 ? document$3.createElement(it) : {};
@@ -821,14 +821,14 @@ var v8PrototypeDefineBug = DESCRIPTORS$a && fails$k(function () {
 });
 
 var global$E = global$T;
-var isObject$9 = isObject$d;
+var isObject$8 = isObject$c;
 
 var String$4 = global$E.String;
 var TypeError$i = global$E.TypeError;
 
 // `Assert: Type(argument) is Object`
 var anObject$h = function (argument) {
-  if (isObject$9(argument)) return argument;
+  if (isObject$8(argument)) return argument;
   throw TypeError$i(String$4(argument) + ' is not an object');
 };
 
@@ -927,7 +927,7 @@ var hiddenKeys$4 = {};
 var NATIVE_WEAK_MAP = nativeWeakMap;
 var global$B = global$T;
 var uncurryThis$o = functionUncurryThis;
-var isObject$8 = isObject$d;
+var isObject$7 = isObject$c;
 var createNonEnumerableProperty$6 = createNonEnumerableProperty$7;
 var hasOwn$a = hasOwnProperty_1;
 var shared$1 = sharedStore;
@@ -946,7 +946,7 @@ var enforce = function (it) {
 var getterFor = function (TYPE) {
   return function (it) {
     var state;
-    if (!isObject$8(it) || (state = get(it)).type !== TYPE) {
+    if (!isObject$7(it) || (state = get(it)).type !== TYPE) {
       throw TypeError$g('Incompatible receiver, ' + TYPE + ' required');
     } return state;
   };
@@ -1411,7 +1411,7 @@ var isConstructor$3 = !construct || fails$i(function () {
 var global$x = global$T;
 var isArray$2 = isArray$3;
 var isConstructor$2 = isConstructor$3;
-var isObject$7 = isObject$d;
+var isObject$6 = isObject$c;
 var wellKnownSymbol$i = wellKnownSymbol$m;
 
 var SPECIES$5 = wellKnownSymbol$i('species');
@@ -1425,7 +1425,7 @@ var arraySpeciesConstructor$1 = function (originalArray) {
     C = originalArray.constructor;
     // cross-realm fallback
     if (isConstructor$2(C) && (C === Array$3 || isArray$2(C.prototype))) C = undefined;
-    else if (isObject$7(C)) {
+    else if (isObject$6(C)) {
       C = C[SPECIES$5];
       if (C === null) C = undefined;
     }
@@ -1464,7 +1464,7 @@ var $$i = _export;
 var global$w = global$T;
 var fails$g = fails$q;
 var isArray$1 = isArray$3;
-var isObject$6 = isObject$d;
+var isObject$5 = isObject$c;
 var toObject$7 = toObject$9;
 var lengthOfArrayLike$7 = lengthOfArrayLike$9;
 var createProperty$2 = createProperty$3;
@@ -1490,7 +1490,7 @@ var IS_CONCAT_SPREADABLE_SUPPORT = V8_VERSION$1 >= 51 || !fails$g(function () {
 var SPECIES_SUPPORT = arrayMethodHasSpeciesSupport$1('concat');
 
 var isConcatSpreadable = function (O) {
-  if (!isObject$6(O)) return false;
+  if (!isObject$5(O)) return false;
   var spreadable = O[IS_CONCAT_SPREADABLE];
   return spreadable !== undefined ? !!spreadable : isArray$1(O);
 };
@@ -3103,7 +3103,7 @@ var hasOwn$3 = hasOwnProperty_1;
 var bind$7 = functionBindContext;
 var classof$2 = classof$8;
 var anObject$5 = anObject$h;
-var isObject$5 = isObject$d;
+var isObject$4 = isObject$c;
 var $toString$2 = toString$9;
 var create = objectCreate;
 var createPropertyDescriptor = createPropertyDescriptor$5;
@@ -3206,7 +3206,7 @@ var URLSearchParamsState = function (init) {
   this.url = null;
 
   if (init !== undefined) {
-    if (isObject$5(init)) this.parseObject(init);
+    if (isObject$4(init)) this.parseObject(init);
     else this.parseQuery(typeof init == 'string' ? charAt$1(init, 0) === '?' ? stringSlice$2(init, 1) : init : $toString$2(init));
   }
 };
@@ -3423,7 +3423,7 @@ if (!USE_NATIVE_URL$1 && isCallable$3(Headers)) {
   var headersSet = uncurryThis$d(HeadersPrototype.set);
 
   var wrapRequestOptions = function (init) {
-    if (isObject$5(init)) {
+    if (isObject$4(init)) {
       var body = init.body;
       var headers;
       if (classof$2(body) === URL_SEARCH_PARAMS) {
@@ -4522,7 +4522,7 @@ var functionApply = typeof Reflect == 'object' && Reflect.apply || (NATIVE_BIND
   return call$3.apply(apply$2, arguments);
 });
 
-var isObject$4 = isObject$d;
+var isObject$3 = isObject$c;
 var classof$1 = classofRaw$1;
 var wellKnownSymbol$5 = wellKnownSymbol$m;
 
@@ -4532,7 +4532,7 @@ var MATCH$1 = wellKnownSymbol$5('match');
 // https://tc39.es/ecma262/#sec-isregexp
 var isRegexp = function (it) {
   var isRegExp;
-  return isObject$4(it) && ((isRegExp = it[MATCH$1]) !== undefined ? !!isRegExp : classof$1(it) == 'RegExp');
+  return isObject$3(it) && ((isRegExp = it[MATCH$1]) !== undefined ? !!isRegExp : classof$1(it) == 'RegExp');
 };
 
 var global$f = global$T;
@@ -4957,7 +4957,7 @@ $$d({ target: 'Number', stat: true }, {
 });
 
 var isCallable$2 = isCallable$k;
-var isObject$3 = isObject$d;
+var isObject$2 = isObject$c;
 var setPrototypeOf$1 = objectSetPrototypeOf;
 
 // makes subclassing work correct for wrapped built-ins
@@ -4969,7 +4969,7 @@ var inheritIfRequired$1 = function ($this, dummy, Wrapper) {
     // 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) &&
+    isObject$2(NewTargetPrototype = NewTarget.prototype) &&
     NewTargetPrototype !== Wrapper.prototype
   ) setPrototypeOf$1($this, NewTargetPrototype);
   return $this;
@@ -5625,9 +5625,9 @@ var styles$2 = {
   Svg: styled$g.svg.withConfig({
     displayName: "styles__Svg",
     componentId: "sc-jf3e5i-0"
-  })(["fill:", ";", " ", ";"], function (props) {
+  })(["fill:", ";", " ", ";", ";"], function (props) {
     return getColor(props.color);
-  }, mediaBreaks.onlyPrint(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteral(["\n\t\t\tfill: ", ";\n\t\t"])), palette.darkGrey), function (props) {
+  }, mediaBreaks.onlyPrint(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteral(["\n\t\t\tfill: ", ";\n\t\t"])), palette.darkGrey), mixins.transition('fill'), function (props) {
     return props.styles;
   }),
   Path: styled$g.path.withConfig({
@@ -7128,7 +7128,7 @@ var styled$d = {
   Chip: styled$g.button.withConfig({
     displayName: "styles__Chip",
     componentId: "sc-1vnh4co-0"
-  })(["padding:", ";cursor:", ";font-size:13px;color:", ";height:", ";width:", ";min-width:36px;max-width:150px;border-radius:", ";display:inline-flex;justify-content:center;align-items:center;pointer-events:", ";white-space:nowrap;", ";.chip-icon{", ";", ";}", ";", " ", " ", " ", ""], function (props) {
+  })(["padding:", ";cursor:", ";font-size:13px;color:", ";height:", ";width:", ";min-width:36px;max-width:150px;border-radius:", ";display:inline-flex;justify-content:center;align-items:center;pointer-events:", ";white-space:nowrap;.chip-icon{", ";}", ";", ";", " ", " ", " ", ""], function (props) {
     return !props.onlyIcon ? '0 12px' : '0';
   }, function (props) {
     return props.clickable ? 'pointer' : 'default';
@@ -7140,12 +7140,10 @@ var styled$d = {
     return !props.onlyIcon ? '50px' : '50%';
   }, function (props) {
     return props.clickable || props.hasLink ? 'auto' : 'none';
-  }, function (props) {
-    return getChipVariant(props);
   }, function (props) {
     return !props.onlyIcon && 'margin-right: 8px';
   }, function (props) {
-    return props.iconColor && "fill: ".concat(getColor(props.iconColor));
+    return getChipVariant(props);
   }, function (props) {
     return props.styles;
   }, function (props) {
@@ -7155,12 +7153,10 @@ var styled$d = {
   }, function (props) {
     return props.textColor && "color: ".concat(getColor(props.textColor), ";");
   }, mediaBreaks.onlyPrint(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteral(["\n\t\t\tborder: 1px solid ", ";\n\t\t"])), palette.darkGrey)),
-  iconPathStyles: css(["", ";"], mixins.transition('fill')),
   DeleteButton: styled$g.button.withConfig({
     displayName: "styles__DeleteButton",
     componentId: "sc-1vnh4co-1"
   })(["width:16px;height:16px;margin-left:12px;"]),
-  deleteButtonPathStyles: css(["", ";"], mixins.transition('fill')),
   Children: styled$g.div.withConfig({
     displayName: "styles__Children",
     componentId: "sc-1vnh4co-2"
@@ -7197,21 +7193,18 @@ var Chip = function Chip(_ref) {
     selected: selected,
     textColor: textColor,
     variant: variant,
-    iconColor: iconColor,
     hasLink: hasLink,
     onlyIcon: !children && icon
   }, props), icon && /*#__PURE__*/React__default.createElement(Icon, {
     className: "chip-icon",
     name: icon,
     color: iconColor,
-    size: iconSize,
-    pathStyles: styled$d.iconPathStyles
+    size: iconSize
   }), children && /*#__PURE__*/React__default.createElement(styled$d.Children, null, children), onDelete && /*#__PURE__*/React__default.createElement(styled$d.DeleteButton, {
     type: "button",
     onClick: onDelete
   }, /*#__PURE__*/React__default.createElement(Icon, {
     color: "black",
-    pathStyles: styled$d.deleteButtonPathStyles,
     className: "delete-button",
     name: "cross_circle_flat",
     size: 16
@@ -17064,40 +17057,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,
@@ -17276,15 +17235,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;
@@ -17617,7 +17567,7 @@ newPromiseCapability$2.f = function (C) {
 };
 
 var anObject = anObject$h;
-var isObject$1 = isObject$d;
+var isObject$1 = isObject$c;
 var newPromiseCapability$1 = newPromiseCapability$2;
 
 var promiseResolve$1 = function (C, x) {
@@ -17684,7 +17634,7 @@ var setToStringTag = setToStringTag$5;
 var setSpecies = setSpecies$1;
 var aCallable = aCallable$7;
 var isCallable = isCallable$k;
-var isObject = isObject$d;
+var isObject = isObject$c;
 var anInstance = anInstance$3;
 var inspectSource = inspectSource$4;
 var iterate = iterate$1;
@@ -35404,28 +35354,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",
@@ -35493,8 +35421,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,
@@ -35503,8 +35430,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,
@@ -35547,7 +35473,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({
@@ -35556,10 +35482,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",
@@ -35569,7 +35507,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"
@@ -35581,7 +35519,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({