@douyinfe/semi-ui 2.19.0-beta.0 → 2.19.0

package/lib/es/_utils/index.js

@@ -1,12 +1,6 @@
 import _get from "lodash/get";
 import _set from "lodash/set";
 import _cloneDeepWith from "lodash/cloneDeepWith";
-import _Array$isArray from "@babel/runtime-corejs3/core-js-stable/array/is-array";
-import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
-import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
-import _Object$assign from "@babel/runtime-corejs3/core-js-stable/object/assign";
-import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
-import _Array$from from "@babel/runtime-corejs3/core-js-stable/array/from";
 
 /* eslint-disable max-len */
 
@@ -53,17 +47,15 @@ export function cloneDeep(value, customizer) {
       return v;
     }
 
-    if (_Array$isArray(v) && v.length === 0) {
-      const keys = _Object$keys(v);
+    if (Array.isArray(v) && v.length === 0) {
+      const keys = Object.keys(v);
 
       if (keys.length) {
         const newArray = [];
-
-        _forEachInstanceProperty(keys).call(keys, key => {
+        keys.forEach(key => {
           _set(newArray, key, v[key]);
         }); // internal-issues:887
 
-
         try {
           warning(_get(process, 'env.NODE_ENV') !== 'production', "[Semi] You may use an out-of-bounds array. In some cases, your program may not behave as expected.\n                    The maximum length of an array is 4294967295.\n                    Please check whether the array subscript in your data exceeds the maximum value of the JS array subscript");
         } catch (e) {}
@@ -100,14 +92,14 @@ export const getHighLightTextHTML = _ref => {
       caseSensitive: false
     }
   } = _ref;
-  const chunks = findAll(_Object$assign({
+  const chunks = findAll(Object.assign({
     sourceString,
     searchWords
   }, option));
   const markEle = option.highlightTag || 'mark';
   const highlightClassName = option.highlightClassName || '';
   const highlightStyle = option.highlightStyle || {};
-  return _mapInstanceProperty(chunks).call(chunks, (chunk, index) => {
+  return chunks.map((chunk, index) => {
     const {
       end,
       start,
@@ -186,7 +178,6 @@ export function getFocusableElements(node) {
   const focusableSelectorsList = ["input:not([disabled]):not([tabindex='-1'])", "textarea:not([disabled]):not([tabindex='-1'])", "button:not([disabled]):not([tabindex='-1'])", "a[href]:not([tabindex='-1'])", "select:not([disabled]):not([tabindex='-1'])", "area[href]:not([tabindex='-1'])", "iframe:not([tabindex='-1'])", "object:not([tabindex='-1'])", "*[tabindex]:not([tabindex='-1'])", "*[contenteditable]:not([tabindex='-1'])"];
   const focusableSelectorsStr = focusableSelectorsList.join(','); // we are not filtered elements which are invisible
 
-  const focusableElements = _Array$from(node.querySelectorAll(focusableSelectorsStr));
-
+  const focusableElements = Array.from(node.querySelectorAll(focusableSelectorsStr));
   return focusableElements;
 }

package/lib/es/anchor/index.d.ts

@@ -6,6 +6,7 @@ import BaseComponent from '../_base/baseComponent';
 import Link from './link';
 import '@douyinfe/semi-foundation/lib/es/anchor/anchor.css';
 import { ArrayElement } from '../_base/base';
+import { ContextValue } from '../configProvider/context';
 export { LinkProps } from './link';
 export interface AnchorProps {
     autoCollapse?: boolean;
@@ -35,6 +36,7 @@ export interface AnchorState {
     slideBarTop: string;
 }
 declare class Anchor extends BaseComponent<AnchorProps, AnchorState> {
+    static contextType: React.Context<ContextValue>;
     static Link: typeof Link;
     static PropTypes: {
         size: PropTypes.Requireable<"default" | "small">;
@@ -77,6 +79,7 @@ declare class Anchor extends BaseComponent<AnchorProps, AnchorState> {
     childMap: Record<string, Set<string>>;
     handler: () => void;
     clickHandler: () => void;
+    context: ContextValue;
     constructor(props: AnchorProps);
     get adapter(): AnchorAdapter<AnchorProps, AnchorState>;
     addLink: (link: string) => void;
@@ -88,6 +91,7 @@ declare class Anchor extends BaseComponent<AnchorProps, AnchorState> {
     setScrollHeight: () => void;
     updateScrollHeight: (prevState: AnchorState, state: AnchorState) => void;
     updateChildMap: (prevState: AnchorState, state: AnchorState) => void;
+    renderChildren: () => any;
     componentDidMount(): void;
     componentDidUpdate(prevProps: AnchorProps, prevState: AnchorState): void;
     componentWillUnmount(): void;

package/lib/es/anchor/index.js

@@ -1,12 +1,6 @@
 import _throttle from "lodash/throttle";
 import _debounce from "lodash/debounce";
 import _noop from "lodash/noop";
-import _Object$assign from "@babel/runtime-corejs3/core-js-stable/object/assign";
-import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/slice";
-import _indexOfInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/index-of";
-import _spliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/splice";
-import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
-import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
 import React from 'react';
 import cls from 'classnames';
 import PropTypes from 'prop-types';
@@ -17,11 +11,15 @@ import Link from './link';
 import AnchorContext from './anchor-context';
 import '@douyinfe/semi-foundation/lib/es/anchor/anchor.css';
 import getUuid from '@douyinfe/semi-foundation/lib/es/utils/uuid';
+import ConfigContext from '../configProvider/context';
 const prefixCls = cssClasses.PREFIX;
 
 class Anchor extends BaseComponent {
   constructor(props) {
+    var _this;
+
     super(props);
+    _this = this;
 
     this.addLink = link => {
       this.foundation.addLink(link);
@@ -60,6 +58,35 @@ class Anchor extends BaseComponent {
       this.foundation.updateChildMap(prevState, state);
     };
 
+    this.renderChildren = () => {
+      const loop = function (children) {
+        let level = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
+        return React.Children.map(children, child => {
+          if ( /*#__PURE__*/React.isValidElement(child)) {
+            const childProps = {
+              direction: _this.context.direction,
+              level,
+              children: []
+            };
+            const {
+              children
+            } = child.props;
+            const hasChildren = children && React.Children.count(children) > 0;
+
+            if (hasChildren) {
+              childProps.children = loop(children, level + 1);
+            }
+
+            return /*#__PURE__*/React.cloneElement(child, childProps);
+          }
+
+          return null;
+        });
+      };
+
+      return loop(this.props.children);
+    };
+
     this.state = {
       activeLink: '',
       links: [],
@@ -72,7 +99,7 @@ class Anchor extends BaseComponent {
   }
 
   get adapter() {
-    return _Object$assign(_Object$assign({}, super.adapter), {
+    return Object.assign(Object.assign({}, super.adapter), {
       addLink: value => {
         this.setState(prevState => ({
           links: [...prevState.links, value]
@@ -80,15 +107,11 @@ class Anchor extends BaseComponent {
       },
       removeLink: link => {
         this.setState(prevState => {
-          var _context;
-
-          const links = _sliceInstanceProperty(_context = prevState.links).call(_context);
-
-          const index = _indexOfInstanceProperty(links).call(links, link);
+          const links = prevState.links.slice();
+          const index = links.indexOf(link);
 
           if (index !== -1) {
-            _spliceInstanceProperty(links).call(links, index, 1);
-
+            links.splice(index, 1);
             return {
               links
             };
@@ -153,8 +176,7 @@ class Anchor extends BaseComponent {
           offsetTop
         } = this.props;
         const containerTop = this.adapter.getContainerBoundingTop();
-
-        const elTop = _mapInstanceProperty(links).call(links, link => {
+        const elTop = links.map(link => {
           let node = null;
 
           try {
@@ -164,14 +186,10 @@ class Anchor extends BaseComponent {
 
           return node && node.getBoundingClientRect().top - containerTop - offsetTop || -Infinity;
         });
-
         return elTop;
       },
       getAnchorNode: selector => {
-        var _context2;
-
-        const selectors = _concatInstanceProperty(_context2 = "#".concat(this.anchorID, " ")).call(_context2, selector);
-
+        const selectors = "#".concat(this.anchorID, " ").concat(selector);
         return document.querySelector(selectors);
       },
       getContentNode: selector => document.querySelector(selector),
@@ -207,8 +225,6 @@ class Anchor extends BaseComponent {
   }
 
   render() {
-    var _context3, _context4, _context5, _context6;
-
     const {
       size,
       railTheme,
@@ -228,21 +244,19 @@ class Anchor extends BaseComponent {
       slideBarTop
     } = this.state;
     const wrapperCls = cls(prefixCls, className, {
-      [_concatInstanceProperty(_context3 = "".concat(prefixCls, "-size-")).call(_context3, size)]: size
+      ["".concat(prefixCls, "-size-").concat(size)]: size
     });
-    const slideCls = cls("".concat(prefixCls, "-slide"), _concatInstanceProperty(_context4 = "".concat(prefixCls, "-slide-")).call(_context4, railTheme));
+    const slideCls = cls("".concat(prefixCls, "-slide"), "".concat(prefixCls, "-slide-").concat(railTheme));
     const slideBarCls = cls("".concat(prefixCls, "-slide-bar"), {
-      [_concatInstanceProperty(_context5 = "".concat(prefixCls, "-slide-bar-")).call(_context5, size)]: size,
-      [_concatInstanceProperty(_context6 = "".concat(prefixCls, "-slide-bar-")).call(_context6, railTheme)]: railTheme,
+      ["".concat(prefixCls, "-slide-bar-").concat(size)]: size,
+      ["".concat(prefixCls, "-slide-bar-").concat(railTheme)]: railTheme,
       ["".concat(prefixCls, "-slide-bar-active")]: activeLink
     });
     const anchorWrapper = "".concat(prefixCls, "-link-wrapper");
-
-    const wrapperStyle = _Object$assign(_Object$assign({}, style), {
+    const wrapperStyle = Object.assign(Object.assign({}, style), {
       maxWidth,
       maxHeight
     });
-
     return /*#__PURE__*/React.createElement(AnchorContext.Provider, {
       value: {
         activeLink,
@@ -275,11 +289,12 @@ class Anchor extends BaseComponent {
     })), /*#__PURE__*/React.createElement("div", {
       className: anchorWrapper,
       role: "list"
-    }, children)));
+    }, this.renderChildren())));
   }
 
 }
 
+Anchor.contextType = ConfigContext;
 Anchor.Link = Link;
 Anchor.PropTypes = {
   size: PropTypes.oneOf(strings.SIZE),

package/lib/es/anchor/link.d.ts

@@ -10,6 +10,8 @@ export interface LinkProps {
     children?: ReactNode;
     style?: React.CSSProperties;
     disabled?: boolean;
+    level?: number;
+    direction?: 'ltr' | 'rtl';
 }
 export default class Link extends BaseComponent<LinkProps, {}> {
     static propTypes: {

package/lib/es/anchor/link.js

@@ -1,5 +1,3 @@
-import _Object$assign from "@babel/runtime-corejs3/core-js-stable/object/assign";
-import _bindInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/bind";
 import React from 'react';
 import cls from 'classnames';
 import PropTypes from 'prop-types';
@@ -12,8 +10,6 @@ const prefixCls = cssClasses.PREFIX; // eslint-disable-next-line @typescript-esl
 
 export default class Link extends BaseComponent {
   constructor(props) {
-    var _context;
-
     super(props);
 
     this.renderTitle = () => {
@@ -43,7 +39,7 @@ export default class Link extends BaseComponent {
           size: size === 'default' ? 'normal' : 'small',
           ellipsis: {
             showTooltip: {
-              opts: _Object$assign({}, toolTipOpt)
+              opts: Object.assign({}, toolTipOpt)
             }
           },
           type: 'tertiary',
@@ -76,11 +72,11 @@ export default class Link extends BaseComponent {
     };
 
     this.foundation = new LinkFoundation(this.adapter);
-    this.handleClick = _bindInstanceProperty(_context = this.handleClick).call(_context, this);
+    this.handleClick = this.handleClick.bind(this);
   }
 
   get adapter() {
-    return _Object$assign(_Object$assign({}, super.adapter), {
+    return Object.assign(Object.assign({}, super.adapter), {
       addLink: href => {
         this.context.addLink(href);
       },
@@ -135,7 +131,9 @@ export default class Link extends BaseComponent {
       className,
       style,
       disabled = false,
-      title
+      title,
+      level,
+      direction
     } = this.props;
     const {
       activeLink,
@@ -147,8 +145,12 @@ export default class Link extends BaseComponent {
       ["".concat(prefixCls, "-link-title-active")]: active,
       ["".concat(prefixCls, "-link-title-disabled")]: disabled
     });
+    const paddingAttributeKey = direction === 'rtl' ? 'paddingRight' : 'paddingLeft';
     const ariaProps = {
-      'aria-disabled': disabled
+      'aria-disabled': disabled,
+      style: {
+        [paddingAttributeKey]: 8 * level
+      }
     };
 
     if (active) {
@@ -163,7 +165,7 @@ export default class Link extends BaseComponent {
       className: linkCls,
       style: style,
       role: "listitem"
-    }, /*#__PURE__*/React.createElement("div", _Object$assign({
+    }, /*#__PURE__*/React.createElement("div", Object.assign({
       role: "link",
       tabIndex: 0
     }, ariaProps, {

package/lib/es/autoComplete/index.js

@@ -1,11 +1,5 @@
 import _noop from "lodash/noop";
 import _isEqual from "lodash/isEqual";
-import _Map from "@babel/runtime-corejs3/core-js-stable/map";
-import _Object$assign from "@babel/runtime-corejs3/core-js-stable/object/assign";
-import _Array$from from "@babel/runtime-corejs3/core-js-stable/array/from";
-import _valuesInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/values";
-import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
-import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
 
 /* eslint-disable @typescript-eslint/ban-types, max-len */
 import React from 'react';
@@ -59,7 +53,7 @@ class AutoComplete extends BaseComponent {
       // current focus option index
       focusIndex: props.defaultActiveFirstOption ? 0 : -1,
       // current selected options
-      selection: new _Map(),
+      selection: new Map(),
       rePosKey: initRePosKey
     };
     this.triggerRef = /*#__PURE__*/React.createRef();
@@ -89,7 +83,7 @@ class AutoComplete extends BaseComponent {
         });
       }
     };
-    return _Object$assign(_Object$assign(_Object$assign({}, super.adapter), keyboardAdapter), {
+    return Object.assign(Object.assign(Object.assign({}, super.adapter), keyboardAdapter), {
       getTriggerWidth: () => {
         const el = this.triggerRef.current;
         return el && el.getBoundingClientRect().width;
@@ -194,8 +188,7 @@ class AutoComplete extends BaseComponent {
       selection
     } = this.state;
     const useCustomTrigger = typeof triggerRender === 'function';
-
-    const outerProps = _Object$assign(_Object$assign({
+    const outerProps = Object.assign(Object.assign({
       style,
       className: useCustomTrigger ? cls(className) : cls({
         [prefixCls]: true,
@@ -208,7 +201,6 @@ class AutoComplete extends BaseComponent {
       // tooltip give tabindex 0 to children by default, autoComplete just need the input get focus, so outer div's tabindex set to -1
       tabIndex: -1
     });
-
     const innerProps = {
       disabled,
       placeholder,
@@ -231,13 +223,13 @@ class AutoComplete extends BaseComponent {
       onBlur: this.onBlur,
       onFocus: this.onFocus
     };
-    return /*#__PURE__*/React.createElement("div", _Object$assign({}, outerProps), typeof triggerRender === 'function' ? /*#__PURE__*/React.createElement(Trigger, _Object$assign({}, innerProps, {
+    return /*#__PURE__*/React.createElement("div", Object.assign({}, outerProps), typeof triggerRender === 'function' ? /*#__PURE__*/React.createElement(Trigger, Object.assign({}, innerProps, {
       inputValue: typeof value !== 'undefined' ? value : inputValue,
-      value: _Array$from(_valuesInstanceProperty(selection).call(selection)),
+      value: Array.from(selection.values()),
       triggerRender: triggerRender,
       componentName: "AutoComplete",
-      componentProps: _Object$assign({}, this.props)
-    })) : /*#__PURE__*/React.createElement(Input, _Object$assign({}, innerProps, {
+      componentProps: Object.assign({}, this.props)
+    })) : /*#__PURE__*/React.createElement(Input, Object.assign({}, innerProps, {
       value: typeof value !== 'undefined' ? value : inputValue
     })));
   }
@@ -254,7 +246,7 @@ class AutoComplete extends BaseComponent {
       focusIndex
     } = this.state;
     const isFocused = optionIndex === focusIndex;
-    return /*#__PURE__*/React.createElement(Option, _Object$assign({
+    return /*#__PURE__*/React.createElement(Option, Object.assign({
       showTick: false,
       onSelect: (v, e) => this.onSelect(v, optionIndex, e),
       // selected={selection.has(option.label)}
@@ -284,16 +276,13 @@ class AutoComplete extends BaseComponent {
     if (options.length === 0) {
       optionsNode = emptyContent;
     } else {
-      var _context;
-
-      optionsNode = _mapInstanceProperty(_context = _filterInstanceProperty(options).call(options, option => option.show)).call(_context, (option, i) => this.renderOption(option, i));
+      optionsNode = options.filter(option => option.show).map((option, i) => this.renderOption(option, i));
     }
 
-    const style = _Object$assign({
+    const style = Object.assign({
       maxHeight: maxHeight,
       minWidth: dropdownMinWidth
     }, dropdownStyle);
-
     return /*#__PURE__*/React.createElement("div", {
       className: listCls,
       role: "listbox",

package/lib/es/autoComplete/option.js

@@ -1,15 +1,12 @@
 import _isString from "lodash/isString";
-import _indexOfInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/index-of";
-import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
-import _Object$assign from "@babel/runtime-corejs3/core-js-stable/object/assign";
 
 var __rest = this && this.__rest || function (s, e) {
   var t = {};
 
-  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && _indexOfInstanceProperty(e).call(e, p) < 0) t[p] = s[p];
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
 
-  if (s != null && typeof _Object$getOwnPropertySymbols === "function") for (var i = 0, p = _Object$getOwnPropertySymbols(s); i < p.length; i++) {
-    if (_indexOfInstanceProperty(e).call(e, p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
   }
   return t;
 };
@@ -39,7 +36,7 @@ class Option extends PureComponent {
     const isDisabled = props.disabled;
 
     if (!isDisabled) {
-      props.onSelect(_Object$assign(_Object$assign({}, rest), {
+      props.onSelect(Object.assign(Object.assign({}, rest), {
         value,
         label: label || children
       }), event);
@@ -107,7 +104,7 @@ class Option extends PureComponent {
 
 
     if (typeof renderOptionItem === 'function') {
-      return renderOptionItem(_Object$assign({
+      return renderOptionItem(Object.assign({
         disabled,
         focused,
         selected,
@@ -116,7 +113,7 @@ class Option extends PureComponent {
         value,
         inputValue,
         onMouseEnter: e => onMouseEnter(e),
-        onClick: e => this.onClick(_Object$assign({
+        onClick: e => this.onClick(Object.assign({
           value,
           label,
           children
@@ -137,7 +134,7 @@ class Option extends PureComponent {
       React.createElement("div", {
         className: optionClassName,
         onClick: e => {
-          this.onClick(_Object$assign({
+          this.onClick(Object.assign({
             value,
             label,
             children

package/lib/es/avatar/avatarGroup.js

@@ -1,22 +1,14 @@
 import _isNumber from "lodash/isNumber";
 import _isFunction from "lodash/isFunction";
 import _get from "lodash/get";
-import _indexOfInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/index-of";
-import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
-import _Array$isArray from "@babel/runtime-corejs3/core-js-stable/array/is-array";
-import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/slice";
-import _reduceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/reduce";
-import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
-import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
-import _Object$assign from "@babel/runtime-corejs3/core-js-stable/object/assign";
 
 var __rest = this && this.__rest || function (s, e) {
   var t = {};
 
-  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && _indexOfInstanceProperty(e).call(e, p) < 0) t[p] = s[p];
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
 
-  if (s != null && typeof _Object$getOwnPropertySymbols === "function") for (var i = 0, p = _Object$getOwnPropertySymbols(s); i < p.length; i++) {
-    if (_indexOfInstanceProperty(e).call(e, p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
   }
   return t;
 };
@@ -37,7 +29,7 @@ export default class AvatarGroup extends PureComponent {
     } = this.props;
 
     if (children) {
-      return _Array$isArray(children) ? React.Children.toArray(children) : [children];
+      return Array.isArray(children) ? React.Children.toArray(children) : [children];
     }
 
     return [];
@@ -49,10 +41,8 @@ export default class AvatarGroup extends PureComponent {
     } = this.props;
     let renderAvatars = avatars;
     const restNumber = avatars.length - maxCount;
-
-    const normalAvatars = _sliceInstanceProperty(avatars).call(avatars, 0, maxCount);
-
-    const restAvatars = _sliceInstanceProperty(avatars).call(avatars, maxCount);
+    const normalAvatars = avatars.slice(0, maxCount);
+    const restAvatars = avatars.slice(maxCount);
 
     if (restNumber > 0) {
       const more = this.renderMoreAvatar(restNumber, restAvatars);
@@ -64,15 +54,11 @@ export default class AvatarGroup extends PureComponent {
   }
 
   renderMoreAvatar(restNumber, restAvatars) {
-    var _context2;
-
     const {
       renderMore
     } = this.props;
     const moreCls = cls("".concat(prefixCls, "-item-more"));
-    const restAvatarAlt = restAvatars === null || restAvatars === void 0 ? void 0 : _reduceInstanceProperty(restAvatars).call(restAvatars, (pre, cur) => {
-      var _context;
-
+    const restAvatarAlt = restAvatars === null || restAvatars === void 0 ? void 0 : restAvatars.reduce((pre, cur) => {
       const {
         children,
         alt
@@ -83,11 +69,9 @@ export default class AvatarGroup extends PureComponent {
         return pre;
       }
 
-      return pre.length > 0 ? _concatInstanceProperty(_context = "".concat(pre, ",")).call(_context, avatarInfo) : avatarInfo;
+      return pre.length > 0 ? "".concat(pre, ",").concat(avatarInfo) : avatarInfo;
     }, '');
-
-    const finalAlt = _concatInstanceProperty(_context2 = " Number of remaining Avatars\uFF1A".concat(restNumber, ",")).call(_context2, restAvatarAlt);
-
+    const finalAlt = " Number of remaining Avatars\uFF1A".concat(restNumber, ",").concat(restAvatarAlt);
     let moreAvatar = /*#__PURE__*/React.createElement(Avatar, {
       className: moreCls,
       key: "_+n",
@@ -122,17 +106,13 @@ export default class AvatarGroup extends PureComponent {
     });
 
     if (children) {
-      var _context3;
-
       const avatars = this.getAllAvatars();
-      inner = _mapInstanceProperty(_context3 = _isNumber(maxCount) ? this.getMergeAvatars(avatars) : avatars).call(_context3, (itm, index) => {
-        var _context4, _context5;
-
+      inner = (_isNumber(maxCount) ? this.getMergeAvatars(avatars) : avatars).map((itm, index) => {
         const className = cls(_get(itm.props, 'className'), {
-          [_concatInstanceProperty(_context4 = "".concat(prefixCls, "-item-start-")).call(_context4, index)]: overlapFrom === 'start',
-          [_concatInstanceProperty(_context5 = "".concat(prefixCls, "-item-end-")).call(_context5, index)]: overlapFrom === 'end'
+          ["".concat(prefixCls, "-item-start-").concat(index)]: overlapFrom === 'start',
+          ["".concat(prefixCls, "-item-end-").concat(index)]: overlapFrom === 'end'
         });
-        return /*#__PURE__*/React.cloneElement(itm, _Object$assign(_Object$assign({}, rest), {
+        return /*#__PURE__*/React.cloneElement(itm, Object.assign(Object.assign({}, rest), {
           className,
           size,
           shape,