dtable-ui-component 6.0.53 → 6.0.55-beta.1

package/lib/Radio/RadioItem.js

@@ -28,8 +28,8 @@ class RadioItem extends React.Component {
       className,
       children
     } = otherProps;
-    const wrapCls = (0, _classnames.default)("".concat(prefixCls, "-item"), className, {
-      ["".concat(prefixCls, "-item-disabled")]: disabled === true
+    const wrapCls = (0, _classnames.default)(`${prefixCls}-item`, className, {
+      [`${prefixCls}-item-disabled`]: disabled === true
     });
 
     // Note: if not omit `onChange`, it will trigger twice on check listitem

package/lib/RateFormatter/index.js

@@ -25,12 +25,12 @@ class RateFormatter extends _react.default.Component {
       const validValue = Math.min(rate_max_number, value);
       let rateList = [];
       for (let i = 0; i < validValue; i++) {
-        rateList.push( /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
-          className: "dtable-font ".concat(rate_style_type),
+        rateList.push(/*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+          className: `dtable-font ${rate_style_type}`,
           style: {
             color: rate_style_color || '#e5e5e5'
           }
-        }, "dtable-ui-component-rate-".concat(i)));
+        }, `dtable-ui-component-rate-${i}`));
       }
       return rateList;
     };

package/lib/RoleStatusEditor/index.js

@@ -61,7 +61,7 @@ const RoleStatusEditor = _ref => {
           children: [label, value === currentOption.value && /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
             className: "dtable-font dtable-icon-check-mark ml-2"
           })]
-        }, "item-".concat(value));
+        }, `item-${value}`);
       })
     })]
   });

package/lib/RowExpandDialog/body/index.js

@@ -203,7 +203,7 @@ class Body extends _react.default.Component {
         row
       };
       const CustomChildren = children;
-      if ( /*#__PURE__*/_react.default.isValidElement(CustomChildren)) return /*#__PURE__*/_react.default.cloneElement(CustomChildren, props);
+      if (/*#__PURE__*/_react.default.isValidElement(CustomChildren)) return /*#__PURE__*/_react.default.cloneElement(CustomChildren, props);
       if ((0, _utils.isFunction)(CustomChildren)) return /*#__PURE__*/(0, _jsxRuntime.jsx)(CustomChildren, {
         ...props
       });

package/lib/RowExpandDialog/column-content/index.js

@@ -1,5 +1,6 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -7,7 +8,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _reactstrap = require("reactstrap");
-var _dtableUtils = require("dtable-utils");
+var _DTableColumnIcon = _interopRequireDefault(require("../../DTableColumnIcon"));
 require("./index.css");
 var _jsxRuntime = require("react/jsx-runtime");
 const ColumnContent = _ref => {
@@ -20,6 +21,7 @@ const ColumnContent = _ref => {
     name,
     type,
     key,
+    data,
     description
   } = column;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactstrap.Row, {
@@ -29,9 +31,10 @@ const ColumnContent = _ref => {
       className: "dtable-ui-row-expand-column-content-info d-flex",
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
         className: "dtable-ui-header-icon",
-        id: "header-icon-".concat(key),
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
-          className: _dtableUtils.COLUMNS_ICON_CONFIG[type]
+        id: `header-icon-${key}`,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_DTableColumnIcon.default, {
+          columnType: type,
+          columnDisplayType: data === null || data === void 0 ? void 0 : data.display_type
         })
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
         className: "dtable-ui-row-expand-column-name",

package/lib/RowExpandDialog/header/index.js

@@ -28,7 +28,7 @@ const Header = _ref => {
       row
     };
     const CustomTitle = title;
-    if ( /*#__PURE__*/_react.default.isValidElement(CustomTitle)) return /*#__PURE__*/_react.default.cloneElement(CustomTitle, props);
+    if (/*#__PURE__*/_react.default.isValidElement(CustomTitle)) return /*#__PURE__*/_react.default.cloneElement(CustomTitle, props);
     if ((0, _utils.isFunction)(CustomTitle)) return /*#__PURE__*/(0, _jsxRuntime.jsx)(CustomTitle, {
       ...props
     });

package/lib/RowExpandDialog/index.js

@@ -167,9 +167,9 @@ const RowExpandDialog = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
         marginLeft,
         height
       } = style;
-      dom.style.width = "".concat(width, "px");
-      dom.style.maxWidth = "".concat(maxWidth, "px");
-      dom.style.marginLeft = "".concat(marginLeft, "px");
+      dom.style.width = `${width}px`;
+      dom.style.maxWidth = `${maxWidth}px`;
+      dom.style.marginLeft = `${marginLeft}px`;
       dom.style.height = height;
       dom.style.marginRight = 'unset';
       dom.style.marginTop = '28px';

package/lib/RowExpandEditor/digital-sign-editor/mb-editor/index.js

@@ -81,7 +81,7 @@ class RowExpandMBDigitalSignEditor extends _react.default.Component {
           onClick: this.toggleEditor,
           deleteImage: this.deleteImage,
           disableImageTooltip: true
-        }, "sing-image-".concat(key, "-").concat(index));
+        }, `sing-image-${key}-${index}`);
       });
     };
     this.state = {

package/lib/RowExpandEditor/digital-sign-editor/pc-editor/index.js

@@ -120,7 +120,7 @@ class RowExpandPCDigitalSignEditor extends _react.default.Component {
           onClick: this.setLargeImageIndex,
           deleteImage: this.deleteImage,
           disableImageTooltip: true
-        }, "sing-image-".concat(key, "-").concat(index));
+        }, `sing-image-${key}-${index}`);
       });
     };
     this.state = {

package/lib/RowExpandEditor/email-editor/mb-editor/index.js

@@ -36,7 +36,7 @@ class RowExpandMBEmailEditor extends _react.default.Component {
         value
       } = this.state;
       let newValue = value.trim();
-      window.location.href = "mailto:".concat(newValue);
+      window.location.href = `mailto:${newValue}`;
     };
     const {
       row,

package/lib/RowExpandEditor/email-editor/pc-editor/index.js

@@ -66,7 +66,7 @@ class RowExpandPCEmailEditor extends _react.default.Component {
         value
       } = this.state;
       let newValue = value.trim();
-      window.location.href = "mailto:".concat(newValue);
+      window.location.href = `mailto:${newValue}`;
     };
     const {
       row,

package/lib/RowExpandEditor/image-editor/mb-editor/index.js

@@ -55,7 +55,7 @@ class RowExpandMBImageEditor extends _react.default.Component {
           config: config,
           onClick: this.toggleEditor,
           deleteImage: this.deleteImage
-        }, "image-".concat(index));
+        }, `image-${index}`);
       });
     };
     const {

package/lib/RowExpandEditor/image-editor/pc-editor/index.js

@@ -95,7 +95,7 @@ class RowExpandPCImageEditor extends _react.default.Component {
           onClick: this.setLargeImageIndex,
           deleteImage: this.deleteImage,
           config: config
-        }, "image-".concat(index));
+        }, `image-${index}`);
       });
     };
     this.state = {

package/lib/RowExpandEditor/multiple-select-editor/mb-editor/index.js

@@ -90,7 +90,7 @@ class RowExpandMBMultipleSelectEditor extends _react.default.Component {
             onRemove: this.removeOption.bind(this, {
               [this.key]: optionId
             })
-          }, "deleted-".concat(index));
+          }, `deleted-${index}`);
         }));
       }
       if (displayOptions.length === 0) return /*#__PURE__*/(0, _jsxRuntime.jsx)(_addBtn.default, {

package/lib/RowExpandEditor/multiple-select-editor/pc-editor/index.js

@@ -146,7 +146,7 @@ class RowExpandPCMultipleSelectEditor extends _react.default.Component {
               })
             })
           })]
