zent
Version:
一套前端设计语言和基于React的实现
46 lines (45 loc) • 2.86 kB
JavaScript
import { __assign, __extends } from "tslib";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Component } from 'react';
import cx from 'classnames';
import Pop from '../pop';
import Icon from '../icon';
var BlockHeader = (function (_super) {
__extends(BlockHeader, _super);
function BlockHeader() {
return _super !== null && _super.apply(this, arguments) || this;
}
BlockHeader.prototype.renderTitle = function () {
var _a = this.props, title = _a.title, type = _a.type;
return (_jsx("div", __assign({ className: cx('zent-block-header__title', {
'zent-block-header__title-ribbon': type === 'ribbon',
}), "data-zv": '10.0.17' }, { children: _jsx("h3", __assign({ "data-zv": '10.0.17' }, { children: title }), void 0) }), void 0));
};
BlockHeader.prototype.renderTooltip = function () {
var _a = this.props, tooltip = _a.tooltip, position = _a.position;
return (_jsx("div", __assign({ className: "zent-block-header__pop", "data-zv": '10.0.17' }, { children: _jsx(Pop, __assign({ trigger: "hover", centerArrow: true, position: position, content: _jsx("div", __assign({ className: "zent-block-header__tooltip", "data-zv": '10.0.17' }, { children: tooltip }), void 0) }, { children: _jsx(Icon, { className: "zent-block-header__pop-help-icon", type: "help-circle" }, void 0) }), void 0) }), void 0));
};
BlockHeader.prototype.renderLeftContent = function () {
var leftContent = this.props.leftContent;
return (_jsx("div", __assign({ className: cx('zent-block-header__content', 'zent-block-header__content-left'), "data-zv": '10.0.17' }, { children: leftContent }), void 0));
};
BlockHeader.prototype.renderRightContent = function () {
var rightContent = this.props.rightContent;
return (_jsx("div", __assign({ className: cx('zent-block-header__content', 'zent-block-header__content-right'), "data-zv": '10.0.17' }, { children: rightContent }), void 0));
};
BlockHeader.prototype.render = function () {
var _a = this.props, leftContent = _a.leftContent, rightContent = _a.rightContent, tooltip = _a.tooltip, className = _a.className, type = _a.type;
return (_jsxs("div", __assign({ className: cx('zent-block-header', className, {
'zent-block-header-ribbon': type === 'ribbon',
'zent-block-header-minimum': type === 'minimum',
}), "data-zv": '10.0.17' }, { children: [this.renderTitle(), tooltip && this.renderTooltip(), leftContent && this.renderLeftContent(), rightContent && this.renderRightContent()] }), void 0));
};
BlockHeader.defaultProps = {
className: '',
position: 'top-right',
type: 'ribbon',
};
return BlockHeader;
}(Component));
export { BlockHeader };
export default BlockHeader;