1 | 'use strict';
|
2 |
|
3 | exports.__esModule = true;
|
4 |
|
5 | var _extends2 = require('babel-runtime/helpers/extends');
|
6 |
|
7 | var _extends3 = _interopRequireDefault(_extends2);
|
8 |
|
9 | var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
|
10 |
|
11 | var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
|
12 |
|
13 | var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
|
14 |
|
15 | var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
|
16 |
|
17 | var _inherits2 = require('babel-runtime/helpers/inherits');
|
18 |
|
19 | var _inherits3 = _interopRequireDefault(_inherits2);
|
20 |
|
21 | var _class, _temp2;
|
22 |
|
23 | var _react = require('react');
|
24 |
|
25 | var _react2 = _interopRequireDefault(_react);
|
26 |
|
27 | var _propTypes = require('prop-types');
|
28 |
|
29 | var _propTypes2 = _interopRequireDefault(_propTypes);
|
30 |
|
31 | var _classnames = require('classnames');
|
32 |
|
33 | var _classnames2 = _interopRequireDefault(_classnames);
|
34 |
|
35 | var _configProvider = require('../config-provider');
|
36 |
|
37 | var _configProvider2 = _interopRequireDefault(_configProvider);
|
38 |
|
39 | var _icon = require('../icon');
|
40 |
|
41 | var _icon2 = _interopRequireDefault(_icon);
|
42 |
|
43 | var _util = require('../util');
|
44 |
|
45 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
46 |
|
47 |
|
48 |
|
49 |
|
50 | var Avatar = (_temp2 = _class = function (_Component) {
|
51 | (0, _inherits3.default)(Avatar, _Component);
|
52 |
|
53 | function Avatar() {
|
54 | var _temp, _this, _ret;
|
55 |
|
56 | (0, _classCallCheck3.default)(this, Avatar);
|
57 |
|
58 | for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
|
59 | args[_key] = arguments[_key];
|
60 | }
|
61 |
|
62 | return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, _Component.call.apply(_Component, [this].concat(args))), _this), _this.state = {
|
63 | isImgExist: true
|
64 | }, _this.handleImgLoadError = function () {
|
65 | var onError = _this.props.onError;
|
66 |
|
67 | var errorFlag = onError ? onError() : undefined;
|
68 | if (errorFlag !== false) {
|
69 | _this.setState({ isImgExist: false });
|
70 | }
|
71 | }, _this.getIconSize = function (avatarSize) {
|
72 | return typeof avatarSize === 'number' ? avatarSize / 2 : avatarSize;
|
73 | }, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
|
74 | }
|
75 |
|
76 | Avatar.prototype.componentDidUpdate = function componentDidUpdate(prevProps) {
|
77 | if (prevProps.src !== this.props.src) {
|
78 |
|
79 | this.setState({ isImgExist: true });
|
80 | }
|
81 | };
|
82 |
|
83 | Avatar.prototype.render = function render() {
|
84 | var _classNames;
|
85 |
|
86 | var _props = this.props,
|
87 | prefix = _props.prefix,
|
88 | className = _props.className,
|
89 | style = _props.style,
|
90 | size = _props.size,
|
91 | icon = _props.icon,
|
92 | alt = _props.alt,
|
93 | srcSet = _props.srcSet,
|
94 | shape = _props.shape,
|
95 | src = _props.src;
|
96 | var isImgExist = this.state.isImgExist;
|
97 | var children = this.props.children;
|
98 |
|
99 |
|
100 | var others = _util.obj.pickOthers(Avatar.propTypes, this.props);
|
101 |
|
102 | var cls = (0, _classnames2.default)((_classNames = {}, _classNames[prefix + 'avatar'] = true, _classNames[prefix + 'avatar-' + shape] = !!shape, _classNames[prefix + 'avatar-image'] = src && isImgExist, _classNames[prefix + 'avatar-' + size] = typeof size === 'string', _classNames), className);
|
103 |
|
104 | var sizeStyle = typeof size === 'number' ? {
|
105 | width: size,
|
106 | height: size,
|
107 | lineHeight: size + 'px',
|
108 | fontSize: icon ? size / 2 : 18
|
109 | } : {};
|
110 |
|
111 | var iconSize = this.getIconSize(size);
|
112 | if (src) {
|
113 | if (isImgExist) {
|
114 | children = _react2.default.createElement('img', { src: src, srcSet: srcSet, onError: this.handleImgLoadError, alt: alt });
|
115 | } else {
|
116 | children = _react2.default.createElement(_icon2.default, { type: 'picture', size: iconSize });
|
117 | }
|
118 | } else if (typeof icon === 'string') {
|
119 | children = _react2.default.createElement(_icon2.default, { type: icon, size: iconSize });
|
120 | } else if (icon) {
|
121 | var newIconSize = 'size' in icon.props ? icon.props.size : iconSize;
|
122 | children = _react2.default.cloneElement(icon, { size: newIconSize });
|
123 | }
|
124 |
|
125 | return _react2.default.createElement(
|
126 | 'span',
|
127 | (0, _extends3.default)({ className: cls, style: (0, _extends3.default)({}, sizeStyle, style) }, others),
|
128 | children
|
129 | );
|
130 | };
|
131 |
|
132 | return Avatar;
|
133 | }(_react.Component), _class.propTypes = {
|
134 | prefix: _propTypes2.default.string,
|
135 | children: _propTypes2.default.any,
|
136 | className: _propTypes2.default.string,
|
137 | |
138 |
|
139 |
|
140 |
|
141 | size: _propTypes2.default.oneOfType([_propTypes2.default.oneOf(['small', 'medium', 'large']), _propTypes2.default.number]),
|
142 | |
143 |
|
144 |
|
145 |
|
146 | shape: _propTypes2.default.oneOf(['circle', 'square']),
|
147 | |
148 |
|
149 |
|
150 | icon: _propTypes2.default.oneOfType([_propTypes2.default.node, _propTypes2.default.string]),
|
151 | |
152 |
|
153 |
|
154 | src: _propTypes2.default.string,
|
155 | |
156 |
|
157 |
|
158 | onError: _propTypes2.default.func,
|
159 | |
160 |
|
161 |
|
162 | alt: _propTypes2.default.string,
|
163 | |
164 |
|
165 |
|
166 | srcSet: _propTypes2.default.string
|
167 | }, _class.defaultProps = {
|
168 | prefix: 'next-',
|
169 | size: 'medium',
|
170 | shape: 'circle'
|
171 | }, _temp2);
|
172 | Avatar.displayName = 'Avatar';
|
173 | exports.default = _configProvider2.default.config(Avatar);
|
174 | module.exports = exports['default']; |
\ | No newline at end of file |