sea-chart 2.0.0 → 2.0.1

package/dist/components/cell-factory/SimpleCellFormatter.js

@@ -27,7 +27,7 @@ class SimpleCellFormatter extends _react.default.Component {
     if (typeof value === 'object') {
       return null;
     }
-    const gridCellClassName = this.props.type ? "grid-cell-type-".concat(this.props.type) : 'grid-cell-type-default';
+    const gridCellClassName = this.props.type ? `grid-cell-type-${this.props.type}` : 'grid-cell-type-default';
     let formattedValue = this.getFormattedValue(value);
     return /*#__PURE__*/_react.default.createElement("div", {
       className: gridCellClassName,

package/dist/components/cell-factory/link-content.js

@@ -30,7 +30,7 @@ class LinkContent extends _react.Component {
         isCellSelected: false,
         readOnly: true
       };
-      const className = "link formatter-item ".concat(type === _dtableUtils.CellType.SINGLE_SELECT ? 'mr-1' : '');
+      const className = `link formatter-item ${type === _dtableUtils.CellType.SINGLE_SELECT ? 'mr-1' : ''}`;
       return shownLinks.map(link => {
         if (!link) return null;
         const {
@@ -44,14 +44,14 @@ class LinkContent extends _react.Component {
         if (!Array.isArray(display_value)) {
           formatterProps['value'] = display_value;
           return /*#__PURE__*/_react.default.createElement("div", {
-            key: "link-record-item-".concat(row_id),
+            key: `link-record-item-${row_id}`,
             className: className
           }, this.createColumnFormatter(Formatter, formatterProps));
         }
         return display_value.map((item, index) => {
           formatterProps['value'] = item;
           return /*#__PURE__*/_react.default.createElement("div", {
-            key: "link-record-item-".concat(row_id, "-").concat(index),
+            key: `link-record-item-${row_id}-${index}`,
             className: className
           }, this.createColumnFormatter(Formatter, formatterProps));
         });
@@ -95,7 +95,7 @@ class LinkContent extends _react.Component {
           departments
         });
         return /*#__PURE__*/_react.default.createElement("div", {
-          key: "link-item-".concat(index),
+          key: `link-item-${index}`,
           className: "link"
         }, /*#__PURE__*/_react.default.createElement("span", {
           className: "link-name pr-1",

package/dist/components/color-picker/index.js

@@ -38,7 +38,7 @@ class ColorPicker extends _react.default.PureComponent {
     }, /*#__PURE__*/_react.default.createElement("div", {
       className: "picker-control"
     }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "color-control ".concat(isWhiteColor ? 'white-color' : ''),
+      className: `color-control ${isWhiteColor ? 'white-color' : ''}`,
       onClick: this.onPickColorToggle,
       style: {
         background: activeColor

package/dist/components/color-popover/color-rules/color-rule.js

@@ -116,7 +116,7 @@ class ColorRule extends _react.Component {
       filter_conjunction,
       filters
     } = rule;
-    const target = "row-color-rule-".concat(ruleIndex);
+    const target = `row-color-rule-${ruleIndex}`;
     const selectedColorConfig = this.props.getColorConfigByColor(color);
     const ruleTitle = ruleName || _intl.default.get('Define_rule');
     const canAddFilter = filters.length < 8;

package/dist/components/color-popover/color-rules/index.js

@@ -67,7 +67,7 @@ class ColorRules extends _react.Component {
     }, rules.map((rule, ruleIndex) => {
       const isEditing = editingRuleIndex === ruleIndex;
       return /*#__PURE__*/_react.default.createElement(_colorRule.default, {
-        key: "statistic-color-rule-".concat(ruleIndex),
+        key: `statistic-color-rule-${ruleIndex}`,
         ruleIndex: ruleIndex,
         rule: rule,
         labelColorConfigs: labelColorConfigs,

package/dist/components/color-popover/color-rules-popover.js

@@ -30,7 +30,7 @@ class ColorRulesPopover extends _react.Component {
         filter_term
       } = filter;
       const name = _colorRules2.DISPLAY_COLOR_RULE_FILTER_TYPE[filter_type];
-      const template = "".concat(_intl.default.get(name), " ").concat(_intl.default.get(filter_predicate));
+      const template = `${_intl.default.get(name)} ${_intl.default.get(filter_predicate)}`;
       if (_colorRules2.EMPTY_PREDICATE.includes(filter_predicate)) {
         return template;
       }
@@ -38,12 +38,12 @@ class ColorRulesPopover extends _react.Component {
         case _colorRules2.COLOR_RULE_FILTER_TYPE_MAP.NUMERIC_VALUE:
           {
             if (filter_term === 0) {
-              return "".concat(template, " 0");
+              return `${template} 0`;
             }
             if (!filter_term) {
               return null;
             }
-            return "".concat(template, " ").concat(filter_term);
+            return `${template} ${filter_term}`;
           }
         default:
           {
@@ -56,10 +56,10 @@ class ColorRulesPopover extends _react.Component {
       let contentText = '';
       filterConjunction = filterConjunction || 'And';
       filters.forEach((filter, index) => {
-        let filterContentText = index === 0 ? '' : " ".concat(filterConjunction === 'And' ? _intl.default.get('And') : _intl.default.get('Or'));
+        let filterContentText = index === 0 ? '' : ` ${filterConjunction === 'And' ? _intl.default.get('And') : _intl.default.get('Or')}`;
         let filterDisplay = this.getFilterDisplay(filter);
         if (filterDisplay) {
-          contentText = contentText + filterContentText + " ".concat(filterDisplay);
+          contentText = contentText + filterContentText + ` ${filterDisplay}`;
         }
       });
       return contentText;
@@ -148,7 +148,7 @@ class ColorRulesPopover extends _react.Component {
       }
       setTimeout(() => {
         if (popoverWrapper) {
-          popoverWrapper.style.top = "".concat(-offsetHeight + offsetTop, "px");
+          popoverWrapper.style.top = `${-offsetHeight + offsetTop}px`;
         }
       }, 300);
     };

package/dist/components/color-popover/color-selector-popover.js

@@ -25,7 +25,7 @@ class ColorSelectorPopover extends _react.Component {
           } = (0, _commonUtils.hexToRgb)(colorOption.color);
           return {
             ...colorOption,
-            border_color: "rgb(".concat(Math.max(r - 20, 0), ", ").concat(Math.max(g - 20, 0), ", ").concat(Math.max(b - 20, 0), ")")
+            border_color: `rgb(${Math.max(r - 20, 0)}, ${Math.max(g - 20, 0)}, ${Math.max(b - 20, 0)})`
           };
         }
         return colorOption;
@@ -55,7 +55,7 @@ class ColorSelectorPopover extends _react.Component {
     }, /*#__PURE__*/_react.default.createElement("div", {
       className: "sea-chart-color-selector-wrapper"
     }, this.colorOptions.map(colorOption => /*#__PURE__*/_react.default.createElement("div", {
-      key: "sea-chart-color-option-".concat(colorOption.color),
+      key: `sea-chart-color-option-${colorOption.color}`,
       className: "sea-chart-color-option",
       onClick: () => this.onSelectColor(colorOption.color),
       style: {

package/dist/components/color-setting/color-group-selector.js

@@ -25,7 +25,7 @@ class ColorGroupSelector extends _react.Component {
               className: "sea-chart-color-block",
               key: index,
               style: {
-                background: "".concat(color)
+                background: `${color}`
               }
             });
           }))

package/dist/components/common-add-tool/index.js

@@ -15,12 +15,12 @@ function CommonAddTool(props) {
     addIconClassName
   } = props;
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: "add-item-btn ".concat(className ? className : ''),
+    className: `add-item-btn ${className ? className : ''}`,
     onClick: e => {
       callBack(e);
     }
   }, /*#__PURE__*/_react.default.createElement("span", {
-    className: "dtable-font dtable-icon-add-table ".concat(addIconClassName || '')
+    className: `dtable-font dtable-icon-add-table ${addIconClassName || ''}`
   }), /*#__PURE__*/_react.default.createElement("span", {
     className: "add-new-option text-truncate",
     title: footerName

package/dist/components/data-process-setter/hide-column-setter.js

@@ -67,7 +67,7 @@ class HideColumnSetter extends _react.default.Component {
     let settingClass = wrapperClass || '';
     settingClass = settingClass && hiddenColumnsLength > 0 ? settingClass + ' active' : settingClass;
     return /*#__PURE__*/_react.default.createElement("div", {
-      className: "setting-item ".concat(settingClass ? '' : 'mb-1')
+      className: `setting-item ${settingClass ? '' : 'mb-1'}`
     }, /*#__PURE__*/_react.default.createElement("div", {
       className: "mr-2 filters-setting-btn",
       onClick: this.onHideColumnToggle

package/dist/components/data-process-setter/sort-setter.js

@@ -53,9 +53,9 @@ class SortSetter extends _react.Component {
     let labelClass = wrapperClass || '';
     labelClass = labelClass && sortsLength > 0 ? labelClass + ' active' : labelClass;
     return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-      className: "setting-item ".concat(labelClass ? '' : 'mb-1')
+      className: `setting-item ${labelClass ? '' : 'mb-1'}`
     }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "mr-2 setting-item-btn filters-setting-btn ".concat(labelClass),
+      className: `mr-2 setting-item-btn filters-setting-btn ${labelClass}`,
       onClick: this.onSortToggle,
       role: "button",
       onKeyDown: this.onKeyDown,

package/dist/components/drill-down-settings/drill-down-fields-popover/index.js

@@ -81,13 +81,13 @@ function DrillDownFieldsPopover(_ref) {
     className: _indexModule.default['text-truncate']
   }, ''), /*#__PURE__*/_react.default.createElement("th", {
     width: "20%",
-    className: "".concat(_indexModule.default['column-checkbox'], " pr-3")
+    className: `${_indexModule.default['column-checkbox']} pr-3`
   }, _intl.default.get('Visible')))), /*#__PURE__*/_react.default.createElement("tbody", null, /*#__PURE__*/_react.default.createElement("tr", {
     className: _indexModule.default['drill-down-fields-row']
   }, /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement("span", {
     className: _indexModule.default['drill-down-fields-select-all']
   }, _intl.default.get('Select_all'))), /*#__PURE__*/_react.default.createElement("td", {
-    className: "".concat(_indexModule.default['column-checkbox'], " pr-3")
+    className: `${_indexModule.default['column-checkbox']} pr-3`
   }, /*#__PURE__*/_react.default.createElement("input", {
     type: "checkbox",
     checked: isAllColumnsVisible,
@@ -102,9 +102,9 @@ function DrillDownFieldsPopover(_ref) {
       className: "pl-5 text-truncate",
       title: column.name
     }, /*#__PURE__*/_react.default.createElement("i", {
-      className: "".concat(_dtableUtils.COLUMNS_ICON_CONFIG[column.type], " mr-2 ").concat(_indexModule.default['drill-down-fields-icon'])
+      className: `${_dtableUtils.COLUMNS_ICON_CONFIG[column.type]} mr-2 ${_indexModule.default['drill-down-fields-icon']}`
     }), /*#__PURE__*/_react.default.createElement("span", null, column.name)), /*#__PURE__*/_react.default.createElement("td", {
-      className: "".concat(_indexModule.default['column-checkbox'], " pr-3")
+      className: `${_indexModule.default['column-checkbox']} pr-3`
     }, /*#__PURE__*/_react.default.createElement("input", {
       disabled: checkedByDefault,
       type: "checkbox",

package/dist/components/icon/index.js

@@ -21,11 +21,11 @@ const Icon = props => {
     className,
     symbol
   } = props;
-  const iconClass = "sea-chart-icon sea-chart-icon-".concat(symbol, " ").concat(className || '');
+  const iconClass = `sea-chart-icon sea-chart-icon-${symbol} ${className || ''}`;
   return /*#__PURE__*/_react.default.createElement("svg", {
     className: iconClass
   }, /*#__PURE__*/_react.default.createElement("use", {
-    xlinkHref: "#".concat(symbol)
+    xlinkHref: `#${symbol}`
   }));
 };
 var _default = exports.default = Icon;

package/dist/components/popover/hide-column-popover/hide-column-popover-widgets/hide-column-item.js

@@ -48,7 +48,7 @@ class HideColumnItem extends _react.default.PureComponent {
       readonly
     } = this.props;
     const placeholder = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("i", {
-      className: "dtable-font ".concat(setting.columnIcon)
+      className: `dtable-font ${setting.columnIcon}`
     }), /*#__PURE__*/_react.default.createElement("span", {
       className: "text-truncate"
     }, setting.columnName));

package/dist/components/popover/hide-column-popover/hide-column-popover.js

@@ -174,7 +174,7 @@ class HideColumnPopover extends _react.default.Component {
       ref: ref => this.popoverRef = ref,
       onClick: this.onPopoverInsideClick
     }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "field-settings ".concat(isEmpty ? 'empty' : '')
+      className: `field-settings ${isEmpty ? 'empty' : ''}`
     }, /*#__PURE__*/_react.default.createElement("div", {
       className: "search-column"
     }, /*#__PURE__*/_react.default.createElement("input", {

package/dist/components/popover/sort-popover/sort-popover.js

@@ -274,7 +274,7 @@ class SortPopover extends _react.Component {
       ref: ref => this.sortPopoverRef = ref,
       onClick: this.onPopoverInsideClick
     }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "sorts-list ".concat(isEmpty ? 'empty-sorts-container' : '')
+      className: `sorts-list ${isEmpty ? 'empty-sorts-container' : ''}`
     }, isEmpty ? /*#__PURE__*/_react.default.createElement("div", {
       className: "empty-sorts-list"
     }, _intl.default.get('No_sorts')) : this.renderSortsList()), !readonly && /*#__PURE__*/_react.default.createElement(_commonAddTool.default, {

package/dist/components/row-card/row-card-header-cell.js

@@ -27,7 +27,7 @@ class RowCardHeaderCell extends _react.default.Component {
       let headerCellWidth = width;
       if (rowCardType === 'link') {
         const tableId = table._id;
-        const draggedCellId = "".concat(tableId, "-").concat(key);
+        const draggedCellId = `${tableId}-${key}`;
         const existedWidth = JSON.parse(localStorage.getItem(draggedCellId));
         if (existedWidth) {
           headerCellWidth = existedWidth;
@@ -55,7 +55,7 @@ class RowCardHeaderCell extends _react.default.Component {
       const {
         _id: tableId
       } = table;
-      const draggedCellId = "".concat(tableId, "-").concat(columnKey);
+      const draggedCellId = `${tableId}-${columnKey}`;
       let width = this.getWidthFromMouseEvent(e);
       this.setState({
         resizing: false

package/dist/components/row-card/row-card-header.js

@@ -116,7 +116,7 @@ class RowCardHeader extends _react.default.Component {
     } = this.state;
     const cardHeaderCells = this.getCardHeaderCells();
     return /*#__PURE__*/_react.default.createElement("div", {
-      className: "row-card-header ".concat(cardHeaderClassName ? cardHeaderClassName : '')
+      className: `row-card-header ${cardHeaderClassName ? cardHeaderClassName : ''}`
     }, /*#__PURE__*/_react.default.createElement("div", {
       className: "row-card-column-names records-column-names",
       ref: ref => this.recordItemRef = ref

package/dist/components/row-card/row-card-item.js

@@ -86,7 +86,7 @@ class RowCardItem extends _react.PureComponent {
           data,
           width
         } = column;
-        const draggedCellId = "".concat(tableId, "-").concat(key);
+        const draggedCellId = `${tableId}-${key}`;
         const existedWidth = JSON.parse(localStorage.getItem(draggedCellId));
         let columnWidth = existedWidth && rowCardType === 'link' ? existedWidth : width;
         if (draggedCell.id === draggedCellId) {
@@ -115,7 +115,7 @@ class RowCardItem extends _react.PureComponent {
           }, /*#__PURE__*/_react.default.createElement("div", {
             className: "formatter-show"
           }, /*#__PURE__*/_react.default.createElement(_linkContent.default, {
-            key: "link-formatter-".concat(row._id, "-").concat(key),
+            key: `link-formatter-${row._id}-${key}`,
             linkedColumn: linkedColumn,
             computedValue: formulaRow[key],
             Empty: EMPTY_LINK

package/dist/components/row-card/row-card.js

@@ -194,7 +194,7 @@ class RowCard extends _react.Component {
       displayRows,
       scrollLeft
     } = this.state;
-    const rowCardListClass = "row-card-list ".concat(cardListClassName ? cardListClassName : '');
+    const rowCardListClass = `row-card-list ${cardListClassName ? cardListClassName : ''}`;
     return /*#__PURE__*/_react.default.createElement("div", {
       className: "row-card-container"
     }, isShowRowCardHeader && /*#__PURE__*/_react.default.createElement(_rowCardHeader.default, {
@@ -233,7 +233,7 @@ class RowCard extends _react.Component {
         columns: renderedColumns
       };
       return /*#__PURE__*/_react.default.createElement(_rowCardItem.default, {
-        key: "row-card-".concat(rowIdx),
+        key: `row-card-${rowIdx}`,
         setItemScrollLeft: this.setItemScrollLeft,
         onRef: this.onRef,
         rowCardType: rowCardType,

package/dist/components/statistic-record-dialog/index.js

@@ -300,7 +300,7 @@ class StatisticRecordDialog extends _react.default.Component {
       if (searchedRows.length === 0) return /*#__PURE__*/_react.default.createElement("div", {
         className: "w-100 h-100"
       }, /*#__PURE__*/_react.default.createElement(_DTableEmptyTip2.default, {
-        src: "".concat(_context.default.getSetting('mediaUrl'), "img/no-items-tip.png"),
+        src: `${_context.default.getSetting('mediaUrl')}img/no-items-tip.png`,
         text: _intl.default.get('No_record')
       }));
       const props = {

package/dist/components/types-dialog/index.js

@@ -45,7 +45,7 @@ const TypesDialog = _ref => {
     const currentCatIndex = selectStatisticIndex < 0 ? 0 : selectStatisticIndex;
     if (currentCatIndex === 0) return;
     if (!seaChartTypeContainerRef.current) return;
-    seaChartTypeContainerRef.current.scrollTop = document.getElementById("chart-type-".concat(currentCatIndex + 1)).offsetTop - 60;
+    seaChartTypeContainerRef.current.scrollTop = document.getElementById(`chart-type-${currentCatIndex + 1}`).offsetTop - 60;
   }, [type]);
   const onToggle = (0, _react.useCallback)(() => {
     propsOnToggle();
@@ -54,7 +54,7 @@ const TypesDialog = _ref => {
     (0, _utils.eventStopPropagation)(event);
     setCurrentCatIndex(index);
     if (!seaChartTypeContainerRef.current) return;
-    seaChartTypeContainerRef.current.scrollTop = document.getElementById("chart-type-".concat(index + 1)).offsetTop - 60;
+    seaChartTypeContainerRef.current.scrollTop = document.getElementById(`chart-type-${index + 1}`).offsetTop - 60;
   }, [seaChartTypeContainerRef]);
   const onTypeChange = (0, _react.useCallback)((event, type, index) => {
     (0, _utils.eventStopPropagation)(event);
@@ -84,7 +84,7 @@ const TypesDialog = _ref => {
       key: index,
       className: "px-4 py-2 sea-chart-chart-cat-nav-item"
     }, /*#__PURE__*/_react.default.createElement("div", {
-      id: "sea-chart-icon-".concat(item.icon, "-container"),
+      id: `sea-chart-icon-${item.icon}-container`,
       className: (0, _classnames.default)('sea-chart-chart-cat-nav-item-container', {
         'sea-chart-icon-highlight': currentCatIndex === index
       }),
@@ -94,7 +94,7 @@ const TypesDialog = _ref => {
       className: "chart-icon w-100 h-100"
     })), /*#__PURE__*/_react.default.createElement(_reactstrap.UncontrolledTooltip, {
       placement: "bottom",
-      target: "sea-chart-icon-".concat(item.icon, "-container"),
+      target: `sea-chart-icon-${item.icon}-container`,
       delay: 0,
       fade: false
     }, _intl.default.get(item.name)));
@@ -103,11 +103,11 @@ const TypesDialog = _ref => {
     ref: seaChartTypeContainerRef
   }, _constants.CHART_TYPES.map((item, index) => {
     return /*#__PURE__*/_react.default.createElement("div", {
-      key: "sea-chart-type-".concat(index),
+      key: `sea-chart-type-${index}`,
       className: "mb-7"
     }, /*#__PURE__*/_react.default.createElement("h3", {
       className: "sea-chart-type-title m-0",
-      id: "chart-type-".concat(index + 1)
+      id: `chart-type-${index + 1}`
     }, _intl.default.get(item.name)), /*#__PURE__*/_react.default.createElement("div", {
       className: "d-flex flex-wrap"
     }, item.children.map(chartType => {
@@ -117,7 +117,7 @@ const TypesDialog = _ref => {
       return /*#__PURE__*/_react.default.createElement("div", {
         key: chartType,
         onClick: event => onTypeChange(event, chartType, index),
-        className: "sea-chart-type-item ".concat(selectedType === chartType ? 'selected' : '')
+        className: `sea-chart-type-item ${selectedType === chartType ? 'selected' : ''}`
       }, /*#__PURE__*/_react.default.createElement("p", {
         className: "sea-chart-type-description"
       }, _intl.default.get(_constants.CHART_TYPE_SHOW[chartType])), /*#__PURE__*/_react.default.createElement("div", {

package/dist/context.js

@@ -121,9 +121,9 @@ class Context {
           server,
           mediaUrl
         } = this.settings;
-        return "".concat(server).concat(mediaUrl, "dtable-statistic/img/").concat(name, "?v=0.0.1");
+        return `${server}${mediaUrl}dtable-statistic/img/${name}?v=0.0.1`;
       }
-      return "".concat(_constants.DEFAULT_MEDIAURL, "dtable-statistic/img/").concat(name, "?v=0.0.1");
+      return `${_constants.DEFAULT_MEDIAURL}dtable-statistic/img/${name}?v=0.0.1`;
     };
     this.api = null;
     this.settings = {};

package/dist/services/map-json.js

@@ -51,7 +51,7 @@ function getMapJsonQueryUrl(mapLevel, mapLocation) {
         if (!provinceNameEn) {
           return null;
         }
-        return "region-mapjson/".concat(provinceNameEn, "/").concat(provinceNameEn);
+        return `region-mapjson/${provinceNameEn}/${provinceNameEn}`;
       }
     case _constants.MAP_LEVEL.CITY:
       {
@@ -64,9 +64,9 @@ function getMapJsonQueryUrl(mapLevel, mapLocation) {
 
         // e.g. 北京市/北京市
         if (provinceNameEn === cityNameEn) {
-          return "region-mapjson/".concat(provinceNameEn, "/").concat(provinceNameEn);
+          return `region-mapjson/${provinceNameEn}/${provinceNameEn}`;
         }
-        return "region-mapjson/".concat(provinceNameEn, "/").concat(provinceNameEn, "_").concat(cityNameEn);
+        return `region-mapjson/${provinceNameEn}/${provinceNameEn}_${cityNameEn}`;
       }
     default:
       {
@@ -94,7 +94,7 @@ async function fetchMapJson(mapLevel, mapLocation, mediaUrl) {
   }
   let mapJson;
   try {
-    const res = await fetch("".concat(mediaUrl, "dtable-statistic/geolocation/").concat(url, ".json"));
+    const res = await fetch(`${mediaUrl}dtable-statistic/geolocation/${url}.json`);
     mapJson = await res.json();
   } catch (error) {
     console.error('on fetchMapJson: fetch error', error);

package/dist/settings/basic-number-card/style-settings.js

@@ -71,7 +71,7 @@ function StyleSettings(_ref) {
     } else if (key === 'font_size') {
       key = 'card_label_font_size';
     } else {
-      key = "label_".concat(key);
+      key = `label_${key}`;
     }
     onChange({
       [key]: value

package/dist/settings/map-settings/map-style-settings.js

@@ -74,7 +74,7 @@ function MapStyleSetting(_ref) {
     className: "ml-0 row gutters-xs"
   }, _geolocation.LABEL_COLORS.map((item, index) => {
     return /*#__PURE__*/_react.default.createElement("div", {
-      key: "map-bubble-color-".concat(index),
+      key: `map-bubble-color-${index}`,
       className: "col-auto pl-0"
     }, /*#__PURE__*/_react.default.createElement("label", {
       className: "colorinput"

package/dist/settings/stacks-settings/index.js

@@ -234,7 +234,7 @@ class StacksSettings extends _react.Component {
         chart: chart,
         stack: yAxis,
         yAxisesIndex: index,
-        label: "".concat(_intl.default.get('Stack')).concat(index + 1),
+        label: `${_intl.default.get('Stack')}${index + 1}`,
         numericColumnsOptions: this.props.numericColumnsOptions,
         summaryMethodsOptions: this.summaryMethodsOptions,
         deleteStack: () => this.deleteStack(index),

package/dist/settings/style-settings.js

@@ -70,7 +70,7 @@ const StyleSettings = _ref => {
       type
     } = config;
     return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_titleSettings.default, {
-      key: "title-setting-".concat(chart.id),
+      key: `title-setting-${chart.id}`,
       title: style_config && style_config.title,
       modifyTitle: modifyTitle,
       type: type

package/dist/settings/table-settings/data-settings.js

@@ -423,7 +423,7 @@ const DataSettings = _ref => {
     return summary_columns.map((item, index) => {
       const currentUsedSummaryColumnKeys = usedSummaryColumnKeys.filter(columnKey => item.column_key !== columnKey);
       return /*#__PURE__*/_react.default.createElement(_numericSummaryItem.default, {
-        key: "number-column-".concat(index),
+        key: `number-column-${index}`,
         chart: chart,
         numericColumnOptions: numericColumnOptions.filter(item => !currentUsedSummaryColumnKeys.includes(item.value.key)),
         index: index + 1,

package/dist/settings/trend-settings/style-setting.js

@@ -59,13 +59,13 @@ function StyleSettings(_ref) {
     font_weight: 400
   };
   const handleNumChange = (key, value) => {
-    key = "num_".concat(key);
+    key = `num_${key}`;
     onChange({
       [key]: value
     });
   };
   const handleLabelChange = (key, value) => {
-    key = "label_".concat(key);
+    key = `label_${key}`;
     if (key === 'label_font_size') {
       key = 'card_label_font_size';
     }

package/dist/settings/widgets/date-summary-item.js

@@ -92,14 +92,14 @@ class DateSummaryItem extends _react.Component {
       className: "title-item title-left"
     }, /*#__PURE__*/_react.default.createElement("i", {
       onClick: this.onToggleExpand,
-      className: "icon dtable-font ".concat(isExpand ? 'dtable-icon-drop-down' : 'dtable-icon-right-slide')
+      className: `icon dtable-font ${isExpand ? 'dtable-icon-drop-down' : 'dtable-icon-right-slide'}`
     }), /*#__PURE__*/_react.default.createElement("label", null, _intl.default.get('Summary_field') + (1 + index))), /*#__PURE__*/_react.default.createElement("span", {
       className: "title-item title-right"
     }, index !== 0 && /*#__PURE__*/_react.default.createElement("i", {
       className: "dtable-font dtable-icon-fork-number close-icon",
       onClick: () => this.props.onDelete(index)
     }))), /*#__PURE__*/_react.default.createElement("div", {
-      className: "".concat(isExpand ? 'expanded-numeric-summary-content' : 'collapsed-numeric-summary-content')
+      className: `${isExpand ? 'expanded-numeric-summary-content' : 'collapsed-numeric-summary-content'}`
     }, /*#__PURE__*/_react.default.createElement(_reactstrap.FormGroup, {
       className: "sea-chart-parameter-item numeric-column"
     }, /*#__PURE__*/_react.default.createElement(_DTableSelect2.default, {

package/dist/settings/widgets/numeric-summary-item.js

@@ -126,14 +126,14 @@ class NumericSummaryItem extends _react.Component {
       className: "numeric-summary-item d-flex align-items-center justify-content-between w-100"
     }, /*#__PURE__*/_react.default.createElement("span", null, /*#__PURE__*/_react.default.createElement("i", {
       onClick: this.onToggleExpand,
-      className: "numeric-summary-item-icon dtable-font mr-2 ".concat(isExpand ? 'dtable-icon-drop-down' : 'dtable-icon-right-slide')
+      className: `numeric-summary-item-icon dtable-font mr-2 ${isExpand ? 'dtable-icon-drop-down' : 'dtable-icon-right-slide'}`
     }), /*#__PURE__*/_react.default.createElement("span", null, _intl.default.get('Summary_field') + ' ' + (1 + index))), !isFirst && /*#__PURE__*/_react.default.createElement("div", {
       className: "delete-numeric-summary-item-content close d-flex align-items-center justify-content-center",
       onClick: this.handleNumericSummaryItemDelete
     }, /*#__PURE__*/_react.default.createElement("i", {
       className: "dtable-font dtable-icon-fork-number delete-icon"
     }))), /*#__PURE__*/_react.default.createElement("div", {
-      className: "pl-4 ".concat(isExpand ? 'expanded-numeric-summary-content' : 'collapsed-numeric-summary-content d-none')
+      className: `pl-4 ${isExpand ? 'expanded-numeric-summary-content' : 'collapsed-numeric-summary-content d-none'}`
     }, /*#__PURE__*/_react.default.createElement(_reactstrap.FormGroup, {
       className: "sea-chart-parameter-item numeric-column"
     }, /*#__PURE__*/_react.default.createElement(_DTableSelect2.default, {

package/dist/settings/widgets/summary-settings.js

@@ -235,7 +235,7 @@ class SummarySettings extends _react.Component {
       }
       return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_numericSummaryItem.default, {
         chart: chart,
-        key: "number-column-".concat(0),
+        key: `number-column-${0}`,
         numericColumnOptions: this.numericColumnsOptions,
         onColumnOptionChange: this.onChangeNumericSummaryColumn,
         onSummaryMethodChange: this.onChangeNumericSummaryMethod,
@@ -377,7 +377,7 @@ class SummarySettings extends _react.Component {
       return y_axis_left_group_by_numeric_columns.map((item, index) => {
         return /*#__PURE__*/_react.default.createElement(_numericSummaryItem.default, {
           chart: chart,
-          key: "number-column-".concat(index),
+          key: `number-column-${index}`,
           numericColumnOptions: this.numericColumnsOptions,
           onColumnOptionChange: this.onChangeNumericSummaryColumn,
           onSummaryMethodChange: this.onChangeNumericSummaryMethod,

package/dist/settings/widgets/switch/index.js

@@ -20,7 +20,7 @@ const Switch = _ref => {
   return /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _classnames.default)('sea-chart-parameter-container', className)
   }, /*#__PURE__*/_react.default.createElement(_DTableSwitch2.default, {
-    key: "custom-switch-checkbox-".concat(checked),
+    key: `custom-switch-checkbox-${checked}`,
     checked: checked,
     disabled: disabled,
     switchClassName: "sea-chart-toggle-parameter",

package/dist/settings/widgets/y-axis-group-settings.js

@@ -348,7 +348,7 @@ class YAxisGroupSettings extends _react.Component {
       if (!summary_columns || !Array.isArray(summary_columns)) return null;
       return summary_columns.map((item, index) => {
         return /*#__PURE__*/_react.default.createElement(_numericSummaryItem.default, {
-          key: "number-column-".concat(index),
+          key: `number-column-${index}`,
           index: index + 1,
           value: item,
           chart: chart,