dtable-ui-component 7.0.13 → 7.0.15

package/lib/GeolocationEditor/pc-editor/map-selection-editor/index.js

@@ -1,12 +1,11 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
 var _react = _interopRequireWildcard(require("react"));
 var _dtableUtils = require("dtable-utils");
 var _toaster = _interopRequireDefault(require("../../../toaster"));
@@ -40,12 +39,17 @@ class MapSelectionEditor extends _react.Component {
         this.map = new window.BMap.Map('geolocation-map-selection-container', {
           enableMapClick: false
         });
-        let _getInitCenter = (0, _mapEditorUtils.getInitCenter)(true),
-          lng = _getInitCenter.lng,
-          lat = _getInitCenter.lat,
-          zoom = _getInitCenter.zoom;
-        const value = this.state.value;
-        const lngLat = value.lngLat;
+        let {
+          lng,
+          lat,
+          zoom
+        } = (0, _mapEditorUtils.getInitCenter)(true);
+        const {
+          value
+        } = this.state;
+        const {
+          lngLat
+        } = value;
         if ((0, _cell.isValidPosition)(lngLat.lng, lngLat.lat)) {
           lng = lngLat.lng;
           lat = lngLat.lat;
@@ -66,9 +70,11 @@ class MapSelectionEditor extends _react.Component {
           const point = event.point;
           const geoCoder = new window.BMap.Geocoder();
           geoCoder.getLocation(point, result => {
-            const surroundingPois = result.surroundingPois,
-              address = result.address,
-              point = result.point;
+            const {
+              surroundingPois,
+              address,
+              point
+            } = result;
             if (surroundingPois.length === 0) {
               value.address = address;
               value.lngLat = {
@@ -79,10 +85,12 @@ class MapSelectionEditor extends _react.Component {
               value.title = '';
             } else {
               const position = surroundingPois[0];
-              const address = position.address,
-                title = position.title,
-                tags = position.tags,
-                point = position.point;
+              const {
+                address,
+                title,
+                tags,
+                point
+              } = position;
               value.address = address || '';
               value.title = title || '';
               value.tag = tags || [];
@@ -97,7 +105,9 @@ class MapSelectionEditor extends _react.Component {
       });
     };
     this.addMarkerByPosition = value => {
-      const lngLat = value.lngLat;
+      const {
+        lngLat
+      } = value;
       let point = new window.BMap.Point(lngLat.lng, lngLat.lat);
       const marker = new window.BMap.Marker(point, {
         offset: new window.BMap.Size(-2, -5)
@@ -115,7 +125,7 @@ class MapSelectionEditor extends _react.Component {
           backgroundColor: '#ffffff',
           boxShadow: '1px 2px 1px rgba(0,0,0,.15)',
           padding: '3px 10px',
-          transform: "translate(-50%, ".concat(translateY, ")"),
+          transform: `translate(-50%, ${translateY})`,
           borderRadius: '3px',
           fontWeight: '500',
           left: '7px'
@@ -150,17 +160,38 @@ class MapSelectionEditor extends _react.Component {
       }
     };
     this.getLabelContent = value => {
-      const address = value.address,
-        title = value.title,
-        tag = value.tag;
+      const {
+        address,
+        title,
+        tag
+      } = value;
       const tagContent = Array.isArray(tag) && tag.length > 0 ? tag[0] : '';
       if (title) {
-        return "\n          <div class='dtable-ui-selection-label-content' id='dtable-ui-selection-label-content'>\n            <i class='dtable-font dtable-icon-down3'></i>\n            <span class='label-title text-truncate' title=".concat(title, ">").concat(title, "</span>\n            ").concat(tagContent && "<span class='label-tag'>".concat(tagContent, "</span>"), "\n            <span class='dtable-font dtable-icon-x' id='selection-label-close'></span>\n            <span class='label-address-tip'>").concat((0, _lang.getLocale)('Address'), "</span>\n            <span class='label-address text-truncate' title=").concat(address, ">").concat(address, "</span>\n            <div class='label-submit btn btn-primary' id='selection-label-submit'>").concat((0, _lang.getLocale)('Fill_in'), "</div>\n          </div>\n        ");
+        return `
+          <div class='dtable-ui-selection-label-content' id='dtable-ui-selection-label-content'>
+            <i class='dtable-font dtable-icon-down3'></i>
+            <span class='label-title text-truncate' title=${title}>${title}</span>
+            ${tagContent && `<span class='label-tag'>${tagContent}</span>`}
+            <span class='dtable-font dtable-icon-x' id='selection-label-close'></span>
+            <span class='label-address-tip'>${(0, _lang.getLocale)('Address')}</span>
+            <span class='label-address text-truncate' title=${address}>${address}</span>
+            <div class='label-submit btn btn-primary' id='selection-label-submit'>${(0, _lang.getLocale)('Fill_in')}</div>
+          </div>
+        `;
       }
-      return "\n        <div class='dtable-ui-selection-label-content simple' id='dtable-ui-selection-label-content'>\n          <i class='dtable-font dtable-icon-down3'></i>\n          <span class='dtable-font dtable-icon-x' id='selection-label-close'></span>\n          <span class='label-address text-truncate simple' title=".concat(address, ">").concat(address, "</span>\n          <div class='label-submit btn btn-primary' id='selection-label-submit'>").concat((0, _lang.getLocale)('Fill_in'), "</div>\n        </div>\n      ");
+      return `
+        <div class='dtable-ui-selection-label-content simple' id='dtable-ui-selection-label-content'>
+          <i class='dtable-font dtable-icon-down3'></i>
+          <span class='dtable-font dtable-icon-x' id='selection-label-close'></span>
+          <span class='label-address text-truncate simple' title=${address}>${address}</span>
+          <div class='label-submit btn btn-primary' id='selection-label-submit'>${(0, _lang.getLocale)('Fill_in')}</div>
+        </div>
+      `;
     };
     this.getInitValue = () => {
-      const value = this.props.value;
+      const {
+        value
+      } = this.props;
       if (!value || (0, _dtableUtils.isEmptyObject)(value)) {
         return {
           address: '',
@@ -172,7 +203,9 @@ class MapSelectionEditor extends _react.Component {
       return value;
     };
     this.onSearch = () => {
-      const inputValue = this.state.inputValue;
+      const {
+        inputValue
+      } = this.state;
       let options = {
         onSearchComplete: results => {
           const status = local.getStatus();
@@ -229,7 +262,9 @@ class MapSelectionEditor extends _react.Component {
       event.preventDefault();
       event.stopPropagation();
       event.nativeEvent.stopImmediatePropagation();
-      const value = this.state.value;
+      const {
+        value
+      } = this.state;
       this.props.setValue(value);
       this.setState({
         isShowLargeEditor: !this.state.isShowLargeEditor
@@ -252,9 +287,11 @@ class MapSelectionEditor extends _react.Component {
         const geoCoder = new window.BMap.Geocoder();
         geoCoder.getLocation(point, result => {
           let value = {};
-          const surroundingPois = result.surroundingPois,
-            address = result.address,
-            point = result.point;
+          const {
+            surroundingPois,
+            address,
+            point
+          } = result;
           if (surroundingPois.length === 0) {
             value.address = address;
             value.lngLat = {
@@ -265,10 +302,12 @@ class MapSelectionEditor extends _react.Component {
             value.title = '';
           } else {
             const position = surroundingPois[0];
-            const address = position.address,
-              title = position.title,
-              tags = position.tags,
-              point = position.point;
+            const {
+              address,
+              title,
+              tags,
+              point
+            } = position;
             value.address = address || '';
             value.title = title || '';
             value.tag = tags || [];
@@ -297,7 +336,9 @@ class MapSelectionEditor extends _react.Component {
       (0, _mapEditorUtils.locateCurrentPosition)(this.map, this.mapType, this.geolocationCallback);
     };
     this.renderSearchResults = () => {
-      const searchResults = this.state.searchResults;
+      const {
+        searchResults
+      } = this.state;
       if (searchResults.length === 0) return null;
       return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         className: "search-results-container",
@@ -319,9 +360,10 @@ class MapSelectionEditor extends _react.Component {
     const _value = this.getInitValue();
     this.readOnly = props.readOnly;
     const _inputValue = _value.title || _value.address || '';
-    const _getMapInfo = (0, _mapEditorUtils.getMapInfo)(props.config),
-      mapType = _getMapInfo.mapType,
-      mapKey = _getMapInfo.mapKey;
+    const {
+      mapType,
+      mapKey
+    } = (0, _mapEditorUtils.getMapInfo)(props.config);
     this.state = {
       isLoading: true,
       value: _value,
@@ -350,14 +392,16 @@ class MapSelectionEditor extends _react.Component {
     }
   }
   render() {
-    const _this$state = this.state,
-      isLoading = _this$state.isLoading,
-      inputValue = _this$state.inputValue,
-      isShowLargeEditor = _this$state.isShowLargeEditor;
+    const {
+      isLoading,
+      inputValue,
+      isShowLargeEditor
+    } = this.state;
     if (isShowLargeEditor) {
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_largeEditor.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, this.props), {}, {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_largeEditor.default, {
+        ...this.props,
         toggleFullScreen: this.toggleFullScreen
-      }));
+      });
     }
     if (this.mapType === _mapEditorUtils.MAP_TYPES.G_MAP || this.mapType === _mapEditorUtils.MAP_TYPES.M_MAP) {
       return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.Fragment, {

package/lib/GeolocationEditor/pc-editor/map-selection-editor/large-editor/index.js

@@ -27,12 +27,17 @@ class LargeMapSelectionEditorDialog extends _react.default.Component {
         this.map = new window.BMap.Map('geolocation-map-selection-container-large', {
           enableMapClick: false
         });
-        let _getInitCenter = (0, _mapEditorUtils.getInitCenter)(true),
-          lng = _getInitCenter.lng,
-          lat = _getInitCenter.lat,
-          zoom = _getInitCenter.zoom;
-        const value = this.state.value;
-        const lngLat = value.lngLat;
+        let {
+          lng,
+          lat,
+          zoom
+        } = (0, _mapEditorUtils.getInitCenter)(true);
+        const {
+          value
+        } = this.state;
+        const {
+          lngLat
+        } = value;
         if ((0, _cell.isValidPosition)(lngLat === null || lngLat === void 0 ? void 0 : lngLat.lng, lngLat === null || lngLat === void 0 ? void 0 : lngLat.lat)) {
           lng = lngLat.lng;
           lat = lngLat.lat;
@@ -53,9 +58,11 @@ class LargeMapSelectionEditorDialog extends _react.default.Component {
           const point = event.point;
           const geoCoder = new window.BMap.Geocoder();
           geoCoder.getLocation(point, result => {
-            const surroundingPois = result.surroundingPois,
-              address = result.address,
-              point = result.point;
+            const {
+              surroundingPois,
+              address,
+              point
+            } = result;
             if (surroundingPois.length === 0) {
               value.address = address;
               value.lngLat = {
@@ -66,10 +73,12 @@ class LargeMapSelectionEditorDialog extends _react.default.Component {
               value.title = '';
             } else {
               const position = surroundingPois[0];
-              const address = position.address,
-                title = position.title,
-                tags = position.tags,
-                point = position.point;
+              const {
+                address,
+                title,
+                tags,
+                point
+              } = position;
               value.address = address || '';
               value.title = title || '';
               value.tag = tags || [];
@@ -84,7 +93,9 @@ class LargeMapSelectionEditorDialog extends _react.default.Component {
       });
     };
     this.addMarkerByPosition = value => {
-      const lngLat = value.lngLat;
+      const {
+        lngLat
+      } = value;
       let point = new window.BMap.Point(lngLat.lng, lngLat.lat);
       const marker = new window.BMap.Marker(point, {
         offset: new window.BMap.Size(-2, -5)
@@ -102,7 +113,7 @@ class LargeMapSelectionEditorDialog extends _react.default.Component {
           backgroundColor: '#ffffff',
           boxShadow: '1px 2px 1px rgba(0,0,0,.15)',
           padding: '3px 10px',
-          transform: "translate(-50%, ".concat(translateY, ")"),
+          transform: `translate(-50%, ${translateY})`,
           borderRadius: '3px',
           fontWeight: '500',
           left: '7px'
@@ -137,18 +148,39 @@ class LargeMapSelectionEditorDialog extends _react.default.Component {
       }
     };
     this.getLabelContent = value => {
-      const address = value.address,
-        title = value.title,
-        tag = value.tag;
+      const {
+        address,
+        title,
+        tag
+      } = value;
       const tagContent = Array.isArray(tag) && tag.length > 0 ? tag[0] : '';
       if (title) {
-        return "\n          <div class='dtable-ui-selection-label-content' id='dtable-ui-selection-label-content'>\n            <i class='dtable-font dtable-icon-down3'></i>\n            <span class='label-title text-truncate' title=".concat(title, ">").concat(title, "</span>\n            ").concat(tagContent && "<span class='label-tag'>".concat(tagContent, "</span>"), "\n            <span class='dtable-font dtable-icon-x' id='selection-label-close'></span>\n            <span class='label-address-tip'>").concat((0, _lang.getLocale)('Address'), "</span>\n            <span class='label-address text-truncate' title=").concat(address, ">").concat(address, "</span>\n            <div class='label-submit btn btn-primary' id='selection-label-submit'>").concat((0, _lang.getLocale)('Fill_in'), "</div>\n          </div>\n        ");
+        return `
+          <div class='dtable-ui-selection-label-content' id='dtable-ui-selection-label-content'>
+            <i class='dtable-font dtable-icon-down3'></i>
+            <span class='label-title text-truncate' title=${title}>${title}</span>
+            ${tagContent && `<span class='label-tag'>${tagContent}</span>`}
+            <span class='dtable-font dtable-icon-x' id='selection-label-close'></span>
+            <span class='label-address-tip'>${(0, _lang.getLocale)('Address')}</span>
+            <span class='label-address text-truncate' title=${address}>${address}</span>
+            <div class='label-submit btn btn-primary' id='selection-label-submit'>${(0, _lang.getLocale)('Fill_in')}</div>
+          </div>
+        `;
       } else {
-        return "\n          <div class='dtable-ui-selection-label-content simple' id='dtable-ui-selection-label-content'>\n            <i class='dtable-font dtable-icon-down3'></i>\n            <span class='dtable-font dtable-icon-x' id='selection-label-close'></span>\n            <span class='label-address text-truncate simple' title=".concat(address, ">").concat(address, "</span>\n            <div class='label-submit btn btn-primary' id='selection-label-submit'>").concat((0, _lang.getLocale)('Fill_in'), "</div>\n          </div>\n        ");
+        return `
+          <div class='dtable-ui-selection-label-content simple' id='dtable-ui-selection-label-content'>
+            <i class='dtable-font dtable-icon-down3'></i>
+            <span class='dtable-font dtable-icon-x' id='selection-label-close'></span>
+            <span class='label-address text-truncate simple' title=${address}>${address}</span>
+            <div class='label-submit btn btn-primary' id='selection-label-submit'>${(0, _lang.getLocale)('Fill_in')}</div>
+          </div>
+        `;
       }
     };
     this.getInitValue = () => {
-      const value = this.props.value;
+      const {
+        value
+      } = this.props;
       if (!value || (0, _dtableUtils.isEmptyObject)(value)) {
         return {
           address: '',
@@ -160,7 +192,9 @@ class LargeMapSelectionEditorDialog extends _react.default.Component {
       return value;
     };
     this.onSearch = () => {
-      const inputValue = this.state.inputValue;
+      const {
+        inputValue
+      } = this.state;
       let options = {
         onSearchComplete: results => {
           const status = local.getStatus();
@@ -223,12 +257,16 @@ class LargeMapSelectionEditorDialog extends _react.default.Component {
       event.preventDefault();
       event.stopPropagation();
       event.nativeEvent.stopImmediatePropagation();
-      const value = this.state.value;
+      const {
+        value
+      } = this.state;
       this.props.setValue(value);
       this.props.toggleFullScreen(event);
     };
     this.renderSearchResults = () => {
-      const searchResults = this.state.searchResults;
+      const {
+        searchResults
+      } = this.state;
       if (searchResults.length === 0) return null;
       return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         className: "search-results-container",
@@ -269,9 +307,11 @@ class LargeMapSelectionEditorDialog extends _react.default.Component {
         const geoCoder = new window.BMap.Geocoder();
         geoCoder.getLocation(point, result => {
           let value = {};
-          const surroundingPois = result.surroundingPois,
-            address = result.address,
-            point = result.point;
+          const {
+            surroundingPois,
+            address,
+            point
+          } = result;
           if (surroundingPois.length === 0) {
             value.address = address;
             value.lngLat = {
@@ -282,10 +322,12 @@ class LargeMapSelectionEditorDialog extends _react.default.Component {
             value.title = '';
           } else {
             const position = surroundingPois[0];
-            const address = position.address,
-              title = position.title,
-              tags = position.tags,
-              point = position.point;
+            const {
+              address,
+              title,
+              tags,
+              point
+            } = position;
             value.address = address || '';
             value.title = title || '';
             value.tag = tags || [];
@@ -300,13 +342,16 @@ class LargeMapSelectionEditorDialog extends _react.default.Component {
         _toaster.default.danger((0, _lang.getLocale)('Positioning_failed'));
       }
     };
-    const readOnly = props.readOnly,
-      config = props.config;
+    const {
+      readOnly,
+      config
+    } = props;
     const _value = this.getInitValue();
     const _inputValue = _value.title || _value.address || '';
-    const _getMapInfo = (0, _mapEditorUtils.getMapInfo)(config),
-      mapType = _getMapInfo.mapType,
-      mapKey = _getMapInfo.mapKey;
+    const {
+      mapType,
+      mapKey
+    } = (0, _mapEditorUtils.getMapInfo)(config);
     this.readOnly = readOnly;
     this.state = {
       isLoading: true,
@@ -342,9 +387,10 @@ class LargeMapSelectionEditorDialog extends _react.default.Component {
     }
   }
   render() {
-    const _this$state = this.state,
-      isLoading = _this$state.isLoading,
-      inputValue = _this$state.inputValue;
+    const {
+      isLoading,
+      inputValue
+    } = this.state;
     return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactstrap.Modal, {
       size: "lg",
       isOpen: true,

package/lib/GeolocationEditor/pc-editor/province-city-editor.js

@@ -12,7 +12,7 @@ var _DTableCustomFooter = _interopRequireDefault(require("../../DTableCustomFoot
 var _selectorList = _interopRequireDefault(require("./selector-list"));
 var _selectorHeaderItem = _interopRequireDefault(require("./selector-header-item"));
 var _Loading = _interopRequireDefault(require("../../Loading"));
-var _parseGeolocation2 = _interopRequireDefault(require("./parse-geolocation"));
+var _parseGeolocation = _interopRequireDefault(require("./parse-geolocation"));
 var _constants = require("../../constants");
 var _lang = require("../../lang");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -84,7 +84,9 @@ class ProvinceCityEditor extends _react.Component {
       this.props.setValue(this.value);
     };
     this.selectSelectorType = type => {
-      const selectedProvince = this.state.selectedProvince;
+      const {
+        selectedProvince
+      } = this.state;
       if (!selectedProvince) return;
       this.setState({
         selectedItem: type
@@ -104,9 +106,10 @@ class ProvinceCityEditor extends _react.Component {
         this.timer = null;
         const value = this.parseRef.value;
         if (this.isComposing) return;
-        const _parseGeolocation = (0, _parseGeolocation2.default)(this.locations, value),
-          province = _parseGeolocation.province,
-          city = _parseGeolocation.city;
+        const {
+          province,
+          city
+        } = (0, _parseGeolocation.default)(this.locations, value);
         this.value = Object.assign({}, this.value);
         this.props.setValue(this.value);
         if (!province) return;
@@ -129,9 +132,10 @@ class ProvinceCityEditor extends _react.Component {
       }
     };
     this.onSubmit = () => {
-      const _this$value = this.value,
-        province = _this$value.province,
-        city = _this$value.city;
+      const {
+        province,
+        city
+      } = this.value;
       if (!province || !city) {
         const errMessage = (0, _lang.getLocale)('Province/City_must_be_filled_in');
         this.setState({
@@ -158,10 +162,11 @@ class ProvinceCityEditor extends _react.Component {
   componentDidMount() {
     this.props.getData().then(data => {
       this.locations = data;
-      const _this$initLocationSel = this.initLocationSelecting(this.value),
-        selectedProvince = _this$initLocationSel.selectedProvince,
-        selectedCity = _this$initLocationSel.selectedCity,
-        selectedItem = _this$initLocationSel.selectedItem;
+      const {
+        selectedProvince,
+        selectedCity,
+        selectedItem
+      } = this.initLocationSelecting(this.value);
       this.setState({
         isLoadingData: false,
         selectedProvince,
@@ -171,13 +176,14 @@ class ProvinceCityEditor extends _react.Component {
     });
   }
   render() {
-    const _this$state = this.state,
-      selectedItem = _this$state.selectedItem,
-      selectedCity = _this$state.selectedCity,
-      selectedProvince = _this$state.selectedProvince,
-      isShowSelector = _this$state.isShowSelector,
-      isLoadingData = _this$state.isLoadingData,
-      location = _this$state.location;
+    const {
+      selectedItem,
+      selectedCity,
+      selectedProvince,
+      isShowSelector,
+      isLoadingData,
+      location
+    } = this.state;
     return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
       children: [!isLoadingData ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
         onClick: this.onClick,
@@ -191,7 +197,7 @@ class ProvinceCityEditor extends _react.Component {
             className: "dtable-ui-geolocation-editor-item-right",
             children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
               onClick: this.onToggleSelector,
-              className: "dtable-ui-geolocation-editor-selector text-truncate ".concat(isShowSelector ? 'focus' : ''),
+              className: `dtable-ui-geolocation-editor-selector text-truncate ${isShowSelector ? 'focus' : ''}`,
               children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
                 className: "selected-option-show",
                 children: location ? location : (0, _lang.getLocale)('Select_province_city')

package/lib/GeolocationEditor/pc-editor/province-editor.js

@@ -46,7 +46,9 @@ class ProvinceEditor extends _react.Component {
     this.onUpArrow = e => {
       e.preventDefault();
       e.stopPropagation();
-      let highlightIndex = this.state.highlightIndex;
+      let {
+        highlightIndex
+      } = this.state;
       if (highlightIndex > 0) {
         this.setState({
           highlightIndex: highlightIndex - 1
@@ -60,7 +62,9 @@ class ProvinceEditor extends _react.Component {
     this.onDownArrow = e => {
       e.preventDefault();
       e.stopPropagation();
-      let highlightIndex = this.state.highlightIndex;
+      let {
+        highlightIndex
+      } = this.state;
       if (highlightIndex < this.filteredProvince.length - 1) {
         this.setState({
           highlightIndex: highlightIndex + 1
@@ -120,12 +124,13 @@ class ProvinceEditor extends _react.Component {
       }, 300);
     };
     this.createProvinceList = () => {
-      const _this$state = this.state,
-        value = _this$state.value,
-        highlightIndex = _this$state.highlightIndex;
+      const {
+        value,
+        highlightIndex
+      } = this.state;
       let provinceList = this.filteredProvince.map((item, index) => {
         return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-          className: "geolocation-region-editor-province ".concat(highlightIndex === index ? 'geolocation-region-editor-province-highlight' : ''),
+          className: `geolocation-region-editor-province ${highlightIndex === index ? 'geolocation-region-editor-province-highlight' : ''}`,
           title: item.name,
           "aria-label": item.name,
           onClick: () => this.onClick(item.name),
@@ -135,7 +140,7 @@ class ProvinceEditor extends _react.Component {
             className: "province-name",
             children: item.name
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-            className: "icon ".concat(value === item.name ? 'province-selected-icon dtable-font dtable-icon-check-mark' : '')
+            className: `icon ${value === item.name ? 'province-selected-icon dtable-font dtable-icon-check-mark' : ''}`
           })]
         }, item.alphabetic + index);
       });
@@ -178,7 +183,9 @@ class ProvinceEditor extends _react.Component {
     }
   }
   render() {
-    const isLoadingData = this.state.isLoadingData;
+    const {
+      isLoadingData
+    } = this.state;
     return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "dtable-ui-geolocation-province-editor",
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {

package/lib/GeolocationEditor/pc-editor/selector-header-item.js

@@ -10,11 +10,12 @@ var _lang = require("../../lang");
 var _jsxRuntime = require("react/jsx-runtime");
 class SelectorHeaderItem extends _react.default.Component {
   render() {
-    const _this$props = this.props,
-      type = _this$props.type,
-      clickHandler = _this$props.clickHandler,
-      selectedType = _this$props.selectedType,
-      selectedItem = _this$props.selectedItem;
+    const {
+      type,
+      clickHandler,
+      selectedType,
+      selectedItem
+    } = this.props;
     return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: 'dtable-ui-geolocation-selector-header-item ' + (selectedType === type ? 'selected-dtable-ui-geolocation-selector-header-item' : ''),
       onClick: () => {

package/lib/GeolocationEditor/pc-editor/selector-list.js

@@ -9,12 +9,13 @@ var _react = _interopRequireDefault(require("react"));
 var _jsxRuntime = require("react/jsx-runtime");
 class SelectorList extends _react.default.Component {
   render() {
-    const _this$props = this.props,
-      clickHandler = _this$props.clickHandler,
-      type = _this$props.type,
-      selectedItem = _this$props.selectedItem,
-      parent = _this$props.parent,
-      doubleClickHandler = _this$props.doubleClickHandler;
+    const {
+      clickHandler,
+      type,
+      selectedItem,
+      parent,
+      doubleClickHandler
+    } = this.props;
     return /*#__PURE__*/(0, _jsxRuntime.jsx)("ul", {
       className: "dtable-ui-geolocation-selector-list",
       children: parent.children.map((item, index) => {
@@ -24,7 +25,7 @@ class SelectorList extends _react.default.Component {
           onDoubleClick: () => {
             doubleClickHandler && doubleClickHandler(item);
           },
-          className: "dtable-ui-geolocation-selector-list-item ".concat(type === 'province' ? 'province-item' : '', " ").concat(isSelected ? 'selected-list-item' : ''),
+          className: `dtable-ui-geolocation-selector-list-item ${type === 'province' ? 'province-item' : ''} ${isSelected ? 'selected-list-item' : ''}`,
           children: item.name
         }, type + '-item-' + index);
       })