@pisell/layout
Version:
基于 Fusion 设计系统的自然布局体系
57 lines • 2.1 kB
JavaScript
import _extends from "@babel/runtime/helpers/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
var _excluded = ["children", "className", "mode", "width", "style"],
_excluded2 = ["style"];
import React, { cloneElement, useContext, isValidElement, Children } from 'react';
import classNames from 'classnames';
import Context from "../common/context";
import Block from "../block";
import { wrapUnit } from "../utils";
var PageNav = function PageNav(props) {
var _classNames;
var children = props.children,
className = props.className,
mode = props.mode,
width = props.width,
_props$style = props.style,
style = _props$style === void 0 ? {} : _props$style,
others = _objectWithoutPropertiesLoose(props, _excluded);
var _useContext = useContext(Context),
prefix = _useContext.prefix;
var navCls = classNames(className, (_classNames = {}, _classNames[prefix + "page-nav"] = true, _classNames[prefix + "bg--" + mode] = !!mode, _classNames));
var navInnerCls = classNames(prefix + "page-nav-inner");
var newChildren = Children.map(children, function (child) {
var _ref = (child === null || child === void 0 ? void 0 : child.props) || {},
childStyle = _ref.style,
otherChildProps = _objectWithoutPropertiesLoose(_ref, _excluded2);
if ( /*#__PURE__*/isValidElement(child)) {
return /*#__PURE__*/cloneElement(child, _extends({}, otherChildProps, {
span: 1,
style: _extends({}, childStyle)
}));
} else {
return /*#__PURE__*/React.createElement(Block, {
span: 1
}, child);
}
});
var newStyle = _extends({
width: wrapUnit(width)
}, style);
if (!children) {
return null;
}
return /*#__PURE__*/React.createElement("nav", _extends({
className: navCls,
style: newStyle
}, others), /*#__PURE__*/React.createElement("div", {
className: navInnerCls
}, newChildren));
};
PageNav.displayName = 'Nav';
PageNav.typeMark = 'Nav';
PageNav.defaultProps = {
width: 200,
mode: 'transparent'
};
export default PageNav;