@contentful/field-editor-location 1.2.2 → 1.2.3

package/CHANGELOG.md

@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.2.3](https://github.com/contentful/field-editors/compare/@contentful/field-editor-location@1.2.2...@contentful/field-editor-location@1.2.3) (2023-04-19)
+
+**Note:** Version bump only for package @contentful/field-editor-location
+
 ## [1.2.2](https://github.com/contentful/field-editors/compare/@contentful/field-editor-location@1.2.1...@contentful/field-editor-location@1.2.2) (2023-03-14)
 
 **Note:** Version bump only for package @contentful/field-editor-location

package/dist/field-editor-location.cjs.development.js

@@ -15,94 +15,71 @@ var GoogleMapReact = _interopDefault(require('google-map-react'));
 var f36Components = require('@contentful/f36-components');
 var tokens = _interopDefault(require('@contentful/f36-tokens'));
 
-function _inheritsLoose(subClass, superClass) {
-  subClass.prototype = Object.create(superClass.prototype);
-  subClass.prototype.constructor = subClass;
-
-  _setPrototypeOf(subClass, superClass);
-}
-
-function _setPrototypeOf(o, p) {
-  _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
-    o.__proto__ = p;
-    return o;
-  };
-
-  return _setPrototypeOf(o, p);
-}
-
-var styles = {
+/* eslint-disable @typescript-eslint/no-explicit-any */
+const styles = {
   root: /*#__PURE__*/emotion.css({
     height: '300px',
     width: '100%'
   })
 };
-var BerlinLocation = {
+const BerlinLocation = {
   lat: 52.5018,
   lng: 13.41115439
 };
-var GoogleMapView = /*#__PURE__*/function (_React$Component) {
-  _inheritsLoose(GoogleMapView, _React$Component);
-
-  function GoogleMapView(props) {
-    var _this;
-
-    _this = _React$Component.call(this, props) || this;
-
-    _this.onGoogleApiLoaded = function (event) {
-      var maps = event.maps,
-          map = event.map;
-      var marker = new maps.Marker({
-        map: map,
+class GoogleMapView extends React__default.Component {
+  constructor(props) {
+    super(props);
+
+    this.onGoogleApiLoaded = event => {
+      const {
+        maps,
+        map
+      } = event;
+      const marker = new maps.Marker({
+        map,
         position: map.getCenter(),
-        cursor: _this.props.disabled ? 'not-allowed' : 'auto',
-        draggable: !_this.props.disabled,
-        visible: Boolean(_this.props.location)
+        cursor: this.props.disabled ? 'not-allowed' : 'auto',
+        draggable: !this.props.disabled,
+        visible: Boolean(this.props.location)
       });
-      maps.event.addListener(map, 'click', function (event) {
-        if (_this.props.disabled || !_this.state.marker || !_this.state.maps) {
+      maps.event.addListener(map, 'click', event => {
+        if (this.props.disabled || !this.state.marker || !this.state.maps) {
           return;
         }
 
-        _this.state.marker.setPosition(event.latLng);
-
-        _this.state.marker.setVisible(true);
-
-        _this.props.onChangeLocation({
+        this.state.marker.setPosition(event.latLng);
+        this.state.marker.setVisible(true);
+        this.props.onChangeLocation({
           lat: event.latLng.lat(),
           lng: event.latLng.lng()
         });
       });
-      maps.event.addListener(marker, 'dragend', function (event) {
-        _this.props.onChangeLocation({
+      maps.event.addListener(marker, 'dragend', event => {
+        this.props.onChangeLocation({
           lat: event.latLng.lat(),
           lng: event.latLng.lng()
         });
       });
-
-      _this.setState({
-        marker: marker,
-        maps: maps
-      }, function () {
-        _this.props.onGoogleApiLoaded({
-          maps: maps
+      this.setState({
+        marker,
+        maps
+      }, () => {
+        this.props.onGoogleApiLoaded({
+          maps
         });
       });
     };
 
-    _this.state = {
+    this.state = {
       marker: undefined,
       maps: undefined
     };
-    return _this;
   }
 
-  var _proto = GoogleMapView.prototype;
-
-  _proto.componentDidUpdate = function componentDidUpdate() {
+  componentDidUpdate() {
     if (this.state.marker && this.state.maps) {
       if (this.props.location) {
-        var latLng = new this.state.maps.LatLng(this.props.location.lat, this.props.location.lng);
+        const latLng = new this.state.maps.LatLng(this.props.location.lat, this.props.location.lng);
         this.state.marker.setPosition(latLng);
         this.state.marker.setVisible(true);
       } else {
@@ -112,9 +89,9 @@ var GoogleMapView = /*#__PURE__*/function (_React$Component) {
       this.state.marker.setDraggable(!this.props.disabled);
       this.state.marker.setCursor(this.props.disabled ? 'not-allowed' : 'auto');
     }
-  };
+  }
 
-  _proto.render = function render() {
+  render() {
     return React__default.createElement("div", {
       className: styles.root
     }, React__default.createElement(GoogleMapReact, {
@@ -132,12 +109,11 @@ var GoogleMapView = /*#__PURE__*/function (_React$Component) {
       yesIWantToUseGoogleMapApiInternals: true,
       onGoogleApiLoaded: this.onGoogleApiLoaded
     }));
-  };
+  }
 
-  return GoogleMapView;
-}(React__default.Component);
+}
 
-var styles$1 = {
+const styles$1 = {
   root: /*#__PURE__*/emotion.css({
     width: '100%'
   }),
@@ -163,25 +139,13 @@ var styles$1 = {
   })
 };
 function LocationSearchInput(props) {
-  var _React$useState = React__default.useState(false),
-      isSearching = _React$useState[0],
-      setIsSearching = _React$useState[1];
-
-  var _React$useState2 = React__default.useState(''),
-      address = _React$useState2[0],
-      setAddress = _React$useState2[1];
-
-  var _React$useState3 = React__default.useState(false),
-      hasError = _React$useState3[0],
-      setHasError = _React$useState3[1];
-
-  var _React$useState4 = React__default.useState(null),
-      suggestion = _React$useState4[0],
-      setSuggestion = _React$useState4[1];
-
-  React__default.useEffect(function () {
+  const [isSearching, setIsSearching] = React__default.useState(false);
+  const [address, setAddress] = React__default.useState('');
+  const [hasError, setHasError] = React__default.useState(false);
+  const [suggestion, setSuggestion] = React__default.useState(null);
+  React__default.useEffect(() => {
     setIsSearching(true);
-    props.onGetAddressFromLocation(props.value, address).then(function (address) {
+    props.onGetAddressFromLocation(props.value, address).then(address => {
       setAddress(address);
       setIsSearching(false);
     }); // eslint-disable-next-line react-hooks/exhaustive-deps -- TODO: Evaluate the dependencies
@@ -195,7 +159,7 @@ function LocationSearchInput(props) {
     isInvalid: hasError,
     placeholder: "Start typing to find location",
     value: address,
-    onChange: function onChange(e) {
+    onChange: e => {
       setAddress(e.target.value);
       setHasError(false);
       setSuggestion(null);
@@ -206,7 +170,7 @@ function LocationSearchInput(props) {
       }
 
       setIsSearching(true);
-      props.onSearchAddress(e.target.value).then(function (value) {
+      props.onSearchAddress(e.target.value).then(value => {
         setIsSearching(false);
 
         if (value === null) {
@@ -234,7 +198,7 @@ function LocationSearchInput(props) {
   }, React__default.createElement(f36Components.Button, {
     variant: "transparent",
     testId: "location-editor-suggestion",
-    onClick: function onClick() {
+    onClick: () => {
       setAddress(suggestion.address);
       props.onChangeLocation(suggestion.location);
       setSuggestion(null);
@@ -252,7 +216,7 @@ var ViewType;
   ViewType["Coordinates"] = "Coordinates";
 })(ViewType || (ViewType = {}));
 
-var styles$2 = {
+const styles$2 = {
   root: /*#__PURE__*/emotion.css({
     display: 'flex',
     flexDirection: 'row',
@@ -297,7 +261,7 @@ function LocationSelector(props) {
     isDisabled: props.disabled,
     value: ViewType.Address,
     isChecked: props.view === ViewType.Address,
-    onChange: function onChange() {
+    onChange: () => {
       props.onChangeView(ViewType.Address);
     }
   }, "Address"), React__default.createElement(f36Components.Radio, {
@@ -309,7 +273,7 @@ function LocationSelector(props) {
     isDisabled: props.disabled,
     value: ViewType.Coordinates,
     isChecked: props.view === ViewType.Coordinates,
-    onChange: function onChange() {
+    onChange: () => {
       props.onChangeView(ViewType.Coordinates);
     }
   }, "Coordinates")), props.view === ViewType.Address && React__default.createElement("div", {
@@ -332,7 +296,7 @@ function LocationSelector(props) {
     placeholder: "Between -90 and 90",
     isDisabled: props.disabled,
     value: props.value ? String(props.value.lat) : '',
-    onChange: function onChange(e) {
+    onChange: e => {
       props.onChangeLocation({
         lng: props.value && props.value.lng !== undefined ? props.value.lng : 0,
         lat: Number(e.target.value) || 0
@@ -354,7 +318,7 @@ function LocationSelector(props) {
     placeholder: "Between -180 and 180",
     isDisabled: props.disabled,
     value: props.value ? String(props.value.lng) : '',
-    onChange: function onChange(e) {
+    onChange: e => {
       props.onChangeLocation({
         lat: props.value && props.value.lat !== undefined ? props.value.lat : 0,
         lng: Number(e.target.value) || 0
@@ -371,7 +335,7 @@ function LocationSelector(props) {
     isDisabled: props.disabled,
     testId: "location-editor-clear",
     className: styles$2.clearBtn,
-    onClick: function onClick() {
+    onClick: () => {
       props.onChangeLocation(undefined);
     }
   }, "Clear")));
@@ -388,144 +352,132 @@ function toLocationValue(coords) {
   }
 }
 
-var LocationEditor = /*#__PURE__*/function (_React$Component) {
-  _inheritsLoose(LocationEditor, _React$Component);
-
-  function LocationEditor(props) {
-    var _this;
-
-    _this = _React$Component.call(this, props) || this;
-    _this.onSearchAddress = throttle(function (value) {
-      if (!_this.state.mapsObject) {
+class LocationEditor extends React.Component {
+  constructor(props) {
+    super(props);
+    this.onSearchAddress = throttle(value => {
+      if (!this.state.mapsObject) {
         return Promise.resolve(null);
       }
 
-      var mapsObject = _this.state.mapsObject;
+      const {
+        mapsObject
+      } = this.state;
 
       if (!value) {
         return Promise.resolve(null);
       }
 
-      return new Promise(function (resolve) {
-        var geocoder = new mapsObject.Geocoder();
+      return new Promise(resolve => {
+        const geocoder = new mapsObject.Geocoder();
         geocoder.geocode({
           address: value
-        }, resolve, function () {
+        }, resolve, () => {
           resolve(null);
         });
       });
     }, 300);
 
-    _this.onGetAddressFromLocation = function (location, value) {
-      if (!_this.state.mapsObject || !location) {
+    this.onGetAddressFromLocation = (location, value) => {
+      if (!this.state.mapsObject || !location) {
         return Promise.resolve('');
       }
 
-      var mapsObject = _this.state.mapsObject;
-      return new Promise(function (resolve) {
-        var geocoder = new mapsObject.Geocoder();
+      const {
+        mapsObject
+      } = this.state;
+      return new Promise(resolve => {
+        const geocoder = new mapsObject.Geocoder();
         geocoder.geocode({
-          location: location
-        }, function (result) {
+          location
+        }, result => {
           if (result && result.length > 0) {
-            var addresses = result.map(function (item) {
-              return item.formatted_address;
-            });
-            resolve(addresses.find(function (item) {
-              return item === value;
-            }) || addresses[0]);
+            const addresses = result.map(item => item.formatted_address);
+            resolve(addresses.find(item => item === value) || addresses[0]);
           } else {
             resolve('');
           }
-        }, function () {
+        }, () => {
           resolve('');
         });
       });
     };
 
-    _this.state = {
+    this.state = {
       localValue: props.value ? {
         lng: props.value.lon,
         lat: props.value.lat
       } : undefined,
       mapsObject: null
     };
-    return _this;
   } // @ts-expect-error
 
 
-  var _proto = LocationEditor.prototype;
-
-  _proto.render = function render() {
-    var _this2 = this;
-
-    var _this$state = this.state,
-        mapsObject = _this$state.mapsObject,
-        localValue = _this$state.localValue;
+  render() {
+    const {
+      mapsObject,
+      localValue
+    } = this.state;
     return React.createElement("div", {
       "data-test-id": "location-editor"
     }, React.createElement(GoogleMapView, {
       disabled: this.props.disabled || mapsObject === null,
       googleMapsKey: this.props.googleMapsKey,
       location: localValue,
-      onGoogleApiLoaded: function onGoogleApiLoaded(_ref) {
-        var maps = _ref.maps;
-
-        _this2.setState({
+      onGoogleApiLoaded: ({
+        maps
+      }) => {
+        this.setState({
           mapsObject: maps
         });
       },
-      onChangeLocation: function onChangeLocation(coords) {
-        _this2.setState({
+      onChangeLocation: coords => {
+        this.setState({
           localValue: coords
         });
-
-        _this2.props.setValue(toLocationValue(coords));
+        this.props.setValue(toLocationValue(coords));
       }
     }), React.createElement(LocationSelector, {
       disabled: this.props.disabled || mapsObject === null,
       value: localValue,
       view: this.props.selectedView,
-      onChangeView: function onChangeView(view) {
-        _this2.props.setSelectedView(view);
+      onChangeView: view => {
+        this.props.setSelectedView(view);
       },
-      onChangeLocation: function onChangeLocation(coords) {
-        _this2.setState({
+      onChangeLocation: coords => {
+        this.setState({
           localValue: coords
         });
-
-        _this2.props.setValue(toLocationValue(coords));
+        this.props.setValue(toLocationValue(coords));
       },
       onSearchAddress: this.onSearchAddress,
       onGetAddressFromLocation: this.onGetAddressFromLocation
     }));
-  };
+  }
 
-  return LocationEditor;
-}(React.Component);
+}
 function LocationEditorConnected(props) {
-  var field = props.field;
-  var googleMapsKey = props.parameters ? props.parameters.instance.googleMapsKey : undefined;
-
-  var _React$useState = React.useState(ViewType.Address),
-      selectedView = _React$useState[0],
-      setSelectedView = _React$useState[1];
-
+  const {
+    field
+  } = props;
+  const googleMapsKey = props.parameters ? props.parameters.instance.googleMapsKey : undefined;
+  const [selectedView, setSelectedView] = React.useState(ViewType.Address);
   return React.createElement(fieldEditorShared.FieldConnector, {
-    isEqualValues: function isEqualValues(value1, value2) {
+    isEqualValues: (value1, value2) => {
       return deepEqual(value1, value2);
     },
     field: field,
     isInitiallyDisabled: props.isInitiallyDisabled
-  }, function (_ref2) {
-    var value = _ref2.value,
-        disabled = _ref2.disabled,
-        setValue = _ref2.setValue,
-        externalReset = _ref2.externalReset;
+  }, ({
+    value,
+    disabled,
+    setValue,
+    externalReset
+  }) => {
     return React.createElement(LocationEditor // on external change reset component completely and init with initial value again
     , {
       // on external change reset component completely and init with initial value again
-      key: "location-editor-" + externalReset,
+      key: `location-editor-${externalReset}`,
       value: value,
       disabled: disabled,
       setValue: setValue,
@@ -539,7 +491,7 @@ LocationEditorConnected.defaultProps = {
   isInitiallyDisabled: true
 };
 
-var LocationEditor$1 = LocationEditorConnected;
+const LocationEditor$1 = LocationEditorConnected;
 
 exports.LocationEditor = LocationEditor$1;
 //# sourceMappingURL=field-editor-location.cjs.development.js.map