@douyinfe/semi-ui 2.29.0 → 2.30.0-alpha.0

package/lib/cjs/form/group.js

@@ -117,13 +117,13 @@ class FormInputGroup extends _react.Component {
     });
 
     const groupCls = (0, _classnames.default)({
-      [`${prefix}-field-group`]: true
+      ["".concat(prefix, "-field-group")]: true
     });
     const labelCol = formProps.labelCol;
     const wrapperCol = formProps.wrapperCol;
     const labelAlign = formProps.labelAlign;
     const appendCol = labelCol && wrapperCol;
-    const labelColCls = labelCol ? `${prefix}-col-${labelAlign}` : '';
+    const labelColCls = labelCol ? "".concat(prefix, "-col-").concat(labelAlign) : '';
     const labelContent = this.renderLabel(label, formProps);
 
     const inputGroupContent = /*#__PURE__*/_react.default.createElement(_inputGroup.default, Object.assign({}, rest), inner);
@@ -134,10 +134,10 @@ class FormInputGroup extends _react.Component {
       isInInputGroup: true
     });
 
-    const extraCls = (0, _classnames.default)(`${prefix}-field-extra`, {
-      [`${prefix}-field-extra-string`]: typeof extraText === 'string',
-      [`${prefix}-field-extra-middle`]: extraTextPosition === 'middle',
-      [`${prefix}-field-extra-bottom`]: extraTextPosition === 'bottom'
+    const extraCls = (0, _classnames.default)("".concat(prefix, "-field-extra"), {
+      ["".concat(prefix, "-field-extra-string")]: typeof extraText === 'string',
+      ["".concat(prefix, "-field-extra-middle")]: extraTextPosition === 'middle',
+      ["".concat(prefix, "-field-extra-bottom")]: extraTextPosition === 'bottom'
     });
     const extraContent = extraText ? /*#__PURE__*/_react.default.createElement("div", {
       className: extraCls,

package/lib/cjs/form/hoc/withField.js

@@ -447,18 +447,18 @@ function withField(Component, opts) {
     let mergeExtraPos = extraTextPosition || formProps.extraTextPosition || 'bottom'; // id attribute to improve a11y
 
     const a11yId = id ? id : field;
-    const labelId = `${a11yId}-label`;
-    const helpTextId = `${a11yId}-helpText`;
-    const extraTextId = `${a11yId}-extraText`;
-    const errorMessageId = `${a11yId}-errormessage`;
+    const labelId = "".concat(a11yId, "-label");
+    const helpTextId = "".concat(a11yId, "-helpText");
+    const extraTextId = "".concat(a11yId, "-extraText");
+    const errorMessageId = "".concat(a11yId, "-errormessage");
 
     const FieldComponent = () => {
       // prefer to use validateStatus which pass by user throught props
       let blockStatus = validateStatus ? validateStatus : status;
-      const extraCls = (0, _classnames.default)(`${prefix}-field-extra`, {
-        [`${prefix}-field-extra-string`]: typeof extraText === 'string',
-        [`${prefix}-field-extra-middle`]: mergeExtraPos === 'middle',
-        [`${prefix}-field-extra-bottom`]: mergeExtraPos === 'bottom'
+      const extraCls = (0, _classnames.default)("".concat(prefix, "-field-extra"), {
+        ["".concat(prefix, "-field-extra-string")]: typeof extraText === 'string',
+        ["".concat(prefix, "-field-extra-middle")]: mergeExtraPos === 'middle',
+        ["".concat(prefix, "-field-extra-bottom")]: mergeExtraPos === 'bottom'
       });
       const extraContent = extraText ? /*#__PURE__*/_react.default.createElement("div", {
         className: extraCls,
@@ -483,11 +483,11 @@ function withField(Component, opts) {
       }
 
       if (helpText) {
-        newProps['aria-describedby'] = extraText ? `${helpTextId} ${extraTextId}` : helpTextId;
+        newProps['aria-describedby'] = extraText ? "".concat(helpTextId, " ").concat(extraTextId) : helpTextId;
       }
 
       if (extraText) {
-        newProps['aria-describedby'] = helpText ? `${helpTextId} ${extraTextId}` : extraTextId;
+        newProps['aria-describedby'] = helpText ? "".concat(helpTextId, " ").concat(extraTextId) : extraTextId;
       }
 
       if (status === 'error') {
@@ -496,12 +496,12 @@ function withField(Component, opts) {
       }
 
       const fieldCls = (0, _classnames.default)({
-        [`${prefix}-field`]: true,
-        [`${prefix}-field-${name}`]: Boolean(name),
+        ["".concat(prefix, "-field")]: true,
+        ["".concat(prefix, "-field-").concat(name)]: Boolean(name),
         [fieldClassName]: Boolean(fieldClassName)
       });
       const fieldMaincls = (0, _classnames.default)({
-        [`${prefix}-field-main`]: true
+        ["".concat(prefix, "-field-main")]: true
       });
 
       if (mergeLabelPos === 'inset' && !noLabel) {
@@ -523,8 +523,8 @@ function withField(Component, opts) {
 
       if (pure) {
         let pureCls = (0, _classnames.default)(rest.className, {
-          [`${prefix}-field-pure`]: true,
-          [`${prefix}-field-${name}`]: Boolean(name),
+          ["".concat(prefix, "-field-pure")]: true,
+          ["".concat(prefix, "-field-").concat(name)]: Boolean(name),
           [fieldClassName]: Boolean(fieldClassName)
         });
         newProps.className = pureCls;
@@ -532,7 +532,7 @@ function withField(Component, opts) {
       }
 
       let withCol = mergeLabelCol && mergeWrapperCol;
-      const labelColCls = mergeLabelAlign ? `${prefix}-col-${mergeLabelAlign}` : ''; // get label
+      const labelColCls = mergeLabelAlign ? "".concat(prefix, "-col-").concat(mergeLabelAlign) : ''; // get label
 
       let labelContent = null;
 

package/lib/cjs/form/label.js

@@ -40,12 +40,12 @@ class Label extends _react.PureComponent {
       optional
     } = this.props;
     const labelCls = (0, _classnames.default)(className, {
-      [`${prefixCls}-field-label`]: true,
-      [`${prefixCls}-field-label-left`]: align === 'left',
-      [`${prefixCls}-field-label-right`]: align === 'right',
-      [`${prefixCls}-field-label-required`]: required,
-      [`${prefixCls}-field-label-disabled`]: disabled,
-      [`${prefixCls}-field-label-with-extra`]: extra
+      ["".concat(prefixCls, "-field-label")]: true,
+      ["".concat(prefixCls, "-field-label-left")]: align === 'left',
+      ["".concat(prefixCls, "-field-label-right")]: align === 'right',
+      ["".concat(prefixCls, "-field-label-required")]: required,
+      ["".concat(prefixCls, "-field-label-disabled")]: disabled,
+      ["".concat(prefixCls, "-field-label-with-extra")]: extra
     });
     const labelStyle = style ? style : {};
     width ? labelStyle.width = width : null;
@@ -53,16 +53,16 @@ class Label extends _react.PureComponent {
     const optionalText = /*#__PURE__*/_react.default.createElement(_localeConsumer.default, {
       componentName: "Form"
     }, locale => /*#__PURE__*/_react.default.createElement("span", {
-      className: `${prefixCls}-field-label-optional-text`
+      className: "".concat(prefixCls, "-field-label-optional-text")
     }, locale.optional));
 
     const textContent = /*#__PURE__*/_react.default.createElement("div", {
-      className: `${prefixCls}-field-label-text`,
+      className: "".concat(prefixCls, "-field-label-text"),
       "x-semi-prop": "label"
     }, typeof text !== 'undefined' ? text : children, optional ? optionalText : null);
 
     const contentWithExtra = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, textContent, /*#__PURE__*/_react.default.createElement("div", {
-      className: `${prefixCls}-field-label-extra`
+      className: "".concat(prefixCls, "-field-label-extra")
     }, extra));
 
     return /*#__PURE__*/_react.default.createElement("label", {

package/lib/cjs/form/slot.js

@@ -75,11 +75,11 @@ const FormSlot = props => {
 
   const appendCol = labelCol && wrapperCol;
   const slotCls = (0, _classnames.default)({
-    [`${prefix}-field`]: true,
-    [`${prefix}-slot`]: true
+    ["".concat(prefix, "-field")]: true,
+    ["".concat(prefix, "-slot")]: true
   }, className);
   const labelColCls = (0, _classnames.default)({
-    [`${prefix}-col-${labelAlign}`]: true
+    ["".concat(prefix, "-col-").concat(labelAlign)]: true
   });
 
   switch (true) {
@@ -140,8 +140,8 @@ const FormSlot = props => {
     width: labelWidth
   }, label);
   let mainCls = (0, _classnames.default)({
-    [`${prefix}-field-main`]: true,
-    [`${prefix}-slot-main`]: true
+    ["".concat(prefix, "-field-main")]: true,
+    ["".concat(prefix, "-slot-main")]: true
   });
 
   switch (true) {

package/lib/cjs/grid/col.js

@@ -53,7 +53,7 @@ class Col extends _react.default.Component {
           others = __rest(props, ["prefixCls", "span", "order", "offset", "push", "pull", "className", "children"]);
 
     let sizeClassObj = {};
-    const prefix = `${prefixCls}-col`;
+    const prefix = "".concat(prefixCls, "-col");
     ['xs', 'sm', 'md', 'lg', 'xl', 'xxl'].forEach(size => {
       let sizeProps = {};
 
@@ -65,19 +65,19 @@ class Col extends _react.default.Component {
 
       delete others[size];
       sizeClassObj = Object.assign(Object.assign({}, sizeClassObj), {
-        [`${prefix}-${size}-${sizeProps.span}`]: sizeProps.span !== undefined,
-        [`${prefix}-${size}-order-${sizeProps.order}`]: sizeProps.order || sizeProps.order === 0,
-        [`${prefix}-${size}-offset-${sizeProps.offset}`]: sizeProps.offset || sizeProps.offset === 0,
-        [`${prefix}-${size}-push-${sizeProps.push}`]: sizeProps.push || sizeProps.push === 0,
-        [`${prefix}-${size}-pull-${sizeProps.pull}`]: sizeProps.pull || sizeProps.pull === 0
+        ["".concat(prefix, "-").concat(size, "-").concat(sizeProps.span)]: sizeProps.span !== undefined,
+        ["".concat(prefix, "-").concat(size, "-order-").concat(sizeProps.order)]: sizeProps.order || sizeProps.order === 0,
+        ["".concat(prefix, "-").concat(size, "-offset-").concat(sizeProps.offset)]: sizeProps.offset || sizeProps.offset === 0,
+        ["".concat(prefix, "-").concat(size, "-push-").concat(sizeProps.push)]: sizeProps.push || sizeProps.push === 0,
+        ["".concat(prefix, "-").concat(size, "-pull-").concat(sizeProps.pull)]: sizeProps.pull || sizeProps.pull === 0
       });
     });
     const classes = (0, _classnames.default)(prefix, {
-      [`${prefix}-${span}`]: span !== undefined,
-      [`${prefix}-order-${order}`]: order,
-      [`${prefix}-offset-${offset}`]: offset,
-      [`${prefix}-push-${push}`]: push,
-      [`${prefix}-pull-${pull}`]: pull
+      ["".concat(prefix, "-").concat(span)]: span !== undefined,
+      ["".concat(prefix, "-order-").concat(order)]: order,
+      ["".concat(prefix, "-offset-").concat(offset)]: offset,
+      ["".concat(prefix, "-push-").concat(push)]: push,
+      ["".concat(prefix, "-pull-").concat(pull)]: pull
     }, className, sizeClassObj);
     let {
       style

package/lib/cjs/grid/row.js

@@ -132,12 +132,12 @@ class Row extends _react.default.Component {
           others = __rest(_a, ["prefixCls", "type", "justify", "align", "className", "style", "children"]);
 
     const gutters = this.getGutter();
-    const prefix = `${prefixCls}-row`;
+    const prefix = "".concat(prefixCls, "-row");
     const classes = (0, _classnames.default)({
       [prefix]: type !== 'flex',
-      [`${prefix}-${type}`]: type,
-      [`${prefix}-${type}-${justify}`]: type && justify,
-      [`${prefix}-${type}-${align}`]: type && align
+      ["".concat(prefix, "-").concat(type)]: type,
+      ["".concat(prefix, "-").concat(type, "-").concat(justify)]: type && justify,
+      ["".concat(prefix, "-").concat(type, "-").concat(align)]: type && align
     }, className);
     const rowStyle = Object.assign(Object.assign(Object.assign({}, gutters[0] > 0 ? {
       marginLeft: gutters[0] / -2,

package/lib/cjs/highlight/index.js

@@ -33,7 +33,7 @@ class Highlight extends _react.PureComponent {
       autoEscape
     } = this.props;
     const tagCls = (0, _classnames.default)({
-      [`${prefixCls}-tag`]: true
+      ["".concat(prefixCls, "-tag")]: true
     }, highlightClassName);
     const option = {
       highlightTag: component,

package/lib/cjs/iconButton/index.js

@@ -86,8 +86,8 @@ class IconButton extends _react.PureComponent {
     }
 
     const btnTextCls = (0, _classnames.default)({
-      [`${prefixCls}-content-left`]: iconPosition === 'right',
-      [`${prefixCls}-content-right`]: iconPosition === 'left'
+      ["".concat(prefixCls, "-content-left")]: iconPosition === 'right',
+      ["".concat(prefixCls, "-content-right")]: iconPosition === 'left'
     });
     const xSemiProp = this.props['x-semi-children-alias'] || 'children';
     const children = originChildren != null ? /*#__PURE__*/_react.default.createElement("span", {
@@ -101,9 +101,9 @@ class IconButton extends _react.PureComponent {
       finalChildren = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, children, IconElem);
     }
 
-    const iconBtnCls = (0, _classnames.default)(className, `${prefixCls}-with-icon`, {
-      [`${prefixCls}-with-icon-only`]: children == null || children === '',
-      [`${prefixCls}-loading`]: loading
+    const iconBtnCls = (0, _classnames.default)(className, "".concat(prefixCls, "-with-icon"), {
+      ["".concat(prefixCls, "-with-icon-only")]: children == null || children === '',
+      ["".concat(prefixCls, "-loading")]: loading
     });
     return /*#__PURE__*/_react.default.createElement(_Button.default, Object.assign({}, otherProps, {
       className: iconBtnCls,

package/lib/cjs/image/image.js

@@ -88,7 +88,7 @@ class Image extends _baseComponent.default {
     };
 
     this.renderDefaultError = () => {
-      const prefixClsName = `${prefixCls}-status`;
+      const prefixClsName = "".concat(prefixCls, "-status");
       return /*#__PURE__*/_react.default.createElement("div", {
         className: prefixClsName
       }, /*#__PURE__*/_react.default.createElement(_semiIcons.IconUploadError, {
@@ -97,7 +97,7 @@ class Image extends _baseComponent.default {
     };
 
     this.renderLoad = () => {
-      const prefixClsName = `${prefixCls}-status`;
+      const prefixClsName = "".concat(prefixCls, "-status");
       const {
         placeholder
       } = this.props;
@@ -110,7 +110,7 @@ class Image extends _baseComponent.default {
       const {
         fallback
       } = this.props;
-      const prefixClsName = `${prefixCls}-status`;
+      const prefixClsName = "".concat(prefixCls, "-status");
       const fallbackNode = typeof fallback === "string" ? /*#__PURE__*/_react.default.createElement("img", {
         style: {
           width: "100%",
@@ -129,7 +129,7 @@ class Image extends _baseComponent.default {
         loadStatus
       } = this.state;
       return /*#__PURE__*/_react.default.createElement("div", {
-        className: `${prefixCls}-overlay`
+        className: "".concat(prefixCls, "-overlay")
       }, loadStatus === "error" && this.renderError(), loadStatus === "loading" && this.renderLoad());
     };
 
@@ -138,13 +138,13 @@ class Image extends _baseComponent.default {
     }, locale => locale[key]);
 
     this.renderMask = () => /*#__PURE__*/_react.default.createElement("div", {
-      className: `${prefixCls}-mask`
+      className: "".concat(prefixCls, "-mask")
     }, /*#__PURE__*/_react.default.createElement("div", {
-      className: `${prefixCls}-mask-info`
+      className: "".concat(prefixCls, "-mask-info")
     }, /*#__PURE__*/_react.default.createElement(_semiIcons.IconEyeOpened, {
       size: "extra-large"
     }), /*#__PURE__*/_react.default.createElement("span", {
-      className: `${prefixCls}-mask-info-text`
+      className: "".concat(prefixCls, "-mask-info-text")
     }, this.getLocalTextByKey("preview"))));
 
     this.state = {
@@ -240,9 +240,9 @@ class Image extends _baseComponent.default {
         src: this.isInGroup() && this.isLazyLoad() ? undefined : src,
         "data-src": src,
         alt: alt,
-        className: (0, _classnames.default)(`${prefixCls}-img`, {
-          [`${prefixCls}-img-preview`]: showPreviewCursor,
-          [`${prefixCls}-img-error`]: loadStatus === "error"
+        className: (0, _classnames.default)("".concat(prefixCls, "-img"), {
+          ["".concat(prefixCls, "-img-preview")]: showPreviewCursor,
+          ["".concat(prefixCls, "-img-error")]: loadStatus === "error"
         }),
         width: width,
         height: height,

package/lib/cjs/image/preview.js

@@ -122,7 +122,7 @@ class Preview extends _baseComponent.default {
     const {
       lazyLoadMargin
     } = this.props;
-    const allElement = document.querySelectorAll(`.${prefixCls}-img`); // use IntersectionObserver to lazy load image
+    const allElement = document.querySelectorAll(".".concat(prefixCls, "-img")); // use IntersectionObserver to lazy load image
 
     const observer = new IntersectionObserver(entries => {
       entries.forEach(item => {
@@ -136,7 +136,7 @@ class Preview extends _baseComponent.default {
         }
       });
     }, {
-      root: document.querySelector(`#${this.previewGroupId}`),
+      root: document.querySelector("#".concat(this.previewGroupId)),
       rootMargin: lazyLoadMargin
     });
     allElement.forEach(item => observer.observe(item));
@@ -190,7 +190,7 @@ class Preview extends _baseComponent.default {
     }, /*#__PURE__*/_react.default.createElement("div", {
       id: this.previewGroupId,
       style: style,
-      className: `${prefixCls}-preview-group`
+      className: "".concat(prefixCls, "-preview-group")
     }, newChildren), /*#__PURE__*/_react.default.createElement(_previewInner.default, Object.assign({}, restProps, {
       ref: this.previewRef,
       src: finalSrcList,

package/lib/cjs/image/previewFooter.js

@@ -32,7 +32,7 @@ var _localeConsumer = _interopRequireDefault(require("../locale/localeConsumer")
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const prefixCls = _constants.cssClasses.PREFIX;
-const footerPrefixCls = `${_constants.cssClasses.PREFIX}-preview-footer`;
+const footerPrefixCls = "".concat(_constants.cssClasses.PREFIX, "-preview-footer");
 let mouseActiveTime = 0;
 
 class Footer extends _baseComponent.default {
@@ -133,7 +133,7 @@ class Footer extends _baseComponent.default {
 
       const icon = /*#__PURE__*/_react.default.createElement(_semiIcons.IconChevronLeft, {
         size: "large",
-        className: disabledPrev ? `${footerPrefixCls}-disabled` : "",
+        className: disabledPrev ? "".concat(footerPrefixCls, "-disabled") : "",
         onClick: !disabledPrev ? onPrev : undefined
       });
 
@@ -150,7 +150,7 @@ class Footer extends _baseComponent.default {
 
       const icon = /*#__PURE__*/_react.default.createElement(_semiIcons.IconChevronRight, {
         size: "large",
-        className: disabledNext ? `${footerPrefixCls}-disabled` : "",
+        className: disabledNext ? "".concat(footerPrefixCls, "-disabled") : "",
         onClick: !disabledNext ? onNext : undefined
       });
 
@@ -169,7 +169,7 @@ class Footer extends _baseComponent.default {
       const icon = /*#__PURE__*/_react.default.createElement(_semiIcons.IconMinus, {
         size: "large",
         onClick: !disabledZoomOut ? this.handleMinusClick : undefined,
-        className: disabledZoomOut ? `${footerPrefixCls}-disabled` : ""
+        className: disabledZoomOut ? "".concat(footerPrefixCls, "-disabled") : ""
       });
 
       const content = zoomOutTip !== null && zoomOutTip !== void 0 ? zoomOutTip : this.getLocalTextByKey("zoomOutTip");
@@ -187,7 +187,7 @@ class Footer extends _baseComponent.default {
       const icon = /*#__PURE__*/_react.default.createElement(_semiIcons.IconPlus, {
         size: "large",
         onClick: !disabledZoomIn ? this.handlePlusClick : undefined,
-        className: disabledZoomIn ? `${footerPrefixCls}-disabled` : ""
+        className: disabledZoomIn ? "".concat(footerPrefixCls, "-disabled") : ""
       });
 
       const content = zoomInTip !== null && zoomInTip !== void 0 ? zoomInTip : this.getLocalTextByKey("zoomInTip");
@@ -202,7 +202,7 @@ class Footer extends _baseComponent.default {
       } = this.props;
       const props = {
         size: "large",
-        className: (0, _classnames.default)(`${footerPrefixCls}-gap`),
+        className: (0, _classnames.default)("".concat(footerPrefixCls, "-gap")),
         onClick: this.handleRatioClick
       };
       const icon = ratio === "adaptation" ? /*#__PURE__*/_react.default.createElement(_semiIcons.IconRealSizeStroked, Object.assign({}, props)) : /*#__PURE__*/_react.default.createElement(_semiIcons.IconWindowAdaptionStroked, Object.assign({}, props));
@@ -241,8 +241,8 @@ class Footer extends _baseComponent.default {
       const icon = /*#__PURE__*/_react.default.createElement(_semiIcons.IconDownload, {
         size: "large",
         onClick: !disableDownload ? onDownload : undefined,
-        className: (0, _classnames.default)(`${footerPrefixCls}-gap`, {
-          [`${footerPrefixCls}-disabled`]: disableDownload
+        className: (0, _classnames.default)("".concat(footerPrefixCls, "-gap"), {
+          ["".concat(footerPrefixCls, "-disabled")]: disableDownload
         })
       });
 
@@ -276,14 +276,14 @@ class Footer extends _baseComponent.default {
 
     if (renderPreviewMenu) {
       return /*#__PURE__*/_react.default.createElement("div", {
-        className: `${footerPrefixCls}-wrapper`
+        className: "".concat(footerPrefixCls, "-wrapper")
       }, this.customRenderViewMenu());
     }
 
     return /*#__PURE__*/_react.default.createElement("section", {
-      className: (0, _classnames.default)(footerPrefixCls, `${footerPrefixCls}-wrapper`, className)
+      className: (0, _classnames.default)(footerPrefixCls, "".concat(footerPrefixCls, "-wrapper"), className)
     }, this.getIconChevronLeft(), /*#__PURE__*/_react.default.createElement("div", {
-      className: `${footerPrefixCls}-page`
+      className: "".concat(footerPrefixCls, "-page")
     }, /*#__PURE__*/_react.default.createElement("span", null, curPage), /*#__PURE__*/_react.default.createElement("span", null, "/"), /*#__PURE__*/_react.default.createElement("span", null, totalNum)), this.getIconChevronRight(), /*#__PURE__*/_react.default.createElement(_divider.default, {
       layout: "vertical"
     }), this.getIconMinus(), /*#__PURE__*/_react.default.createElement(_slider.default, {
@@ -291,7 +291,7 @@ class Footer extends _baseComponent.default {
       min: min,
       max: max,
       step: step,
-      tipFormatter: v => `${v}%`,
+      tipFormatter: v => "".concat(v, "%"),
       tooltipVisible: showTooltip ? undefined : false,
       onChange: this.handleSlideChange
     }), this.getIconPlus(), this.getIconRatio(), /*#__PURE__*/_react.default.createElement(_divider.default, {

package/lib/cjs/image/previewHeader.js

@@ -21,7 +21,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-const prefixCls = `${_constants.cssClasses.PREFIX}-preview-header`;
+const prefixCls = "".concat(_constants.cssClasses.PREFIX, "-preview-header");
 
 const Header = _ref => {
   let {
@@ -44,10 +44,10 @@ const Header = _ref => {
     return /*#__PURE__*/React.createElement("section", {
       className: (0, _classnames.default)(prefixCls, className)
     }, /*#__PURE__*/React.createElement("section", {
-      className: `${prefixCls}-title`,
+      className: "".concat(prefixCls, "-title"),
       style: titleStyle
     }, renderHeader ? renderHeader(title) : title), /*#__PURE__*/React.createElement("section", {
-      className: `${prefixCls}-close`,
+      className: "".concat(prefixCls, "-close"),
       onMouseUp: onClose
     }, /*#__PURE__*/React.createElement(_semiIcons.IconClose, null)));
   });

package/lib/cjs/image/previewImage.js

@@ -20,7 +20,7 @@ var _previewImageFoundation = _interopRequireDefault(require("@douyinfe/semi-fou
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const prefixCls = _constants.cssClasses.PREFIX;
-const preViewImgPrefixCls = `${prefixCls}-preview-image`;
+const preViewImgPrefixCls = "".concat(prefixCls, "-preview-image");
 let originImageWidth = null;
 let originImageHeight = null;
 let startMouseMove = false; // startMouseOffset：The offset of the mouse relative to the left and top of the picture
@@ -201,20 +201,20 @@ class PreviewImage extends _baseComponent.default {
     const imgStyle = {
       position: "absolute",
       visibility: loading ? "hidden" : "visible",
-      transform: `rotate(${-rotation}deg)`,
+      transform: "rotate(".concat(-rotation, "deg)"),
       top,
       left,
-      width: loading ? "auto" : `${width}px`,
-      height: loading ? "auto" : `${height}px`
+      width: loading ? "auto" : "".concat(width, "px"),
+      height: loading ? "auto" : "".concat(height, "px")
     };
     return /*#__PURE__*/_react.default.createElement("div", {
-      className: `${preViewImgPrefixCls}`,
+      className: "".concat(preViewImgPrefixCls),
       ref: this.containerRef
     }, /*#__PURE__*/_react.default.createElement("img", {
       ref: this.registryImageRef,
       src: src,
       alt: "previewImag",
-      className: `${preViewImgPrefixCls}-img`,
+      className: "".concat(preViewImgPrefixCls, "-img"),
       key: src,
       onMouseMove: this.handleMoveImage,
       onMouseDown: this.onImageMouseDown,
@@ -227,7 +227,7 @@ class PreviewImage extends _baseComponent.default {
       crossOrigin: crossOrigin
     }), loading && /*#__PURE__*/_react.default.createElement(_spin.default, {
       size: "large",
-      wrapperClassName: `${preViewImgPrefixCls}-spin`
+      wrapperClassName: "".concat(preViewImgPrefixCls, "-spin")
     }));
   }
 

package/lib/cjs/image/previewInner.js

@@ -138,7 +138,7 @@ class PreviewInner extends _baseComponent.default {
 
         if (!getPopupContainer && this.bodyOverflow !== 'hidden') {
           document.body.style.overflow = 'hidden';
-          document.body.style.width = `calc(${this.originBodyWidth || '100%'} - ${this.scrollBarWidth}px)`;
+          document.body.style.width = "calc(".concat(this.originBodyWidth || '100%', " - ").concat(this.scrollBarWidth, "px)");
         }
       },
       enabledBodyScroll: () => {
@@ -350,12 +350,12 @@ class PreviewInner extends _baseComponent.default {
       };
     }
 
-    const previewPrefixCls = `${prefixCls}-preview`;
+    const previewPrefixCls = "".concat(prefixCls, "-preview");
     const previewWrapperCls = (0, _classnames.default)(previewPrefixCls, {
-      [`${prefixCls}-hide`]: !visible,
-      [`${previewPrefixCls}-popup`]: getPopupContainer
+      ["".concat(prefixCls, "-hide")]: !visible,
+      ["".concat(previewPrefixCls, "-popup")]: getPopupContainer
     }, className);
-    const hideViewerCls = !viewerVisible ? `${previewPrefixCls}-hide` : "";
+    const hideViewerCls = !viewerVisible ? "".concat(previewPrefixCls, "-hide") : "";
     const total = imgSrc.length;
     const showPrev = total !== 1 && (infinite || currentIndex !== 0);
     const showNext = total !== 1 && (infinite || currentIndex !== total - 1);
@@ -393,7 +393,7 @@ class PreviewInner extends _baseComponent.default {
     /*#__PURE__*/
     // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions
     _react.default.createElement("div", {
-      className: (0, _classnames.default)(`${previewPrefixCls}-icon`, `${previewPrefixCls}-prev`, hideViewerCls),
+      className: (0, _classnames.default)("".concat(previewPrefixCls, "-icon"), "".concat(previewPrefixCls, "-prev"), hideViewerCls),
       onClick: () => this.handleSwitchImage("prev")
     }, /*#__PURE__*/_react.default.createElement(_semiIcons.IconArrowLeft, {
       size: "large"
@@ -401,7 +401,7 @@ class PreviewInner extends _baseComponent.default {
     /*#__PURE__*/
     // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions
     _react.default.createElement("div", {
-      className: (0, _classnames.default)(`${previewPrefixCls}-icon`, `${previewPrefixCls}-next`, hideViewerCls),
+      className: (0, _classnames.default)("".concat(previewPrefixCls, "-icon"), "".concat(previewPrefixCls, "-next"), hideViewerCls),
       onClick: () => this.handleSwitchImage("next")
     }, /*#__PURE__*/_react.default.createElement(_semiIcons.IconArrowRight, {
       size: "large"