tntd
Version:
tntd是基于 TNT Design 设计体系的 React UI 组件库,主要用于研发企业级中后台产品。
98 lines (96 loc) • 4.05 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));
};