@nutui/nutui-react 1.5.2-beta.0 → 1.5.2-beta.1

package/dist/esm/AnimatingNumbers.js

@@ -0,0 +1,127 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["maxLen", "endNumber", "delaySpeed", "easeSpeed", "className", "thousands"];
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import React__default, { useRef, useMemo, useEffect, Component } from 'react';
+import { c as cn } from './bem-3b438e61.js';
+import '@bem-react/classname';
+var defaultProps$1 = {
+  maxLen: 0,
+  endNumber: '',
+  delaySpeed: 300,
+  easeSpeed: 1,
+  thousands: false,
+  className: ''
+};
+var CountUp = function CountUp(props) {
+  var _defaultProps$1$props = _objectSpread(_objectSpread({}, defaultProps$1), props),
+    maxLen = _defaultProps$1$props.maxLen,
+    endNumber = _defaultProps$1$props.endNumber,
+    delaySpeed = _defaultProps$1$props.delaySpeed,
+    easeSpeed = _defaultProps$1$props.easeSpeed,
+    className = _defaultProps$1$props.className,
+    thousands = _defaultProps$1$props.thousands,
+    reset = _objectWithoutProperties(_defaultProps$1$props, _excluded);
+  var b = cn('countup');
+  var countupRef = useRef(null);
+  var timerRef = useRef(0);
+  var numbers = Array.from({
+    length: 10
+  }, function (v, i) {
+    return i;
+  });
+  var getShowNumber = function getShowNumber() {
+    var splitArr = endNumber.split('.');
+    var intNumber = maxLen && splitArr[0].length < maxLen ? (Array(maxLen).join('0') + splitArr[0]).slice(-maxLen) : splitArr[0];
+    var currNumber = "".concat(thousands ? intNumber.replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') : intNumber).concat(splitArr[1] ? '.' : '').concat(splitArr[1] || '');
+    return currNumber.split('');
+  };
+  var numerArr = useMemo(getShowNumber, [endNumber, maxLen, thousands]);
+  var setNumberTransform = function setNumberTransform() {
+    if (countupRef.current) {
+      var numberItems = countupRef.current.querySelectorAll('.nut-countup__number');
+      var numberFilterArr = numerArr.filter(function (item) {
+        return !Number.isNaN(Number(item));
+      });
+      Object.keys(numberItems).forEach(function (key) {
+        var elem = numberItems[Number(key)];
+        var idx = Number(numberFilterArr[Number(key)]);
+        if ((idx || idx === 0) && elem) {
+          // 计算规则：父元素和实际列表高度的百分比，分割成20等份
+          var transform = "translate(0, -".concat((idx === 0 ? 10 : idx) * 5, "%)");
+          elem.style.transform = transform;
+          elem.style.webkitTransform = transform;
+        }
+      });
+    }
+  };
+  var numberEaseStyle = {
+    transition: "transform ".concat(easeSpeed, "s ease-in-out")
+  };
+  useEffect(function () {
+    timerRef.current = window.setTimeout(function () {
+      setNumberTransform();
+    }, delaySpeed);
+    return function () {
+      window.clearTimeout(timerRef.current);
+    };
+  }, [numerArr]);
+  return React__default.createElement("div", {
+    className: "".concat(b(), " ").concat(className),
+    ref: countupRef
+  }, React__default.createElement("ul", {
+    className: b('list')
+  }, numerArr.map(function (item, idx) {
+    return React__default.createElement("li", {
+      className: "".concat(b('listitem', {
+        number: !Number.isNaN(Number(item))
+      })),
+      key: idx
+    }, !Number.isNaN(Number(item)) ? React__default.createElement("span", {
+      className: b('number'),
+      style: numberEaseStyle
+    }, [].concat(numbers, numbers).map(function (number, subidx) {
+      return React__default.createElement("span", {
+        key: subidx
+      }, number);
+    })) : React__default.createElement("span", {
+      className: b('separator')
+    }, item));
+  })));
+};
+CountUp.defaultProps = defaultProps$1;
+CountUp.displayName = 'NutCountUp';
+var defaultProps = {};
+var AnimatingNumbers = /*#__PURE__*/function (_Component) {
+  _inherits(AnimatingNumbers, _Component);
+  var _super = _createSuper(AnimatingNumbers);
+  function AnimatingNumbers(props) {
+    var _this;
+    _classCallCheck(this, AnimatingNumbers);
+    _this = _super.call(this, props);
+    _this.state = {};
+    return _this;
+  }
+  _createClass(AnimatingNumbers, [{
+    key: "render",
+    value: function render() {
+      return React__default.createElement("div", {
+        className: "nut-animatingnumbers"
+      });
+    }
+  }]);
+  return AnimatingNumbers;
+}(Component);
+_defineProperty(AnimatingNumbers, "defaultProps", defaultProps);
+_defineProperty(AnimatingNumbers, "displayName", 'NutAnimatingNumbers');
+_defineProperty(AnimatingNumbers, "CountUp", CountUp);
+AnimatingNumbers.CountUp = CountUp;
+export { AnimatingNumbers as default };

package/dist/esm/Audio/style/index.js

@@ -0,0 +1,4 @@
+import '../../Icon/style'
+import '../../Button/style'
+import '../../Range/style'
+import '../../../packages/audio/audio.scss'

package/dist/esm/Audio.js

@@ -0,0 +1,266 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+var _excluded = ["className", "url", "style", "muted", "autoplay", "loop", "preload", "type", "onFastBack", "onForward", "onPause", "onPlayEnd", "onMute", "onCanPlay", "children", "iconClassPrefix", "iconFontClassName"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import React__default, { useState, useRef, useEffect } from 'react';
+import Icon from './Icon.js';
+import Range from './Range.js';
+import { c as cn } from './bem-3b438e61.js';
+import Button from './Button.js';
+import { useConfig } from './ConfigProvider.js';
+import { C as ComponentDefaults } from './typings-f27b58f4.js';
+import '@bem-react/classname';
+var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
+  className: '',
+  url: '',
+  style: {},
+  muted: false,
+  autoplay: false,
+  loop: false,
+  preload: 'auto',
+  type: 'progress',
+  onFastBack: function onFastBack(e) {},
+  onForward: function onForward(e) {},
+  onPause: function onPause(e) {},
+  onPlayEnd: function onPlayEnd(e) {},
+  onMute: function onMute(e) {},
+  onCanPlay: function onCanPlay(e) {}
+});
+var Audio = function Audio(props) {
+  var _useConfig = useConfig(),
+    locale = _useConfig.locale;
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+    className = _defaultProps$props.className,
+    url = _defaultProps$props.url,
+    style = _defaultProps$props.style,
+    muted = _defaultProps$props.muted,
+    autoplay = _defaultProps$props.autoplay,
+    loop = _defaultProps$props.loop,
+    preload = _defaultProps$props.preload,
+    type = _defaultProps$props.type,
+    onFastBack = _defaultProps$props.onFastBack,
+    onForward = _defaultProps$props.onForward,
+    onPause = _defaultProps$props.onPause,
+    onPlayEnd = _defaultProps$props.onPlayEnd,
+    onMute = _defaultProps$props.onMute,
+    onCanPlay = _defaultProps$props.onCanPlay,
+    children = _defaultProps$props.children,
+    iconClassPrefix = _defaultProps$props.iconClassPrefix,
+    iconFontClassName = _defaultProps$props.iconFontClassName,
+    rest = _objectWithoutProperties(_defaultProps$props, _excluded);
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    playing = _useState2[0],
+    setPlaying = _useState2[1];
+  var _useState3 = useState(0),
+    _useState4 = _slicedToArray(_useState3, 2),
+    percent = _useState4[0],
+    setPercent = _useState4[1];
+  var _useState5 = useState(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    isCanPlay = _useState6[0],
+    setIsCanPlay = _useState6[1];
+  var _useState7 = useState('00:00:00'),
+    _useState8 = _slicedToArray(_useState7, 2),
+    currentDuration = _useState8[0],
+    setCurrentDuration = _useState8[1];
+  var AudioRef = useRef(null);
+  var statusRef = useRef({
+    currentTime: 0,
+    currentDuration: '00:00:00',
+    percent: 0,
+    duration: '00:00:00',
+    second: 0,
+    hanMuted: props.muted,
+    playing: props.autoplay,
+    handPlaying: false
+  });
+  var b = cn('audio');
+  var warn = console.warn;
+  var handleEnded = function handleEnded(e) {
+    if (props.loop) {
+      warn(locale.audio.tips || 'onPlayEnd事件在loop=false时才会触发');
+    } else {
+      props.onPlayEnd && props.onPlayEnd(e);
+    }
+  };
+  function watch() {
+    if (AudioRef && AudioRef.current) {
+      var current = AudioRef.current;
+      current.addEventListener('play', function () {
+        setPlaying(true);
+      });
+    }
+  }
+  useEffect(function () {
+    watch();
+  }, []);
+  useEffect(function () {}, [currentDuration]);
+  var handleStatusChange = function handleStatusChange() {
+    setPlaying(!playing);
+    if (playing) {
+      AudioRef && AudioRef.current && AudioRef.current.pause();
+    } else {
+      AudioRef && AudioRef.current && AudioRef.current.play();
+    }
+  };
+  var renderIcon = function renderIcon() {
+    return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
+      className: b('icon')
+    }, React__default.createElement("div", {
+      className: "".concat(b('icon-box'), " ").concat(playing ? b('icon-play') : b('icon-stop')),
+      onClick: handleStatusChange
+    }, playing ? React__default.createElement(Icon, {
+      classPrefix: iconClassPrefix,
+      fontClassName: iconFontClassName,
+      name: "service",
+      className: "nut-icon-loading"
+    }) : React__default.createElement(Icon, {
+      classPrefix: iconClassPrefix,
+      fontClassName: iconFontClassName,
+      name: "service"
+    }))));
+  };
+  var handleBack = function handleBack() {
+    if (statusRef.current.currentTime > 0 && AudioRef.current) {
+      statusRef.current.currentTime--;
+      AudioRef.current.currentTime = statusRef.current.currentTime;
+      props.onFastBack && props.onFastBack(AudioRef.current);
+    }
+  };
+  var handleForward = function handleForward() {
+    if (AudioRef.current) {
+      statusRef.current.currentTime++;
+      AudioRef.current.currentTime = statusRef.current.currentTime;
+      props.onForward && props.onForward(AudioRef.current);
+    }
+  };
+  var handleMute = function handleMute() {
+    if (AudioRef.current) {
+      AudioRef.current.muted = !AudioRef.current.muted;
+      props.onMute && props.onMute(AudioRef.current);
+    }
+  };
+  var handlePause = function handlePause(e) {
+    setPlaying(false);
+    props.onPause && props.onPause(e);
+  };
+  var formatSeconds = function formatSeconds(value) {
+    if (!value) {
+      return '00:00:00';
+    }
+    var time = parseInt(value);
+    var hours = Math.floor(time / 3600);
+    var minutes = Math.floor((time - hours * 3600) / 60);
+    var seconds = time - hours * 3600 - minutes * 60;
+    var result = '';
+    result += "".concat("0".concat(hours.toString()).slice(-2), ":");
+    result += "".concat("0".concat(minutes.toString()).slice(-2), ":");
+    result += "0".concat(seconds.toString()).slice(-2);
+    return result;
+  };
+  var renderProgerss = function renderProgerss() {
+    return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
+      className: b('progress')
+    }, React__default.createElement("div", {
+      className: "time"
+    }, currentDuration), React__default.createElement("div", {
+      className: b('progress-bar-wrapper')
+    }, React__default.createElement(Range, {
+      modelValue: percent,
+      hiddenTag: true,
+      hiddenRange: true,
+      "inactive-color": "#cccccc",
+      "active-color": "#fa2c19"
+    })), React__default.createElement("div", {
+      className: "time"
+    }, AudioRef.current ? formatSeconds("".concat(statusRef.current.second)) : '00:00:00')), React__default.createElement("div", {
+      className: isCanPlay ? 'custom-button-group' : 'custom-button-group-disable'
+    }, React__default.createElement(Button, {
+      type: "primary",
+      size: "small",
+      className: "back",
+      onClick: handleBack
+    }, locale.audio.back || '快退'), React__default.createElement(Button, {
+      type: "primary",
+      size: "small",
+      className: "start",
+      onClick: handleStatusChange
+    }, playing ? "".concat(locale.audio.pause || '暂停') : "".concat(locale.audio.start || '开始')), React__default.createElement(Button, {
+      type: "primary",
+      size: "small",
+      onClick: handleForward
+    }, locale.audio.forward || '快进'), React__default.createElement(Button, {
+      type: AudioRef.current && AudioRef.current.muted ? 'default' : 'primary',
+      size: "small",
+      onClick: handleMute
+    }, locale.audio.mute || '静音')));
+  };
+  var renderNone = function renderNone() {
+    return React__default.createElement("div", {
+      className: b('none-container'),
+      onClick: handleStatusChange
+    }, children);
+  };
+  var renderAudio = function renderAudio() {
+    switch (type) {
+      case 'icon':
+        return renderIcon();
+      case 'progress':
+        return renderProgerss();
+      case 'none':
+        return renderNone();
+      default:
+        return null;
+    }
+  };
+  var handleCanplay = function handleCanplay(e) {
+    setIsCanPlay(true);
+    if (props.autoplay && !playing) {
+      AudioRef && AudioRef.current && AudioRef.current.play();
+    }
+    if (AudioRef.current) {
+      statusRef.current.second = AudioRef.current.duration || 0;
+      props.onCanPlay && props.onCanPlay(e);
+    }
+  };
+  var onTimeupdate = function onTimeupdate(e) {
+    var time = parseInt(e.target.currentTime);
+    var formated = formatSeconds("".concat(time));
+    statusRef.current.currentDuration = formated;
+    setPercent(time / statusRef.current.second * 100);
+    setCurrentDuration(formated);
+    statusRef.current.currentTime = time;
+  };
+  return React__default.createElement("div", _objectSpread({
+    className: "".concat(b(), " ").concat(className),
+    style: style
+  }, rest), renderAudio(), React__default.createElement("audio", {
+    className: "audioMain",
+    controls: type === 'controls',
+    ref: AudioRef,
+    src: url,
+    muted: muted,
+    preload: preload,
+    loop: loop,
+    onPause: function onPause(e) {
+      return handlePause(e);
+    },
+    onEnded: function onEnded(e) {
+      return handleEnded(e);
+    },
+    onCanPlay: function onCanPlay(e) {
+      return handleCanplay(e);
+    },
+    onTimeUpdate: function onTimeUpdate(e) {
+      return onTimeupdate(e);
+    }
+  }, React__default.createElement("track", {
+    kind: "captions"
+  })));
+};
+Audio.defaultProps = defaultProps;
+Audio.displayName = 'NutAudio';
+export { Audio as default };

