Implement ColumnGroup

examples/jsx.js

@@ -4,7 +4,7 @@ const ReactDOM = require('react-dom');
 const Table = require('rc-table');
 require('rc-table/assets/index.less');
 
-const Column = Table.Column;
+const { ColumnGroup, Column } = Table;
 
 const data = [
   { a: '123', key: '1' },
@@ -16,19 +16,21 @@ ReactDOM.render(
   <div>
     <h2>JSX table</h2>
     <Table data={data}>
-      <Column
-        title="title1"
-        dataIndex="a"
-        colKey="a"
-        width={100}
-      />
-      <Column
-        id="123"
-        title="title2"
-        dataIndex="b"
-        colKey="b"
-        width={100}
-      />
+      <ColumnGroup title="Bazinga">
+        <Column
+          title="title1"
+          dataIndex="a"
+          colKey="a"
+          width={100}
+        />
+        <Column
+          id="123"
+          title="title2"
+          dataIndex="b"
+          colKey="b"
+          width={100}
+        />
+      </ColumnGroup>
       <Column
         title="title3"
         dataIndex="c"

src/ColumnGroup.jsx

@@ -0,0 +1,7 @@
+import { Component, PropTypes } from 'react';
+
+export default class ColumnGroup extends Component {
+  static propTypes = {
+    title: PropTypes.node,
+  }
+}

src/ColumnManager.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import ColumnGroup from './ColumnGroup';
 
 export default class ColumnManager {
   _cached = {}
@@ -141,6 +142,14 @@ export default class ColumnManager {
   }
 
   _normalize(elements) {
-    return React.Children.map(elements, element => element.props);
+    const columns = [];
+    React.Children.forEach(elements, element => {
+      const column = { ...element.props };
+      if (element.type === ColumnGroup) {
+        column.children = React.Children.map(column.children, child => child.props);
+      }
+      columns.push(column);
+    });
+    return columns;
   }
 }

src/index.js

@@ -1,6 +1,8 @@
 const Table = require('./Table');
 const Column = require('./Column');
+const ColumnGroup = require('./ColumnGroup');
 
 Table.Column = Column;
+Table.ColumnGroup = ColumnGroup;
 
 module.exports = Table;