-        }, "deleted-multiple-select-".concat(index));
+        }, `deleted-multiple-select-${index}`);
       }));
     };
     this.renderOptions = () => {
@@ -163,19 +163,19 @@ class RowExpandPCMultipleSelectEditor extends _react.default.Component {
         ref: ref => this.multipleSelectOptionsRef = ref,
         className: (0, _classnames.default)('dtable-ui dtable-ui-row-expand-select-editor custom-select', {
           'focus': isEditorFocus,
-          ["".concat(classNamePrefix, "-select-editor")]: classNamePrefix
+          [`${classNamePrefix}-select-editor`]: classNamePrefix
         }),
         children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
           className: (0, _classnames.default)('dtable-ui-row-expand-select-editor-inner', {
-            ["".concat(classNamePrefix, "-select-editor-inner")]: classNamePrefix
+            [`${classNamePrefix}-select-editor-inner`]: classNamePrefix
           }),
           children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
             className: (0, _classnames.default)('', {
-              ["".concat(classNamePrefix, "-select-editor-inner-container")]: classNamePrefix
+              [`${classNamePrefix}-select-editor-inner-container`]: classNamePrefix
             }),
             children: [options.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
               className: (0, _classnames.default)('dtable-ui-row-expand-select-options', {
-                ["".concat(classNamePrefix, "-select-editor-options")]: classNamePrefix
+                [`${classNamePrefix}-select-editor-options`]: classNamePrefix
               }),
               children: options
             }), options.length === 0 && placeholder && /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {

package/lib/RowExpandEditor/rate-editor/mb-editor.js

@@ -49,7 +49,7 @@ class RowExpandMBRateEditor extends _react.default.Component {
             'rate-item-active': value >= rateItemIndex
           }),
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-            className: "dtable-font ".concat(rateShowType)
+            className: `dtable-font ${rateShowType}`
           })
         }, i);
         rateList.push(rateItem);

