zent
Version:
一套前端设计语言和基于React的实现
77 lines (76 loc) • 2.83 kB
JavaScript
import { __assign, __extends, __rest } from "tslib";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import cx from 'classnames';
import { PureComponent } from 'react';
import { Progress } from '../progress';
import AlertItem from './components/AlertItem';
import omit from '../utils/omit';
var OmitChildProp = ['outline', 'closed', 'onClose'];
var OmitDivAttr = [
'title',
'description',
'loading',
'closable',
'closed',
'onClose',
'closeContent',
'closeIconColor',
'icon',
'extraContent',
];
var Alert = (function (_super) {
__extends(Alert, _super);
function Alert() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.state = {
closed: false,
};
_this.onCloseHandler = function () {
if (!_this.isControlled) {
_this.setState({
closed: true,
});
}
_this.props.onClose && _this.props.onClose();
};
return _this;
}
Object.defineProperty(Alert.prototype, "isControlled", {
get: function () {
return 'closed' in this.props;
},
enumerable: false,
configurable: true
});
Object.defineProperty(Alert.prototype, "closed", {
get: function () {
return this.isControlled ? this.props.closed : this.state.closed;
},
enumerable: false,
configurable: true
});
Alert.prototype.render = function () {
var _a;
if (this.closed) {
return null;
}
var _b = omit(this.props, OmitDivAttr), className = _b.className, type = _b.type, outline = _b.outline, bordered = _b.bordered, progress = _b.progress, restDivAttrs = __rest(_b, ["className", "type", "outline", "bordered", "progress"]);
var restProps = omit(this.props, OmitChildProp);
var containerCls = cx('zent-alert', "zent-alert-style-" + type, className, (_a = {},
_a['zent-alert-outline'] = outline,
_a['zent-alert--borderless'] = !bordered,
_a));
return (_jsxs("div", __assign({ className: containerCls }, restDivAttrs, { "data-zv": '10.0.17' }, { children: [!!progress && (_jsx(Progress, { className: "zent-alert__progress", percent: progress, showInfo: false, strokeWidth: 2 }, void 0)), _jsx(AlertItem, __assign({}, restProps, { onAlertItemClose: this.onCloseHandler }, { children: this.props.children }), void 0)] }), void 0));
};
Alert.highlightClassName = 'zent-alert-item-content__highlight';
Alert.defaultProps = {
type: 'info',
bordered: false,
loading: false,
outline: false,
closable: false,
};
return Alert;
}(PureComponent));
export { Alert };
export default Alert;