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