package/lib/RowExpandEditor/rate-editor/pc-editor.js

@@ -93,7 +93,7 @@ class RowExpandPCRateEditor extends _react.default.Component {
           style: style,
           className: value >= rateItemIndex ? 'rate-item-active' : '',
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-            className: "dtable-font ".concat(rateShowType)
+            className: `dtable-font ${rateShowType}`
           })
         }, i);
         rateList.push(rateItem);
@@ -142,7 +142,7 @@ class RowExpandPCRateEditor extends _react.default.Component {
       style: style,
       onKeyDown: this.onKeyDown,
       onFocus: this.props.updateTabIndex.bind(this, this.props.columnIndex),
-      "aria-label": "".concat(this.state.value, ", ").concat((0, _lang.getLocale)('Press_the_number_keys_to_enter_the_corresponding_value')),
+      "aria-label": `${this.state.value}, ${(0, _lang.getLocale)('Press_the_number_keys_to_enter_the_corresponding_value')}`,
       className: (0, _classnames.default)('form-control dtable-ui dtable-ui-row-expand-rate-editor', {
         'disabled': !this.canEdit
       }),

package/lib/RowExpandEditor/single-select-editor/pc-editor/index.js

@@ -114,15 +114,15 @@ class RowExpandPCSingleSelectEditor extends _react.default.Component {
         ref: ref => this.selectRef = ref,
         className: (0, _classnames.default)('dtable-ui dtable-ui-row-expand-select-editor custom-select', {
           'focus': isEditorFocus,
-          ["".concat(classNamePrefix, "-select-editor")]: classNamePrefix
+          [`${classNamePrefix}-select-editor`]: classNamePrefix
         }),
         children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
           className: (0, _classnames.default)('dtable-ui-row-expand-select-editor-inner', {
-            ["".concat(classNamePrefix, "-select-editor-inner")]: classNamePrefix
+            [`${classNamePrefix}-select-editor-inner`]: classNamePrefix
           }),
           children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
             className: (0, _classnames.default)('', {
-              ["".concat(classNamePrefix, "-select-editor-inner-container")]: classNamePrefix
+              [`${classNamePrefix}-select-editor-inner-container`]: classNamePrefix
             }),
             children: [value && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
               className: "dtable-ui-select-option",

package/lib/RowExpandEditor/url-editor/mb-editor/index.js

@@ -39,7 +39,7 @@ class RowExpandMBUrlEditor extends _react.default.Component {
       } = this.state;
       let newValue = value.trim();
       if (!(0, _utils.isValidUrl)(newValue)) {
-        newValue = "http://".concat(newValue);
+        newValue = `http://${newValue}`;
       }
       try {
         (0, _utils.openUrlLink)(newValue);

package/lib/RowExpandEditor/url-editor/pc-editor/index.js

@@ -69,7 +69,7 @@ class RowExpandPCUrlEditor extends _react.default.Component {
       } = this.state;
       let newValue = value.trim();
       if (!(0, _utils.isValidUrl)(newValue)) {
-        newValue = "http://".concat(newValue);
+        newValue = `http://${newValue}`;
       }
       try {
         (0, _utils.openUrlLink)(newValue);

package/lib/RowExpandFormatter/email-formatter/index.js

@@ -18,7 +18,7 @@ class RowExpandEmailFormatter extends _react.default.Component {
         value
       } = this.props;
       let newValue = value.trim();
-      window.location.href = "mailto:".concat(newValue);
+      window.location.href = `mailto:${newValue}`;
     };
   }
   render() {

package/lib/RowExpandFormatter/file-formatter/row-expand-file-item-formatter.js

@@ -65,7 +65,7 @@ class RowExpandFileItemFormatter extends _react.Component {
         id: id,
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
           src: fileIconUrl,
-          id: "item-file-".concat(index),
+          id: `item-file-${index}`,
           alt: file.name
         }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
           className: "dtable-ui-file-icons-choice",
@@ -83,7 +83,7 @@ class RowExpandFileItemFormatter extends _react.Component {
             })
           })]
         })]
