tntd
Version:
tntd是基于 TNT Design 设计体系的 React UI 组件库，主要用于研发企业级中后台产品。
57 lines (56 loc) • 3.94 kB
JavaScript
;
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _react = _interopRequireWildcard(require("react"));
var _styledComponents = _interopRequireDefault(require("styled-components"));
var _HeaderActions = _interopRequireDefault(require("../HeaderActions"));
var _AppList = _interopRequireDefault(require("../AppList"));
var _Logo = _interopRequireDefault(require("./Logo"));
var _templateObject, _templateObject2;
/**
* @file Layout header
* @author zhangyou
*/
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
var Header = _styledComponents["default"].div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n position: sticky;\n top: 0;\n height: ", ";\n display: flex;\n color: #fff;\n background: #fff;\n z-index: 201;\n .isInIframe.noAppList &,\n .isEmptyLayout & {\n display: none;\n }\n .tnt-themeS1 & {\n background: #323b4a;\n }\n padding-right: 20px;\n box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.1);\n transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1),\n -webkit-box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n\n .paas-header-actions {\n li {\n .tnt-themeS1 & {\n color: rgba(255, 255, 255, 0.85);\n }\n }\n }\n"])), function (props) {
return "".concat(props.theme.headerHeight, "px");
});
var Content = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n flex: 1;\n .isInIframe & {\n display: none;\n }\n"])));
var _default = exports["default"] = function _default(props) {
var logo = props.logo,
name = props.name,
enName = props.enName,
language = props.language,
selectedAppKey = props.selectedAppKey,
appList = props.appList,
onLogoClick = props.onLogoClick,
onAppChange = props.onAppChange,
extraActions = props.extraActions;
var config = Object.assign({
application: true
}, props.config);
var headerRef = (0, _react.useRef)();
return _react["default"].createElement(Header, {
ref: headerRef
}, _react["default"].createElement(_Logo["default"], {
language: language,
logo: logo,
name: name,
enName: enName,
onClick: onLogoClick
}), appList && _react["default"].createElement(_AppList["default"], {
items: appList,
selectedKey: selectedAppKey,
onChange: onAppChange
}), _react["default"].createElement(Content, null, props.children), _react["default"].createElement(_HeaderActions["default"], Object.assign({}, props, {
config: config,
headerRef: headerRef,
className: "paas-header-actions"
}), extraActions));
};