package/dist/esm/Avatar/style/index.js

@@ -0,0 +1,2 @@
+import '../../AvatarGroup/style'
+import '../../../packages/avatar/avatar.scss'

package/dist/esm/Avatar.js

@@ -0,0 +1,132 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+var _excluded = ["children", "prefixCls", "size", "shape", "bgColor", "color", "url", "alt", "icon", "iconSize", "className", "style", "activeAvatar", "onActiveAvatar", "onError", "iconClassPrefix", "iconFontClassName"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import React__default, { useState, useRef, useContext, useEffect } from 'react';
+import classNames from 'classnames';
+import { A as AvatarContext } from './AvatarContext-15733596.js';
+import { c as cn } from './bem-3b438e61.js';
+import Icon from './Icon.js';
+import { C as ComponentDefaults } from './typings-f27b58f4.js';
+import '@bem-react/classname';
+var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
+  size: '',
+  icon: '',
+  iconSize: '',
+  bgColor: '#eee',
+  color: '#666',
+  prefixCls: 'nut-avatar',
+  url: '',
+  alt: ''
+});
+var Avatar = function Avatar(props) {
+  var _parent$propAvatarGro, _parent$propAvatarGro2, _classNames, _parent$propAvatarGro3, _parent$propAvatarGro4, _parent$propAvatarGro5, _parent$propAvatarGro6, _parent$propAvatarGro7, _parent$propAvatarGro9, _parent$propAvatarGro10, _parent$propAvatarGro11, _parent$propAvatarGro12, _parent$propAvatarGro13, _parent$propAvatarGro14, _parent$propAvatarGro15;
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+    children = _defaultProps$props.children,
+    prefixCls = _defaultProps$props.prefixCls,
+    size = _defaultProps$props.size,
+    shape = _defaultProps$props.shape,
+    bgColor = _defaultProps$props.bgColor,
+    color = _defaultProps$props.color,
+    url = _defaultProps$props.url,
+    alt = _defaultProps$props.alt,
+    icon = _defaultProps$props.icon,
+    iconSize = _defaultProps$props.iconSize,
+    className = _defaultProps$props.className,
+    style = _defaultProps$props.style,
+    activeAvatar = _defaultProps$props.activeAvatar,
+    onActiveAvatar = _defaultProps$props.onActiveAvatar,
+    onError = _defaultProps$props.onError,
+    iconClassPrefix = _defaultProps$props.iconClassPrefix,
+    iconFontClassName = _defaultProps$props.iconFontClassName,
+    rest = _objectWithoutProperties(_defaultProps$props, _excluded);
+  var _useState = useState(0),
+    _useState2 = _slicedToArray(_useState, 2),
+    maxSum = _useState2[0],
+    setMaxSum = _useState2[1]; // avatarGroup里的avatar的个数
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    showMax = _useState4[0],
+    setShowMax = _useState4[1]; // 是否显示的最大头像个数
+  var _useState5 = useState(1),
+    _useState6 = _slicedToArray(_useState5, 2),
+    avatarIndex = _useState6[0],
+    setAvatarIndex = _useState6[1]; // avatar的索引
+  var avatarRef = useRef(null);
+  var parent = useContext(AvatarContext);
+  var b = cn('avatar');
+  var classes = classNames((_classNames = {}, _defineProperty(_classNames, "nut-avatar-".concat(size || (parent === null || parent === void 0 ? void 0 : (_parent$propAvatarGro = parent.propAvatarGroup) === null || _parent$propAvatarGro === void 0 ? void 0 : _parent$propAvatarGro.size) || 'normal'), true), _defineProperty(_classNames, "nut-avatar-".concat(shape || (parent === null || parent === void 0 ? void 0 : (_parent$propAvatarGro2 = parent.propAvatarGroup) === null || _parent$propAvatarGro2 === void 0 ? void 0 : _parent$propAvatarGro2.shape) || 'round'), true), _classNames));
+  var cls = classNames(b(''), classes, className);
+  var sizeValue = ['large', 'normal', 'small'];
+  var styles = _objectSpread({
+    width: sizeValue.indexOf(size) > -1 ? '' : "".concat(size, "px"),
+    height: sizeValue.indexOf(size) > -1 ? '' : "".concat(size, "px"),
+    backgroundColor: "".concat(bgColor),
+    color: "".concat(color),
+    marginLeft: avatarIndex !== 1 && parent !== null && parent !== void 0 && (_parent$propAvatarGro3 = parent.propAvatarGroup) !== null && _parent$propAvatarGro3 !== void 0 && _parent$propAvatarGro3.span ? "".concat(parent === null || parent === void 0 ? void 0 : (_parent$propAvatarGro4 = parent.propAvatarGroup) === null || _parent$propAvatarGro4 === void 0 ? void 0 : _parent$propAvatarGro4.span, "px") : '',
+    zIndex: (parent === null || parent === void 0 ? void 0 : (_parent$propAvatarGro5 = parent.propAvatarGroup) === null || _parent$propAvatarGro5 === void 0 ? void 0 : _parent$propAvatarGro5.zIndex) === 'right' ? "".concat(Math.abs(maxSum - avatarIndex)) : ''
+  }, style);
+  var maxStyles = {
+    backgroundColor: "".concat(parent === null || parent === void 0 ? void 0 : (_parent$propAvatarGro6 = parent.propAvatarGroup) === null || _parent$propAvatarGro6 === void 0 ? void 0 : _parent$propAvatarGro6.maxBgColor),
+    color: "".concat(parent === null || parent === void 0 ? void 0 : (_parent$propAvatarGro7 = parent.propAvatarGroup) === null || _parent$propAvatarGro7 === void 0 ? void 0 : _parent$propAvatarGro7.maxColor)
+  };
+  var iconStyles = icon || '';
+  useEffect(function () {
+    var _parent$avatarGroupRe;
+    var avatarChildren = parent === null || parent === void 0 ? void 0 : (_parent$avatarGroupRe = parent.avatarGroupRef) === null || _parent$avatarGroupRe === void 0 ? void 0 : _parent$avatarGroupRe.current.children;
+    if (avatarChildren) {
+      avatarLength(avatarChildren);
+    }
+  }, []);
+  var avatarLength = function avatarLength(children) {
+    var _avatarRef$current, _avatarRef$current$da, _parent$propAvatarGro8;
+    for (var i = 0; i < children.length; i++) {
+      if (children[i] && children[i].classList && children[i].classList[0] === 'nut-avatar') {
+        children[i].setAttribute('data-index', i + 1);
+      }
+    }
+    var index = Number(avatarRef === null || avatarRef === void 0 ? void 0 : (_avatarRef$current = avatarRef.current) === null || _avatarRef$current === void 0 ? void 0 : (_avatarRef$current$da = _avatarRef$current.dataset) === null || _avatarRef$current$da === void 0 ? void 0 : _avatarRef$current$da.index);
+    var maxCount = parent === null || parent === void 0 ? void 0 : (_parent$propAvatarGro8 = parent.propAvatarGroup) === null || _parent$propAvatarGro8 === void 0 ? void 0 : _parent$propAvatarGro8.maxCount;
+    setMaxSum(children.length);
+    setAvatarIndex(index);
+    if (index === children.length && index !== maxCount && children.length > maxCount) {
+      setShowMax(true);
+    }
+  };
+  var errorEvent = function errorEvent(e) {
+    if (props.onError) {
+      props.onError(e);
+    }
+  };
+  var clickAvatar = function clickAvatar(e) {
+    activeAvatar && activeAvatar(e);
+    onActiveAvatar && onActiveAvatar(e);
+  };
+  return React__default.createElement(React__default.Fragment, null, (showMax || !(parent !== null && parent !== void 0 && (_parent$propAvatarGro9 = parent.propAvatarGroup) !== null && _parent$propAvatarGro9 !== void 0 && _parent$propAvatarGro9.maxCount) || avatarIndex <= (parent === null || parent === void 0 ? void 0 : (_parent$propAvatarGro10 = parent.propAvatarGroup) === null || _parent$propAvatarGro10 === void 0 ? void 0 : _parent$propAvatarGro10.maxCount)) && React__default.createElement("div", _objectSpread(_objectSpread({
+    className: cls
+  }, rest), {}, {
+    style: !showMax ? styles : maxStyles,
+    onClick: clickAvatar,
+    ref: avatarRef
+  }), (!(parent !== null && parent !== void 0 && (_parent$propAvatarGro11 = parent.propAvatarGroup) !== null && _parent$propAvatarGro11 !== void 0 && _parent$propAvatarGro11.maxCount) || avatarIndex <= (parent === null || parent === void 0 ? void 0 : (_parent$propAvatarGro12 = parent.propAvatarGroup) === null || _parent$propAvatarGro12 === void 0 ? void 0 : _parent$propAvatarGro12.maxCount)) && React__default.createElement(React__default.Fragment, null, url && React__default.createElement("img", {
+    className: "avatar-img",
+    src: url,
+    alt: alt,
+    onError: errorEvent
+  }), icon && React__default.createElement(Icon, {
+    classPrefix: iconClassPrefix,
+    fontClassName: iconFontClassName,
+    className: "icon",
+    name: iconStyles,
+    size: iconSize
+  }), children && React__default.createElement("span", {
+    className: "text"
+  }, children)), showMax && React__default.createElement("div", {
+    className: "text"
+  }, parent !== null && parent !== void 0 && (_parent$propAvatarGro13 = parent.propAvatarGroup) !== null && _parent$propAvatarGro13 !== void 0 && _parent$propAvatarGro13.maxContent ? parent === null || parent === void 0 ? void 0 : (_parent$propAvatarGro14 = parent.propAvatarGroup) === null || _parent$propAvatarGro14 === void 0 ? void 0 : _parent$propAvatarGro14.maxContent : "+ ".concat(avatarIndex - (parent === null || parent === void 0 ? void 0 : (_parent$propAvatarGro15 = parent.propAvatarGroup) === null || _parent$propAvatarGro15 === void 0 ? void 0 : _parent$propAvatarGro15.maxCount)))));
+};
+Avatar.defaultProps = defaultProps;
+Avatar.displayName = 'NutAvatar';
+export { Avatar as default };