-      }, "file-".concat(index)), this.state.isDeleteTipOpen && /*#__PURE__*/(0, _jsxRuntime.jsx)(_DeleteTip.default, {
+      }, `file-${index}`), this.state.isDeleteTipOpen && /*#__PURE__*/(0, _jsxRuntime.jsx)(_DeleteTip.default, {
         position: this.position,
         toggle: this.closeDeleteTip,
         handleDelete: this.onDelete,

package/lib/RowExpandFormatter/formula-formatter/index.js

@@ -35,7 +35,7 @@ class RowExpandFormulaFormatter extends _react.default.Component {
     };
     this.onOpenUrlLink = url => {
       if (!(0, _utils2.isValidUrl)(url)) {
-        url = "http://".concat(url);
+        url = `http://${url}`;
       }
       try {
         (0, _utils2.openUrlLink)(url);
@@ -44,7 +44,7 @@ class RowExpandFormulaFormatter extends _react.default.Component {
       }
     };
     this.onOpenEmailLink = email => {
-      window.location.href = "mailto:".concat(email.trim());
+      window.location.href = `mailto:${email.trim()}`;
     };
     this.renderBorder = dom => {
       const {
@@ -79,8 +79,8 @@ class RowExpandFormulaFormatter extends _react.default.Component {
         containerClassName
       } = this.props;
       const customClassName = this.getGridCellClassName(resultType);
-      const className = "dtable-ui cell-formatter-container formula-formatter ".concat(containerClassName, " ").concat(customClassName);
-      return this.renderBorder( /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      const className = `dtable-ui cell-formatter-container formula-formatter ${containerClassName} ${customClassName}`;
+      return this.renderBorder(/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         className: className,
         title: cellValue,
         "aria-label": cellValue,
@@ -125,7 +125,7 @@ class RowExpandFormulaFormatter extends _react.default.Component {
         formulaEmail = cellValue[0];
         formulaEmail = formulaEmail ? formulaEmail.trim() : '';
       }
-      return this.renderBorder( /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      return this.renderBorder(/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         className: "dtable-ui formula-formatter multiple",
         children: cellValue.map((v, index) => {
           formatterProps.value = v;
@@ -144,7 +144,7 @@ class RowExpandFormulaFormatter extends _react.default.Component {
               className: "dtable-font dtable-icon-email formula-email-link",
               onClick: this.onOpenEmailLink.bind(this, formulaEmail)
             }), this.createColumnFormatter(Formatter, formatterProps)]
-          }, "formula-formatter-content-item-".concat(index));
+          }, `formula-formatter-content-item-${index}`);
         })
       }));
     };
