180 lines
5.5 KiB
JavaScript
180 lines
5.5 KiB
JavaScript
import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
|
|
import _defineProperty from 'babel-runtime/helpers/defineProperty';
|
|
import _extends from 'babel-runtime/helpers/extends';
|
|
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
|
|
import _createClass from 'babel-runtime/helpers/createClass';
|
|
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
|
|
import _inherits from 'babel-runtime/helpers/inherits';
|
|
import React, { Component } from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import ReactDOM from 'react-dom';
|
|
import Animate from 'rc-animate';
|
|
import createChainedFunction from 'rc-util/es/createChainedFunction';
|
|
import classnames from 'classnames';
|
|
import Notice from './Notice';
|
|
|
|
var seed = 0;
|
|
var now = Date.now();
|
|
|
|
function getUuid() {
|
|
return 'rcNotification_' + now + '_' + seed++;
|
|
}
|
|
|
|
var Notification = function (_Component) {
|
|
_inherits(Notification, _Component);
|
|
|
|
function Notification() {
|
|
var _ref;
|
|
|
|
var _temp, _this, _ret;
|
|
|
|
_classCallCheck(this, Notification);
|
|
|
|
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
|
|
args[_key] = arguments[_key];
|
|
}
|
|
|
|
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = Notification.__proto__ || Object.getPrototypeOf(Notification)).call.apply(_ref, [this].concat(args))), _this), _this.state = {
|
|
notices: []
|
|
}, _this.add = function (notice) {
|
|
var key = notice.key = notice.key || getUuid();
|
|
var maxCount = _this.props.maxCount;
|
|
|
|
_this.setState(function (previousState) {
|
|
var notices = previousState.notices;
|
|
var noticeIndex = notices.map(function (v) {
|
|
return v.key;
|
|
}).indexOf(key);
|
|
var updatedNotices = notices.concat();
|
|
if (noticeIndex !== -1) {
|
|
updatedNotices.splice(noticeIndex, 1, notice);
|
|
} else {
|
|
if (maxCount && notices.length >= maxCount) {
|
|
notice.updateKey = updatedNotices[0].updateKey || updatedNotices[0].key;
|
|
updatedNotices.shift();
|
|
}
|
|
updatedNotices.push(notice);
|
|
}
|
|
return {
|
|
notices: updatedNotices
|
|
};
|
|
});
|
|
}, _this.remove = function (key) {
|
|
_this.setState(function (previousState) {
|
|
return {
|
|
notices: previousState.notices.filter(function (notice) {
|
|
return notice.key !== key;
|
|
})
|
|
};
|
|
});
|
|
}, _temp), _possibleConstructorReturn(_this, _ret);
|
|
}
|
|
|
|
_createClass(Notification, [{
|
|
key: 'getTransitionName',
|
|
value: function getTransitionName() {
|
|
var props = this.props;
|
|
var transitionName = props.transitionName;
|
|
if (!transitionName && props.animation) {
|
|
transitionName = props.prefixCls + '-' + props.animation;
|
|
}
|
|
return transitionName;
|
|
}
|
|
}, {
|
|
key: 'render',
|
|
value: function render() {
|
|
var _this2 = this,
|
|
_className;
|
|
|
|
var props = this.props;
|
|
var notices = this.state.notices;
|
|
|
|
var noticeNodes = notices.map(function (notice, index) {
|
|
var update = Boolean(index === notices.length - 1 && notice.updateKey);
|
|
var key = notice.updateKey ? notice.updateKey : notice.key;
|
|
var onClose = createChainedFunction(_this2.remove.bind(_this2, notice.key), notice.onClose);
|
|
return React.createElement(
|
|
Notice,
|
|
_extends({
|
|
prefixCls: props.prefixCls
|
|
}, notice, {
|
|
key: key,
|
|
update: update,
|
|
onClose: onClose,
|
|
onClick: notice.onClick,
|
|
closeIcon: props.closeIcon
|
|
}),
|
|
notice.content
|
|
);
|
|
});
|
|
var className = (_className = {}, _defineProperty(_className, props.prefixCls, 1), _defineProperty(_className, props.className, !!props.className), _className);
|
|
return React.createElement(
|
|
'div',
|
|
{ className: classnames(className), style: props.style },
|
|
React.createElement(
|
|
Animate,
|
|
{ transitionName: this.getTransitionName() },
|
|
noticeNodes
|
|
)
|
|
);
|
|
}
|
|
}]);
|
|
|
|
return Notification;
|
|
}(Component);
|
|
|
|
Notification.propTypes = {
|
|
prefixCls: PropTypes.string,
|
|
transitionName: PropTypes.string,
|
|
animation: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
|
|
style: PropTypes.object,
|
|
maxCount: PropTypes.number,
|
|
closeIcon: PropTypes.node
|
|
};
|
|
Notification.defaultProps = {
|
|
prefixCls: 'rc-notification',
|
|
animation: 'fade',
|
|
style: {
|
|
top: 65,
|
|
left: '50%'
|
|
}
|
|
};
|
|
|
|
|
|
Notification.newInstance = function newNotificationInstance(properties, callback) {
|
|
var _ref2 = properties || {},
|
|
getContainer = _ref2.getContainer,
|
|
props = _objectWithoutProperties(_ref2, ['getContainer']);
|
|
|
|
var div = document.createElement('div');
|
|
if (getContainer) {
|
|
var root = getContainer();
|
|
root.appendChild(div);
|
|
} else {
|
|
document.body.appendChild(div);
|
|
}
|
|
var called = false;
|
|
function ref(notification) {
|
|
if (called) {
|
|
return;
|
|
}
|
|
called = true;
|
|
callback({
|
|
notice: function notice(noticeProps) {
|
|
notification.add(noticeProps);
|
|
},
|
|
removeNotice: function removeNotice(key) {
|
|
notification.remove(key);
|
|
},
|
|
|
|
component: notification,
|
|
destroy: function destroy() {
|
|
ReactDOM.unmountComponentAtNode(div);
|
|
div.parentNode.removeChild(div);
|
|
}
|
|
});
|
|
}
|
|
ReactDOM.render(React.createElement(Notification, _extends({}, props, { ref: ref })), div);
|
|
};
|
|
|
|
export default Notification; |