package/dist/esm/AvatarContext-15733596.js

@@ -0,0 +1,3 @@
+import { createContext } from 'react';
+var AvatarContext = createContext({});
+export { AvatarContext as A };

package/dist/esm/AvatarGroup/style/index.js

@@ -0,0 +1,2 @@
+
+import '../../../packages/avatargroup/avatargroup.scss'

package/dist/esm/AvatarGroup.js

@@ -0,0 +1,43 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import React__default, { useRef } from 'react';
+import classNames from 'classnames';
+import { A as AvatarContext } from './AvatarContext-15733596.js';
+import { c as cn } from './bem-3b438e61.js';
+import { useConfig } from './ConfigProvider.js';
+import '@bem-react/classname';
+var defaultProps = {
+  maxContent: '',
+  maxCount: '',
+  maxBgColor: '#eee',
+  maxColor: '#666',
+  size: '',
+  shape: '',
+  span: '-8',
+  zIndex: 'left'
+};
+var AvatarGroup = function AvatarGroup(props) {
+  useConfig();
+  var propAvatarGroup = _objectSpread(_objectSpread({}, defaultProps), props);
+  var className = propAvatarGroup.className,
+    style = propAvatarGroup.style,
+    children = propAvatarGroup.children;
+  var avatarGroupRef = useRef(null);
+  var b = cn('avatar-group');
+  var cls = classNames(b(''), className);
+  var parentAvatar = {
+    propAvatarGroup: propAvatarGroup,
+    avatarGroupRef: avatarGroupRef
+  };
+  return React__default.createElement(AvatarContext.Provider, {
+    value: parentAvatar
+  }, React__default.createElement("div", {
+    className: cls,
+    style: style,
+    ref: avatarGroupRef
+  }, children));
+};
+AvatarGroup.defaultProps = defaultProps;
+AvatarGroup.displayName = 'NutAvatarGroup';
+export { AvatarGroup as default };

package/dist/esm/BackTop/style/index.js

@@ -0,0 +1,2 @@
+import '../../Icon/style'
+import '../../../packages/backtop/backtop.scss'