@@ -191,7 +191,7 @@ class RowExpandFormulaFormatter extends _react.default.Component {
     };
   }
   createColumnFormatter(Formatter, formatterProps) {
-    if ( /*#__PURE__*/_react.default.isValidElement(Formatter)) {
+    if (/*#__PURE__*/_react.default.isValidElement(Formatter)) {
       return /*#__PURE__*/_react.default.cloneElement(Formatter, {
         ...formatterProps
       });

package/lib/RowExpandFormatter/image-formatter/row-expand-image-item-formatter.js

@@ -72,7 +72,7 @@ class RowExpandImageItemFormatter extends _react.Component {
         onClick: this.onClickImage,
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
           src: url,
-          id: "item-image-".concat(index),
+          id: `item-image-${index}`,
           alt: name
         }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
           className: "dtable-ui-image-icons-choice",
@@ -90,7 +90,7 @@ class RowExpandImageItemFormatter extends _react.Component {
             })
           })]
         })]
-      }, "image-".concat(index)), this.state.isDeleteTipOpen && /*#__PURE__*/(0, _jsxRuntime.jsx)(_DeleteTip.default, {
+      }, `image-${index}`), this.state.isDeleteTipOpen && /*#__PURE__*/(0, _jsxRuntime.jsx)(_DeleteTip.default, {
         position: this.position,
         toggle: this.closeDeleteTip,
         handleDelete: this.onDelete,

package/lib/RowExpandFormatter/index.js

@@ -66,7 +66,7 @@ class RowExpandFormatter extends _react.default.Component {
       const {
         collaborators
       } = this.state;
-      const containerClassName = "dtable-ui-row-expand-".concat(columnType, "-formatter");
+      const containerClassName = `dtable-ui-row-expand-${columnType}-formatter`;
       let cellValue = row[column[valueKey]];
       const Formatter = this.component[columnType];
       if (!Formatter) return null;

package/lib/RowExpandFormatter/link-formatter/collaborator-item-formatter.js

@@ -42,7 +42,7 @@ class CollaboratorItemFormatter extends _react.Component {
       }
       if (!context) return;
       const mediaUrl = context.getSetting('mediaUrl');
-      const defaultAvatarUrl = "".concat(mediaUrl, "/avatars/default.png");
+      const defaultAvatarUrl = `${mediaUrl}/avatars/default.png`;
       if (cellValue === 'anonymous') {
         collaborator = {
           name: 'anonymous',

package/lib/RowExpandFormatter/link-formatter/index.js

@@ -64,7 +64,7 @@ class RowExpandLinkFormatter extends _react.Component {
               return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
                 className: "row-expand-link-item",
                 children: value
-              }, "link-".concat(displayColumnType, "-").concat(index));
+              }, `link-${displayColumnType}-${index}`);
             })
           });
         }
