2016-02-23 17:34:46 +08:00
|
|
|
import React, { Children, cloneElement } from 'react';
|
2015-11-24 20:03:57 +08:00
|
|
|
import classNames from 'classnames';
|
2015-10-27 23:52:17 +08:00
|
|
|
|
2016-03-28 23:21:47 +08:00
|
|
|
export default class Row extends React.Component {
|
|
|
|
static defaultProps = {
|
|
|
|
gutter: 0,
|
|
|
|
}
|
|
|
|
static propTypes = {
|
2015-10-27 23:52:17 +08:00
|
|
|
type: React.PropTypes.string,
|
|
|
|
align: React.PropTypes.string,
|
|
|
|
justify: React.PropTypes.string,
|
2015-10-28 18:04:56 +08:00
|
|
|
className: React.PropTypes.string,
|
2015-10-27 23:52:17 +08:00
|
|
|
children: React.PropTypes.node,
|
2016-02-23 17:34:46 +08:00
|
|
|
gutter: React.PropTypes.number,
|
2016-03-28 23:21:47 +08:00
|
|
|
}
|
2015-10-27 23:52:17 +08:00
|
|
|
render() {
|
2016-02-23 17:34:46 +08:00
|
|
|
const { type, justify, align, className, gutter, style, children, ...others } = this.props;
|
2015-11-24 20:03:57 +08:00
|
|
|
const classes = classNames({
|
2016-06-06 11:40:54 +08:00
|
|
|
'ant-row': !type,
|
|
|
|
[`ant-row-${type}`]: type,
|
|
|
|
[`ant-row-${type}-${justify}`]: justify,
|
|
|
|
[`ant-row-${type}-${align}`]: align,
|
2015-10-28 18:04:56 +08:00
|
|
|
[className]: className,
|
|
|
|
});
|
2016-02-23 17:34:46 +08:00
|
|
|
const rowStyle = gutter > 0 ? {
|
|
|
|
marginLeft: gutter / -2,
|
|
|
|
marginRight: gutter / -2,
|
|
|
|
...style,
|
|
|
|
} : style;
|
2016-03-10 09:35:09 +08:00
|
|
|
const cols = Children.map(children, col => {
|
2016-05-20 13:55:00 +08:00
|
|
|
if (!col) return null;
|
2016-03-10 09:35:09 +08:00
|
|
|
|
|
|
|
return cloneElement(col, {
|
2016-02-23 17:34:46 +08:00
|
|
|
style: gutter > 0 ? {
|
|
|
|
paddingLeft: gutter / 2,
|
|
|
|
paddingRight: gutter / 2,
|
2016-05-11 09:32:33 +08:00
|
|
|
...col.props.style,
|
2016-02-25 18:03:48 +08:00
|
|
|
} : col.props.style,
|
2016-03-10 09:35:09 +08:00
|
|
|
});
|
|
|
|
});
|
2016-02-23 17:34:46 +08:00
|
|
|
return <div {...others} className={classes} style={rowStyle}>{cols}</div>;
|
2016-03-28 23:21:47 +08:00
|
|
|
}
|
|
|
|
}
|