@@ -81,7 +81,7 @@ class RowExpandLinkFormatter extends _react.Component {
                 value: value,
                 format: format,
                 containerClassName: "row-expand-link-item"
-              }, "link-".concat(displayColumnType, "-").concat(index));
+              }, `link-${displayColumnType}-${index}`);
             })
           });
         }
@@ -94,7 +94,7 @@ class RowExpandLinkFormatter extends _react.Component {
               return /*#__PURE__*/(0, _jsxRuntime.jsx)(_CTimeFormatter.default, {
                 value: value,
                 containerClassName: "row-expand-link-item"
-              }, "link-".concat(displayColumnType, "-").concat(index));
+              }, `link-${displayColumnType}-${index}`);
             })
           });
         }
@@ -107,7 +107,7 @@ class RowExpandLinkFormatter extends _react.Component {
               return /*#__PURE__*/(0, _jsxRuntime.jsx)(_MTimeFormatter.default, {
                 value: value,
                 containerClassName: "row-expand-link-item"
-              }, "link-".concat(displayColumnType, "-").concat(index));
+              }, `link-${displayColumnType}-${index}`);
             })
           });
         }
@@ -123,7 +123,7 @@ class RowExpandLinkFormatter extends _react.Component {
                 collaborators: collaborators,
                 context: props.context,
                 renderEmpty: props.renderEmpty
-              }, "link-".concat(displayColumnType, "-").concat(index));
+              }, `link-${displayColumnType}-${index}`);
             })
           });
         }
@@ -146,7 +146,7 @@ class RowExpandLinkFormatter extends _react.Component {
                 children: (0, _valueDisplayUtils.getCellDisplayValue)({
                   [displayColumn.key]: value
                 }, displayColumn, collaborators)
-              }, "link-".concat(displayColumnType, "-").concat(index));
+              }, `link-${displayColumnType}-${index}`);
             })
           });
         }

package/lib/RowExpandFormatter/rate-formatter/index.js

@@ -27,10 +27,10 @@ class RateExpendRateFormatter extends _react.default.Component {
         let style = {
           color: value >= i + 1 ? rate_style_color : '#e5e5e5'
         };
-        rateList.push( /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
-          className: "dtable-font ".concat(rate_style_type),
+        rateList.push(/*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+          className: `dtable-font ${rate_style_type}`,
           style: style
-        }, "dtable-ui-component-rate-".concat(i)));
+        }, `dtable-ui-component-rate-${i}`));
       }
       return rateList;
     };

package/lib/RowExpandFormatter/url-formatter/index.js

@@ -20,7 +20,7 @@ class UrlFormatter extends _react.default.Component {
         value
       } = this.props;
       const url = (0, _editorUtils.getTrimmedString)(value);
-      const validUrl = (0, _utils.isValidUrl)(url) ? url : "http://".concat(url);
+      const validUrl = (0, _utils.isValidUrl)(url) ? url : `http://${url}`;
       try {
         let a = document.createElement('a');
         document.body.appendChild(a);

package/lib/RowExpandView/body/index.js

@@ -66,7 +66,7 @@ class Body extends _react.default.Component {
       }
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowExpandFormatter.default, {
         ...props,
-        className: (0, _classnames.default)('dtable-ui-mobile-row-expand-formatter', "mobile-dtable-row-expand-".concat(column.type, "-formatter"), className),
+        className: (0, _classnames.default)('dtable-ui-mobile-row-expand-formatter', `mobile-dtable-row-expand-${column.type}-formatter`, className),
         column: column,
         row: row,
         component: formatter,

package/lib/SelectOptionGroup/index.js

@@ -148,7 +148,7 @@ class SelectOptionGroup extends _react.Component {
           supportMultipleSelect: this.props.supportMultipleSelect,
           disableHover: this.state.disableHover,
           children: opt.label
-        }, "".concat(key, "-").concat(i));
+        }, `${key}-${i}`);
       });
     };
     this.state = {

package/lib/SelectedDepartments/index.js

@@ -36,7 +36,7 @@ function SelectedDepartments(_ref) {
           "aria-label": name,
           children: name
         })
-      }, "department-".concat(index));
+      }, `department-${index}`);
     }
     const department = idDepartmentMap[content];
     if (department) {
@@ -65,7 +65,7 @@ function SelectedDepartments(_ref) {
             })
           })
         })]
-      }, "department-".concat(index));
+      }, `department-${index}`);
     }
     return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "department empty-department mr-1",
@@ -87,7 +87,7 @@ function SelectedDepartments(_ref) {
           })
         })
       })]
-    }, "department-".concat(index));
+    }, `department-${index}`);
   }) : null;
   return dom;
 }

package/lib/SimpleLongTextFormatter/index.js

@@ -31,8 +31,8 @@ class SimpleLongTextFormatter extends _react.default.Component {
       return /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
         className: "long-text-check-list",
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
-          className: "dtable-font dtable-icon-check-square-solid ".concat(checkList.completed === checkList.total ? 'long-text-check-list-completed' : '')
-        }), "".concat(checkList.completed, "/").concat(checkList.total)]
+          className: `dtable-font dtable-icon-check-square-solid ${checkList.completed === checkList.total ? 'long-text-check-list-completed' : ''}`
+        }), `${checkList.completed}/${checkList.total}`]
       });
     };
     this.renderImages = value => {

package/lib/TabBar/Tab.js

@@ -24,21 +24,21 @@ class Tab extends React.PureComponent {
       } = this.props;
       const iconRes = selected ? selectedIcon : icon;
       const iconDom = /*#__PURE__*/React.isValidElement(iconRes) ? iconRes : /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-        className: "".concat(prefixCls, "-image"),
+        className: `${prefixCls}-image`,
         src: iconRes ? iconRes.uri : iconRes,
         alt: title
       });
       if (badge) {
         return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Badge.default, {
           text: badge,
-          className: "".concat(prefixCls, "-badge tab-badge"),
+          className: `${prefixCls}-badge tab-badge`,
           children: [' ', iconDom, ' ']
         });
       }
       if (dot) {
         return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Badge.default, {
           dot: true,
-          className: "".concat(prefixCls, "-badge tab-dot"),
+          className: `${prefixCls}-badge tab-dot`,
           children: iconDom
         });
       }
@@ -63,15 +63,15 @@ class Tab extends React.PureComponent {
     return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       ...this.props.dataAttrs,
       onClick: this.onClick,
-      className: "".concat(prefixCls),
+      className: `${prefixCls}`,
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: "".concat(prefixCls, "-icon"),
+        className: `${prefixCls}-icon`,
         style: {
           color: iconColor
         },
         children: this.renderIcon()
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
-        className: "".concat(prefixCls, "-title"),
+        className: `${prefixCls}-title`,
         style: {
           color: selected ? tintColor : unselectedTintColor
         },

package/lib/TabBar/index.js

@@ -56,7 +56,7 @@ class AntTabBar extends React.Component {
       const tabsData = this.getTabs();
       const content = Array.isArray(tabsData) ? tabsData.map((cProps, index) => {
         return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tab.default, {
-          prefixCls: "".concat(this.props.prefixCls, "-tab"),
+          prefixCls: `${this.props.prefixCls}-tab`,
           badge: cProps.badge,
           dot: cProps.dot,
           selected: cProps.selected,
@@ -69,9 +69,9 @@ class AntTabBar extends React.Component {
           onClick: () => cProps.onPress && cProps.onPress()
         }, index);
       }) : null;
-      let cls = "".concat(prefixCls, "-bar");
+      let cls = `${prefixCls}-bar`;
       if (hidden) {
-        cls += " ".concat(prefixCls, "-bar-hidden-").concat(tabBarPosition);
+        cls += ` ${prefixCls}-bar-hidden-${tabBarPosition}`;
       }
       return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         className: cls,