mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-06-07 17:44:35 +08:00
Code Issues Actions 18 Packages Projects Releases Wiki Activity

upgrade eslint-config-airbnb version and fix some problems

Browse Source
This commit is contained in:
afc163 2016-04-29 12:13:27 +08:00
parent ce123137e3
commit 03cb74ead5
51 changed files with 376 additions and 364 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.eslintrc.js
View File

@ -30,6 +30,8 @@ const eslintrc = {
'react/sort-comp': 0, 'react/sort-comp': 0,
'react/prop-types': 0, 'react/prop-types': 0,
'react/jsx-closing-bracket-location': 0, 'react/jsx-closing-bracket-location': 0,
'react/jsx-first-prop-new-line': 0,
'import/no-unresolved': 0,
'no-param-reassign': 0, 'no-param-reassign': 0,
'no-return-assign': 0, 'no-return-assign': 0,
'max-len': 0, 'max-len': 0,

2
components/alert/demo/close-text.md
View File

@ -9,6 +9,6 @@ title: 自定义关闭
import { Alert } from 'antd'; import { Alert } from 'antd';
ReactDOM.render( ReactDOM.render(
<Alert message="消息提示的文案" type="info" closeText="不再提醒" /> <Alert message="消息提示的文案" type="info" closeText="不再提醒" />
, mountNode); , mountNode);
```` ````

93
components/button/demo/button-group.md
View File

@ -12,55 +12,54 @@ import { Button, Icon } from 'antd';
const ButtonGroup = Button.Group; const ButtonGroup = Button.Group;
ReactDOM.render(<div> ReactDOM.render(<div>
<h4>基本组合</h4> <h4>基本组合</h4>
<ButtonGroup> <ButtonGroup>
<Button type="primary">确定</Button> <Button type="primary">确定</Button>
<Button type="primary">取消</Button> <Button type="primary">取消</Button>
</ButtonGroup> </ButtonGroup>
<ButtonGroup> <ButtonGroup>
<Button disabled>左</Button> <Button disabled>左</Button>
<Button disabled>中</Button> <Button disabled>中</Button>
<Button disabled>右</Button> <Button disabled>右</Button>
</ButtonGroup> </ButtonGroup>
<ButtonGroup> <ButtonGroup>
<Button type="primary">左</Button> <Button type="primary">左</Button>
<Button type="ghost">中</Button> <Button type="ghost">中</Button>
<Button type="ghost">中</Button> <Button type="ghost">中</Button>
<Button>右</Button> <Button>右</Button>
</ButtonGroup> </ButtonGroup>
<h4>带图标按钮组合</h4> <h4>带图标按钮组合</h4>
<ButtonGroup> <ButtonGroup>
<Button type="primary"> <Button type="primary">
<Icon type="left" />后退 <Icon type="left" />后退
</Button> </Button>
<Button type="primary"> <Button type="primary">
前进<Icon type="right" /> 前进<Icon type="right" />
</Button> </Button>
</ButtonGroup> </ButtonGroup>
<ButtonGroup> <ButtonGroup>
<Button type="primary" icon="cloud" /> <Button type="primary" icon="cloud" />
<Button type="primary" icon="cloud-download" /> <Button type="primary" icon="cloud-download" />
</ButtonGroup> </ButtonGroup>
<h4>尺寸</h4> <h4>尺寸</h4>
<ButtonGroup size="large"> <ButtonGroup size="large">
<Button type="ghost">大</Button> <Button type="ghost">大</Button>
<Button type="ghost">大</Button> <Button type="ghost">大</Button>
<Button type="ghost">大</Button> <Button type="ghost">大</Button>
</ButtonGroup> </ButtonGroup>
<ButtonGroup> <ButtonGroup>
<Button type="ghost">默认</Button> <Button type="ghost">默认</Button>
<Button type="ghost">默认</Button> <Button type="ghost">默认</Button>
<Button type="ghost">默认</Button> <Button type="ghost">默认</Button>
</ButtonGroup> </ButtonGroup>
<ButtonGroup size="small"> <ButtonGroup size="small">
<Button type="ghost">小</Button> <Button type="ghost">小</Button>
<Button type="ghost">小</Button> <Button type="ghost">小</Button>
<Button type="ghost">小</Button> <Button type="ghost">小</Button>
</ButtonGroup> </ButtonGroup>
</div> </div>, mountNode);
, mountNode);
```` ````
<style> <style>

14
components/calendar/Header.jsx
View File

@ -40,13 +40,13 @@ export default class Header extends React.Component {
return ( return (
<Select <Select
style={{ width: 75 }} style={{ width: 75 }}
size={ fullscreen ? null : 'small' } size={fullscreen ? null : 'small'}
dropdownMatchSelectWidth={false} dropdownMatchSelectWidth={false}
dropdownMenuStyle={{ minWidth: 103 }} dropdownMenuStyle={{ minWidth: 103 }}
className={`${prefixCls}-year-select`} className={`${prefixCls}-year-select`}
onChange={this.onYearChange} onChange={this.onYearChange}
value={String(year)}> value={String(year)}>
{ options } {options}
</Select> </Select>
); );
} }
@ -65,12 +65,12 @@ export default class Header extends React.Component {
<Select <Select
style={{ minWidth: 70 }} style={{ minWidth: 70 }}
dropdownMenuStyle={{ minWidth: 125 }} dropdownMenuStyle={{ minWidth: 125 }}
size={ fullscreen ? null : 'small' } size={fullscreen ? null : 'small'}
dropdownMatchSelectWidth={false} dropdownMatchSelectWidth={false}
className={`${prefixCls}-month-select`} className={`${prefixCls}-month-select`}
value={String(month)} value={String(month)}
onChange={this.onMonthChange}> onChange={this.onMonthChange}>
{ options } {options}
</Select> </Select>
); );
} }
@ -104,9 +104,9 @@ export default class Header extends React.Component {
return ( return (
<div className={`${prefixCls}-header`}> <div className={`${prefixCls}-header`}>
{ yearSelect } {yearSelect}
{ monthSelect } {monthSelect}
{ typeSwitch } {typeSwitch}
</div> </div>
); );
} }

14
components/checkbox/demo/group.md
View File

@ -31,12 +31,12 @@ const optionsWithDisabled = [
]; ];
ReactDOM.render( ReactDOM.render(
<div> <div>
<CheckboxGroup options={plainOptions} defaultValue={['Apple']} onChange={onChange} /> <CheckboxGroup options={plainOptions} defaultValue={['Apple']} onChange={onChange} />
<br /> <br />
<CheckboxGroup options={options} defaultValue={['Pear']} onChange={onChange} /> <CheckboxGroup options={options} defaultValue={['Pear']} onChange={onChange} />
<br /> <br />
<CheckboxGroup options={optionsWithDisabled} disabled defaultValue={['Apple']} onChange={onChange} /> <CheckboxGroup options={optionsWithDisabled} disabled defaultValue={['Apple']} onChange={onChange} />
</div> </div>
, mountNode); , mountNode);
```` ````

2
components/date-picker/demo/time.md
View File

@ -13,6 +13,6 @@ function onChange(value) {
} }
ReactDOM.render( ReactDOM.render(
<DatePicker showTime format="yyyy-MM-dd HH:mm:ss" placeholder="请选择时间" onChange={onChange} /> <DatePicker showTime format="yyyy-MM-dd HH:mm:ss" placeholder="请选择时间" onChange={onChange} />
, mountNode); , mountNode);
```` ````

6
components/form/FormItem.jsx
View File

@ -28,7 +28,7 @@ export default class FormItem extends React.Component {
form: React.PropTypes.object, form: React.PropTypes.object,
} }
_getLayoutClass(colDef) { getLayoutClass(colDef) {
if (!colDef) { if (!colDef) {
return ''; return '';
} }
@ -132,7 +132,7 @@ export default class FormItem extends React.Component {
renderWrapper(children) { renderWrapper(children) {
const wrapperCol = this.props.wrapperCol; const wrapperCol = this.props.wrapperCol;
return ( return (
<div className={this._getLayoutClass(wrapperCol)} key="wrapper"> <div className={this.getLayoutClass(wrapperCol)} key="wrapper">
{children} {children}
</div> </div>
); );
@ -158,7 +158,7 @@ export default class FormItem extends React.Component {
props.required; props.required;
const className = classNames({ const className = classNames({
[this._getLayoutClass(labelCol)]: true, [this.getLayoutClass(labelCol)]: true,
[`${props.prefixCls}-item-required`]: required, [`${props.prefixCls}-item-required`]: required,
}); });

140
components/form/demo/advanced-search-form.md
View File

@ -12,76 +12,76 @@ import { Form, Input, Row, Col, Button, DatePicker } from 'antd';
const FormItem = Form.Item; const FormItem = Form.Item;
ReactDOM.render( ReactDOM.render(
<Form horizontal className="ant-advanced-search-form"> <Form horizontal className="ant-advanced-search-form">
<Row gutter={16}> <Row gutter={16}>
<Col sm={8}> <Col sm={8}>
<FormItem <FormItem
label="搜索名称：" label="搜索名称："
labelCol={{ span: 10 }} labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}> wrapperCol={{ span: 14 }}>
<Input placeholder="请输入搜索名称" /> <Input placeholder="请输入搜索名称" />
</FormItem> </FormItem>
<FormItem <FormItem
label="较长搜索名称：" label="较长搜索名称："
labelCol={{ span: 10 }} labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}> wrapperCol={{ span: 14 }}>
<DatePicker size="default" /> <DatePicker size="default" />
</FormItem> </FormItem>
<FormItem <FormItem
label="搜索名称：" label="搜索名称："
labelCol={{ span: 10 }} labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}> wrapperCol={{ span: 14 }}>
<Input placeholder="请输入搜索名称" /> <Input placeholder="请输入搜索名称" />
</FormItem> </FormItem>
</Col> </Col>
<Col sm={8}> <Col sm={8}>
<FormItem <FormItem
label="搜索名称：" label="搜索名称："
labelCol={{ span: 10 }} labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}> wrapperCol={{ span: 14 }}>
<Input placeholder="请输入搜索名称" /> <Input placeholder="请输入搜索名称" />
</FormItem> </FormItem>
<FormItem <FormItem
label="较长搜索名称：" label="较长搜索名称："
labelCol={{ span: 10 }} labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}> wrapperCol={{ span: 14 }}>
<DatePicker size="default" /> <DatePicker size="default" />
</FormItem> </FormItem>
<FormItem <FormItem
label="搜索名称：" label="搜索名称："
labelCol={{ span: 10 }} labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}> wrapperCol={{ span: 14 }}>
<Input placeholder="请输入搜索名称" /> <Input placeholder="请输入搜索名称" />
</FormItem> </FormItem>
</Col> </Col>
<Col sm={8}> <Col sm={8}>
<FormItem <FormItem
label="搜索名称：" label="搜索名称："
labelCol={{ span: 10 }} labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}> wrapperCol={{ span: 14 }}>
<Input placeholder="请输入搜索名称" /> <Input placeholder="请输入搜索名称" />
</FormItem> </FormItem>
<FormItem <FormItem
label="较长搜索名称：" label="较长搜索名称："
labelCol={{ span: 10 }} labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}> wrapperCol={{ span: 14 }}>
<DatePicker size="default" /> <DatePicker size="default" />
</FormItem> </FormItem>
<FormItem <FormItem
label="搜索名称：" label="搜索名称："
labelCol={{ span: 10 }} labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}> wrapperCol={{ span: 14 }}>
<Input placeholder="请输入搜索名称" /> <Input placeholder="请输入搜索名称" />
</FormItem> </FormItem>
</Col> </Col>
</Row> </Row>
<Row> <Row>
<Col span={12} offset={12} style={{ textAlign: 'right' }}> <Col span={12} offset={12} style={{ textAlign: 'right' }}>
<Button type="primary" htmlType="submit">搜索</Button> <Button type="primary" htmlType="submit">搜索</Button>
<Button>清除条件</Button> <Button>清除条件</Button>
</Col> </Col>
</Row> </Row>
</Form> </Form>
, mountNode); , mountNode);
```` ````

2
components/form/demo/dynamic-form-item.md
View File

@ -59,7 +59,7 @@ let Demo = React.createClass({
}); });
return ( return (
<Form horizontal form={this.props.form}> <Form horizontal form={this.props.form}>
{ formItems } {formItems}
<Form.Item wrapperCol={{ span: 18, offset: 6 }}> <Form.Item wrapperCol={{ span: 18, offset: 6 }}>
<Button onClick={this.add}>新增好朋友</Button> <Button onClick={this.add}>新增好朋友</Button>
&nbsp; &nbsp;

2
components/input-number/demo/basic.md
View File

@ -13,6 +13,6 @@ function onChange(value) {
} }
ReactDOM.render( ReactDOM.render(
<InputNumber min={1} max={10} defaultValue={3} onChange={onChange} /> <InputNumber min={1} max={10} defaultValue={3} onChange={onChange} />
, mountNode); , mountNode);
```` ````

2
components/input-number/demo/digit.md
View File

@ -13,6 +13,6 @@ function onChange(value) {
} }
ReactDOM.render( ReactDOM.render(
<InputNumber min={1} max={10} step={0.1} onChange={onChange} /> <InputNumber min={1} max={10} step={0.1} onChange={onChange} />
, mountNode); , mountNode);
```` ````

12
components/input-number/demo/size.md
View File

@ -13,16 +13,16 @@ function onChange(value) {
} }
ReactDOM.render( ReactDOM.render(
<div> <div>
<InputNumber size="large" min={1} max={100000} defaultValue={3} onChange={onChange} /> <InputNumber size="large" min={1} max={100000} defaultValue={3} onChange={onChange} />
<InputNumber min={1} max={100000} defaultValue={3} onChange={onChange} /> <InputNumber min={1} max={100000} defaultValue={3} onChange={onChange} />
<InputNumber size="small" min={1} max={100000} defaultValue={3} onChange={onChange} /> <InputNumber size="small" min={1} max={100000} defaultValue={3} onChange={onChange} />
</div> </div>
, mountNode); , mountNode);
```` ````
````css ````css
.ant-input-number{ .ant-input-number {
margin-right: 10px; margin-right: 10px;
} }
```` ````

12
components/locale-provider/demo/all.md
View File

@ -68,12 +68,12 @@ const Page = React.createClass({
</Popconfirm> </Popconfirm>
</div> </div>
<div className="example"> <div className="example">
<Transfer <Transfer
dataSource={[]} dataSource={[]}
showSearch showSearch
titles={['', '']} titles={['', '']}
targetKeys={[]} targetKeys={[]}
render={item => item.title} /> render={item => item.title} />
</div> </div>
<div style={{ width: 290, border: '1px solid #d9d9d9', borderRadius: 4 }}> <div style={{ width: 290, border: '1px solid #d9d9d9', borderRadius: 4 }}>
<Calendar fullscreen={false} /> <Calendar fullscreen={false} />

13
components/locale-provider/en_US.js
View File

@ -1,8 +1,13 @@
import Pagination from 'rc-pagination/lib/locale/en_US';
import DatePicker from '../date-picker/locale/en_US';
import TimePicker from '../time-picker/locale/en_US';
import Calendar from '../calendar/locale/en_US';
export default { export default {
Pagination: require('rc-pagination/lib/locale/en_US'), Pagination,
DatePicker: require('../date-picker/locale/en_US'), DatePicker,
TimePicker: require('../time-picker/locale/en_US'), TimePicker,
Calendar: require('../calendar/locale/en_US'), Calendar,
Table: { Table: {
filterTitle: 'Filter Menu', filterTitle: 'Filter Menu',
filterConfirm: 'OK', filterConfirm: 'OK',

14
components/locale-provider/ru_RU.js
View File

@ -2,11 +2,16 @@
* Created by Andrey Gayvoronsky on 13/04/16. * Created by Andrey Gayvoronsky on 13/04/16.
*/ */
import Pagination from 'rc-pagination/lib/locale/ru_RU';
import DatePicker from '../date-picker/locale/ru_RU';
import TimePicker from '../time-picker/locale/ru_RU';
import Calendar from '../calendar/locale/ru_RU';
export default { export default {
Pagination: require('rc-pagination/lib/locale/ru_RU'), Pagination,
DatePicker: require('../date-picker/locale/ru_RU'), DatePicker,
TimePicker: require('../time-picker/locale/ru_RU'), TimePicker,
Calendar: require('../calendar/locale/ru_RU'), Calendar,
Table: { Table: {
filterTitle: 'Фильтр', filterTitle: 'Фильтр',
filterConfirm: 'OK', filterConfirm: 'OK',
@ -29,4 +34,3 @@ export default {
itemsUnit: 'items', itemsUnit: 'items',
}, },
}; };

7
components/modal/demo/confirm-promise.md
View File

@ -23,7 +23,8 @@ function showConfirm() {
} }
ReactDOM.render( ReactDOM.render(
<Button onClick={showConfirm}> <Button onClick={showConfirm}>
确认对话框 确认对话框
</Button>, mountNode); </Button>
, mountNode);
```` ````

7
components/modal/demo/confirm.md
View File

@ -21,7 +21,8 @@ function showConfirm() {
} }
ReactDOM.render( ReactDOM.render(
<Button onClick={showConfirm}> <Button onClick={showConfirm}>
确认对话框 确认对话框
</Button>, mountNode); </Button>
, mountNode);
```` ````

7
components/pagination/demo/controlled.md
View File

@ -8,7 +8,7 @@ title: 受控
````jsx ````jsx
import { Pagination } from 'antd'; import { Pagination } from 'antd';
let Container = React.createClass({ const Container = React.createClass({
getInitialState() { getInitialState() {
return { return {
current: 3 current: 3
@ -25,8 +25,5 @@ let Container = React.createClass({
} }
}); });
ReactDOM.render( ReactDOM.render(<Container />, mountNode);
<Container />,
mountNode);
```` ````

8
components/popover/demo/placement.md
View File

@ -10,10 +10,10 @@ import { Popover, Button } from 'antd';
const text = <span>标题</span>; const text = <span>标题</span>;
const content = ( const content = (
<div> <div>
<p>内容</p> <p>内容</p>
<p>内容</p> <p>内容</p>
</div> </div>
); );
ReactDOM.render( ReactDOM.render(

4
components/progress/demo/format.md
View File

@ -10,10 +10,10 @@ import { Progress } from 'antd';
ReactDOM.render( ReactDOM.render(
<div> <div>
<Progress type="circle" percent={75} format={percent => `${percent / 10.0}折` } /> <Progress type="circle" percent={75} format={percent => `${percent / 10.0}折`} />
<Progress type="circle" percent={100} format={() => '成功'} /> <Progress type="circle" percent={100} format={() => '成功'} />
</div> </div>
, mountNode); , mountNode);
```` ````
<style> <style>

14
components/queue-anim/demo/change.md
View File

@ -49,14 +49,14 @@ const Test = React.createClass({
<Button onClick={this.onRemove} style={{ marginLeft: 10 }}>删除</Button> <Button onClick={this.onRemove} style={{ marginLeft: 10 }}>删除</Button>
</p> </p>
<div className="demo-content"> <div className="demo-content">
<div className="demo-listBox" key="b"> <div className="demo-listBox" key="b">
<div className="demo-list"> <div className="demo-list">
<div className="title"></div> <div className="title"></div>
<QueueAnim component="ul" type={['right', 'left']}> <QueueAnim component="ul" type={['right', 'left']}>
{this.state.show ? this.state.items : null} {this.state.show ? this.state.items : null}
</QueueAnim> </QueueAnim>
</div>
</div> </div>
</div>
</div> </div>
</div> </div>
); );

2
components/queue-anim/demo/enter-leave.md
View File

@ -30,7 +30,7 @@ const Test = React.createClass({
</div>, </div>,
<div className="demo-listBox" key="b"> <div className="demo-listBox" key="b">
<div className="demo-list"> <div className="demo-list">
<div className="title"></div> <div className="title"></div>
<ul> <ul>
<li></li> <li></li>
<li></li> <li></li>

10
components/slider/demo/event.md
View File

@ -13,10 +13,10 @@ function log(value) {
} }
ReactDOM.render( ReactDOM.render(
<div> <div>
<Slider defaultValue={30} onChange={log} /> <Slider defaultValue={30} onChange={log} />
<Slider range step={10} defaultValue={[20, 50]} onChange={log} /> <Slider range step={10} defaultValue={[20, 50]} onChange={log} />
<Slider defaultValue={30} onAfterChange={log} /> <Slider defaultValue={30} onAfterChange={log} />
</div> </div>
, mountNode); , mountNode);
```` ````

2
components/slider/demo/icon-slider.md
View File

@ -41,7 +41,7 @@ const IconSlider = React.createClass({
}); });
ReactDOM.render( ReactDOM.render(
<IconSlider min={0} max={20} value={0} icon={['frown', 'smile']} /> <IconSlider min={0} max={20} value={0} icon={['frown', 'smile']} />
, mountNode); , mountNode);
```` ````

22
components/slider/demo/mark.md
View File

@ -21,16 +21,16 @@ const marks = {
}; };
ReactDOM.render( ReactDOM.render(
<div> <div>
<p>包含关系</p> <p>包含关系</p>
<Slider marks={marks} defaultValue={37} /> <Slider marks={marks} defaultValue={37} />
<Slider range marks={marks} defaultValue={[26, 37]} /> <Slider range marks={marks} defaultValue={[26, 37]} />
<p>并列关系</p> <p>并列关系</p>
<Slider marks={marks} included={false} defaultValue={37} /> <Slider marks={marks} included={false} defaultValue={37} />
<p>结合 step</p> <p>结合 step</p>
<Slider marks={marks} step={10} defaultValue={37} /> <Slider marks={marks} step={10} defaultValue={37} />
<p>`step=null`</p> <p>`step=null`</p>
<Slider marks={marks} step={null} defaultValue={37} /> <Slider marks={marks} step={null} defaultValue={37} />
</div> </div>
, mountNode); , mountNode);
```` ````

8
components/table/demo/expand.md
View File

@ -22,9 +22,9 @@ const data = [
]; ];
ReactDOM.render( ReactDOM.render(
<Table columns={columns} <Table columns={columns}
expandedRowRender={record => <p>{record.description}</p>} expandedRowRender={record => <p>{record.description}</p>}
dataSource={data} dataSource={data}
className="table" /> className="table" />
, mountNode); , mountNode);
```` ````

6
components/table/demo/row-selection-and-operation.md
View File

@ -60,9 +60,9 @@ const App = React.createClass({
return ( return (
<div> <div>
<div style={{ marginBottom: 16 }}> <div style={{ marginBottom: 16 }}>
<Button type="primary" onClick={this.start} <Button type="primary" onClick={this.start}
disabled={!hasSelected} loading={loading}>操作</Button> disabled={!hasSelected} loading={loading}>操作</Button>
<span style={{ marginLeft: 8 }}>{hasSelected ? `选择了 ${selectedRowKeys.length} 个对象` : ''}</span> <span style={{ marginLeft: 8 }}>{hasSelected ? `选择了 ${selectedRowKeys.length} 个对象` : ''}</span>
</div> </div>
<Table rowSelection={rowSelection} columns={columns} dataSource={data} /> <Table rowSelection={rowSelection} columns={columns} dataSource={data} />
</div> </div>

10
components/table/index.jsx
View File

@ -215,7 +215,7 @@ export default class Table extends React.Component {
if (result !== 0) { if (result !== 0) {
return (sortOrder === 'descend') ? -result : result; return (sortOrder === 'descend') ? -result : result;
} }
return a._index - b._index; return a.indexForSort - b.indexForSort;
}; };
} }
@ -475,9 +475,9 @@ export default class Table extends React.Component {
this.props.rowSelection.getCheckboxProps && this.props.rowSelection.getCheckboxProps &&
this.props.rowSelection.getCheckboxProps(item).disabled); this.props.rowSelection.getCheckboxProps(item).disabled);
const checkboxAll = ( const checkboxAll = (
<Checkbox checked={checked} <Checkbox checked={checked}
disabled={checkboxAllDisabled} disabled={checkboxAllDisabled}
onChange={this.handleSelectAllRow} /> onChange={this.handleSelectAllRow} />
); );
selectionColumn = { selectionColumn = {
key: 'selection-column', key: 'selection-column',
@ -644,7 +644,7 @@ export default class Table extends React.Component {
// 优化本地排序 // 优化本地排序
data = data.slice(0); data = data.slice(0);
for (let i = 0; i < data.length; i++) { for (let i = 0; i < data.length; i++) {
data[i]._index = i; data[i].indexForSort = i;
} }
const sorterFn = this.getSorterFn(); const sorterFn = this.getSorterFn();
if (sorterFn) { if (sorterFn) {

15
components/tabs/demo/card-top.md
View File

@ -10,13 +10,14 @@ import { Tabs } from 'antd';
const TabPane = Tabs.TabPane; const TabPane = Tabs.TabPane;
ReactDOM.render( ReactDOM.render(
<div className="card-container"> <div className="card-container">
<Tabs type="card"> <Tabs type="card">
<TabPane tab="选项卡一" key="1">选项卡一内容</TabPane> <TabPane tab="选项卡一" key="1">选项卡一内容</TabPane>
<TabPane tab="选项卡二" key="2">选项卡二内容</TabPane> <TabPane tab="选项卡二" key="2">选项卡二内容</TabPane>
<TabPane tab="选项卡三" key="3">选项卡三内容</TabPane> <TabPane tab="选项卡三" key="3">选项卡三内容</TabPane>
</Tabs> </Tabs>
</div>, mountNode); </div>
, mountNode);
```` ````
````css ````css

11
components/tabs/demo/extra.md
View File

@ -12,9 +12,10 @@ const TabPane = Tabs.TabPane;
const operations = <Button>额外操作</Button>; const operations = <Button>额外操作</Button>;
ReactDOM.render( ReactDOM.render(
<Tabs tabBarExtraContent={operations}> <Tabs tabBarExtraContent={operations}>
<TabPane tab="选项卡一" key="1">选项卡一内容</TabPane> <TabPane tab="选项卡一" key="1">选项卡一内容</TabPane>
<TabPane tab="选项卡二" key="2">选项卡二内容</TabPane> <TabPane tab="选项卡二" key="2">选项卡二内容</TabPane>
<TabPane tab="选项卡三" key="3">选项卡三内容</TabPane> <TabPane tab="选项卡三" key="3">选项卡三内容</TabPane>
</Tabs>, mountNode); </Tabs>
, mountNode);
```` ````

12
components/timeline/demo/basic.md
View File

@ -9,11 +9,11 @@ title: 基本用法
import { Timeline } from 'antd'; import { Timeline } from 'antd';
ReactDOM.render( ReactDOM.render(
<Timeline> <Timeline>
<Timeline.Item>创建服务现场 2015-09-01</Timeline.Item> <Timeline.Item>创建服务现场 2015-09-01</Timeline.Item>
<Timeline.Item>初步排除网络异常 2015-09-01</Timeline.Item> <Timeline.Item>初步排除网络异常 2015-09-01</Timeline.Item>
<Timeline.Item>技术测试异常 2015-09-01</Timeline.Item> <Timeline.Item>技术测试异常 2015-09-01</Timeline.Item>
<Timeline.Item>网络异常正在修复 2015-09-01</Timeline.Item> <Timeline.Item>网络异常正在修复 2015-09-01</Timeline.Item>
</Timeline> </Timeline>
, mountNode); , mountNode);
```` ````

28
components/timeline/demo/color.md
View File

@ -9,19 +9,19 @@ title: 圆圈颜色
import { Timeline } from 'antd'; import { Timeline } from 'antd';
ReactDOM.render( ReactDOM.render(
<Timeline> <Timeline>
<Timeline.Item color="green">创建服务现场 2015-09-01</Timeline.Item> <Timeline.Item color="green">创建服务现场 2015-09-01</Timeline.Item>
<Timeline.Item color="green">创建服务现场 2015-09-01</Timeline.Item> <Timeline.Item color="green">创建服务现场 2015-09-01</Timeline.Item>
<Timeline.Item color="red"> <Timeline.Item color="red">
<p>初步排除网络异常1</p> <p>初步排除网络异常1</p>
<p>初步排除网络异常2</p> <p>初步排除网络异常2</p>
<p>初步排除网络异常3 2015-09-01</p> <p>初步排除网络异常3 2015-09-01</p>
</Timeline.Item> </Timeline.Item>
<Timeline.Item> <Timeline.Item>
<p>技术测试异常1</p> <p>技术测试异常1</p>
<p>技术测试异常2</p> <p>技术测试异常2</p>
<p>技术测试异常3 2015-09-01</p> <p>技术测试异常3 2015-09-01</p>
</Timeline.Item> </Timeline.Item>
</Timeline> </Timeline>
, mountNode); , mountNode);
```` ````

10
components/timeline/demo/pending.md
View File

@ -9,10 +9,10 @@ title: 最后一个
import { Timeline } from 'antd'; import { Timeline } from 'antd';
ReactDOM.render( ReactDOM.render(
<Timeline pending={<a href="#">查看更多</a>}> <Timeline pending={<a href="#">查看更多</a>}>
<Timeline.Item>创建服务现场 2015-09-01</Timeline.Item> <Timeline.Item>创建服务现场 2015-09-01</Timeline.Item>
<Timeline.Item>初步排除网络异常 2015-09-01</Timeline.Item> <Timeline.Item>初步排除网络异常 2015-09-01</Timeline.Item>
<Timeline.Item>技术测试异常 2015-09-01</Timeline.Item> <Timeline.Item>技术测试异常 2015-09-01</Timeline.Item>
</Timeline> </Timeline>
, mountNode); , mountNode);
```` ````

40
components/transfer/list.jsx
View File

@ -158,26 +158,26 @@ export default class TransferList extends React.Component {
</span> </span>
</span> </span>
</div> </div>
{ bodyDom || {bodyDom ||
<div className={ showSearch ? `${prefixCls}-body ${prefixCls}-body-with-search` : `${prefixCls}-body`}> <div className={showSearch ? `${prefixCls}-body ${prefixCls}-body-with-search` : `${prefixCls}-body`}>
{ showSearch ? <div className={`${prefixCls}-body-search-wrapper`}> {showSearch ? <div className={`${prefixCls}-body-search-wrapper`}>
<Search prefixCls={`${prefixCls}-search`} <Search prefixCls={`${prefixCls}-search`}
onChange={this.handleFilter} onChange={this.handleFilter}
handleClear={this.handleClear} handleClear={this.handleClear}
placeholder={searchPlaceholder || '请输入搜索内容'} placeholder={searchPlaceholder || '请输入搜索内容'}
value={filter} /> value={filter} />
</div> : null } </div> : null}
<Animate component="ul" <Animate component="ul"
transitionName={this.state.mounted ? `${prefixCls}-highlight` : ''} transitionName={this.state.mounted ? `${prefixCls}-highlight` : ''}
transitionLeave={false}> transitionLeave={false}>
{showItems.length > 0 {showItems.length > 0
? showItems ? showItems
: <div className={`${prefixCls}-body-not-found`}>{notFoundContent || '列表为空'}</div>} : <div className={`${prefixCls}-body-not-found`}>{notFoundContent || '列表为空'}</div>}
</Animate> </Animate>
</div>} </div>}
{ footerDom ? <div className={`${prefixCls}-footer`}> {footerDom ? <div className={`${prefixCls}-footer`}>
{ footerDom } {footerDom}
</div> : null } </div> : null}
</div> </div>
); );
} }

8
components/transfer/search.jsx
View File

@ -30,13 +30,13 @@ export default class Search extends React.Component {
const { placeholder, value, prefixCls } = this.props; const { placeholder, value, prefixCls } = this.props;
return ( return (
<div> <div>
<input placeholder={placeholder} className={ `${prefixCls} ant-input` } value={ value } ref="input" <input placeholder={placeholder} className={`${prefixCls} ant-input`} value={value} ref="input"
onChange={this.handleChange} /> onChange={this.handleChange} />
{ value && value.length > 0 ? {value && value.length > 0 ?
<a href="#" className={ `${prefixCls}-action` } onClick={this.handleClear}> <a href="#" className={`${prefixCls}-action`} onClick={this.handleClear}>
<Icon type="cross-circle" /> <Icon type="cross-circle" />
</a> </a>
: <span className={ `${prefixCls}-action` }><Icon type="search" /></span> : <span className={`${prefixCls}-action`}><Icon type="search" /></span>
} }
</div> </div>
); );

4
components/tree/demo/basic-controlled.md
View File

@ -29,10 +29,10 @@ const generateData = (_level, _preKey, _tns) => {
if (_level < 0) { if (_level < 0) {
return tns; return tns;
} }
const __level = _level - 1; const level = _level - 1;
children.forEach((key, index) => { children.forEach((key, index) => {
tns[index].children = []; tns[index].children = [];
return generateData(__level, key, tns[index].children); return generateData(level, key, tns[index].children);
}); });
}; };
generateData(z); generateData(z);

4
components/tree/demo/draggable.md
View File

@ -29,10 +29,10 @@ const generateData = (_level, _preKey, _tns) => {
if (_level < 0) { if (_level < 0) {
return tns; return tns;
} }
const __level = _level - 1; const level = _level - 1;
children.forEach((key, index) => { children.forEach((key, index) => {
tns[index].children = []; tns[index].children = [];
return generateData(__level, key, tns[index].children); return generateData(level, key, tns[index].children);
}); });
}; };
generateData(z); generateData(z);

30
components/upload/demo/drag.md
View File

@ -16,21 +16,21 @@ const props = {
}; };
ReactDOM.render( ReactDOM.render(
<div> <div>
<div style={{ width: 246, height: 140 }}> <div style={{ width: 246, height: 140 }}>
<Dragger {...props}> <Dragger {...props}>
<Icon type="plus" /> <Icon type="plus" />
</Dragger> </Dragger>
</div>
<div style={{ marginTop: 16, height: 180 }}>
<Dragger {...props}>
<p className="ant-upload-drag-icon">
<Icon type="inbox" />
</p>
<p className="ant-upload-text">点击或将文件拖拽到此区域上传</p>
<p className="ant-upload-hint">支持单个或批量上传，严禁上传公司内部资料及其他违禁文件</p>
</Dragger>
</div>
</div> </div>
<div style={{ marginTop: 16, height: 180 }}>
<Dragger {...props}>
<p className="ant-upload-drag-icon">
<Icon type="inbox" />
</p>
<p className="ant-upload-text">点击或将文件拖拽到此区域上传</p>
<p className="ant-upload-hint">支持单个或批量上传，严禁上传公司内部资料及其他违禁文件</p>
</Dragger>
</div>
</div>
, mountNode); , mountNode);
```` ````

28
components/upload/demo/picture-style.md
View File

@ -29,20 +29,20 @@ const props = {
}; };
ReactDOM.render( ReactDOM.render(
<div> <div>
<Upload {...props}> <Upload {...props}>
<Button type="ghost"> <Button type="ghost">
<Icon type="upload" /> 点击上传 <Icon type="upload" /> 点击上传
</Button> </Button>
</Upload> </Upload>
<br /> <br />
<br /> <br />
<Upload {...props} className="upload-list-inline"> <Upload {...props} className="upload-list-inline">
<Button type="ghost"> <Button type="ghost">
<Icon type="upload" /> 点击上传 <Icon type="upload" /> 点击上传
</Button> </Button>
</Upload> </Upload>
</div> </div>
, mountNode); , mountNode);
```` ````

2
components/upload/index.jsx
View File

@ -137,7 +137,7 @@ export default class Upload extends React.Component {
if (typeof response === 'string') { if (typeof response === 'string') {
response = JSON.parse(response); response = JSON.parse(response);
} }
} catch (e) {/* do nothing */} } catch (e) { /* do nothing */ }
let fileList = this.state.fileList; let fileList = this.state.fileList;
let targetItem = getFileItem(file, fileList); let targetItem = getFileItem(file, fileList);
// 之前已经删除 // 之前已经删除

2
components/upload/uploadList.jsx
View File

@ -106,7 +106,7 @@ export default class UploadList extends React.Component {
) : <Icon type="cross" onClick={() => this.handleClose(file)} /> ) : <Icon type="cross" onClick={() => this.handleClose(file)} />
} }
</div> </div>
{ progress } {progress}
</div> </div>
); );
}); });

11
package.json
View File

@ -73,19 +73,20 @@
"devDependencies": { "devDependencies": {
"antd-tools": "~0.3.0", "antd-tools": "~0.3.0",
"babel-eslint": "^6.0.2", "babel-eslint": "^6.0.2",
"babel-jest": "^11.0.2", "babel-jest": "^12.0.2",
"babel-plugin-antd": "^0.4.0", "babel-plugin-antd": "^0.4.0",
"dom-scroll-into-view": "^1.1.0", "dom-scroll-into-view": "^1.1.0",
"es6-shim": "^0.35.0", "es6-shim": "^0.35.0",
"eslint": "^2.2.0", "eslint": "^2.2.0",
"eslint-config-airbnb": "^7.0.0", "eslint-config-airbnb": "^8.0.0",
"eslint-plugin-babel": "^3.0.0", "eslint-plugin-babel": "^3.0.0",
"eslint-plugin-jsx-a11y": "^0.6.2", "eslint-plugin-import": "^1.6.1",
"eslint-plugin-jsx-a11y": "^1.0.4",
"eslint-plugin-markdown": "*", "eslint-plugin-markdown": "*",
"eslint-plugin-react": "^5.0.1", "eslint-plugin-react": "^5.0.1",
"eslint-tinker": "^0.3.1", "eslint-tinker": "^0.3.1",
"history": "^2.0.1", "history": "^2.0.1",
"jest-cli": "^11.0.0", "jest-cli": "^12.0.2",
"jsonml-to-react-component": "~0.2.0", "jsonml-to-react-component": "~0.2.0",
"jsonml.js": "^0.1.0", "jsonml.js": "^0.1.0",
"jsonp": "^0.2.0", "jsonp": "^0.2.0",
@ -124,7 +125,7 @@
"eslint-fix": "eslint --fix components test site scripts ./*.js --ext '.js,.jsx' && eslint-tinker ./components/*/demo/*.md", "eslint-fix": "eslint --fix components test site scripts ./*.js --ext '.js,.jsx' && eslint-tinker ./components/*/demo/*.md",
"test": "npm run lint && npm run dist && npm run jest", "test": "npm run lint && npm run dist && npm run jest",
"jest": "jest", "jest": "jest",
"pre-publish":"node ./scripts/prepub", "pre-publish": "node ./scripts/prepub",
"pub": "antd-tools run pub", "pub": "antd-tools run pub",
"beta": "antd-tools run beta", "beta": "antd-tools run beta",
"authors": "git log --format='%aN <%aE>' | sort -u | grep -v 'users.noreply.github.com' | grep -v 'alibaba-inc.com' | grep -v 'alipay.com' | grep -v 'taobao.com' > AUTHORS.txt" "authors": "git log --format='%aN <%aE>' | sort -u | grep -v 'users.noreply.github.com' | grep -v 'alibaba-inc.com' | grep -v 'alipay.com' | grep -v 'taobao.com' > AUTHORS.txt"

2
site/component/App.jsx
View File

@ -6,7 +6,7 @@ export default function App(props) {
return ( return (
<div> <div>
<Header {...props} /> <Header {...props} />
{ props.children } {props.children}
<Footer /> <Footer />
</div> </div>
); );

6
site/component/Article/index.jsx
View File

@ -39,7 +39,7 @@ export default class Article extends React.Component {
return ( return (
<li key={getChildren(node)[0]}> <li key={getChildren(node)[0]}>
<Link to={{ pathname: location.pathname, query: { scrollTo: getChildren(node)[0] } }}> <Link to={{ pathname: location.pathname, query: { scrollTo: getChildren(node)[0] } }}>
{ utils.jsonmlToComponent(location.pathname, getChildren(node)[0]) } {utils.jsonmlToComponent(location.pathname, getChildren(node)[0])}
</Link> </Link>
</li> </li>
); );
@ -53,7 +53,7 @@ export default class Article extends React.Component {
{meta.english} {meta.chinese} {meta.english} {meta.chinese}
{ {
!meta.subtitle ? null : !meta.subtitle ? null :
<span className="subtitle">{ meta.subtitle }</span> <span className="subtitle">{meta.subtitle}</span>
} }
</h1> </h1>
{ {
@ -65,7 +65,7 @@ export default class Article extends React.Component {
} }
{ {
(jumper.length > 0 && meta.toc !== false) ? (jumper.length > 0 && meta.toc !== false) ?
<section className="toc"><ul>{ jumper }</ul></section> : <section className="toc"><ul>{jumper}</ul></section> :
null null
} }
{ {

14
site/component/ComponentDoc/index.jsx
View File

@ -65,9 +65,9 @@ export default class ComponentDoc extends React.Component {
const jumper = demos.map((demo) => { const jumper = demos.map((demo) => {
return ( return (
<li key={demo.id}> <li key={demo.id}>
<Link className={ demo.id === scrollTo ? 'current' : ''} <Link className={demo.id === scrollTo ? 'current' : ''}
to={{ pathname: location.pathname, query: { scrollTo: `${demo.id}` } }}> to={{ pathname: location.pathname, query: { scrollTo: `${demo.id}` } }}>
{ demo.meta.title } {demo.meta.title}
</Link> </Link>
</li> </li>
); );
@ -77,7 +77,7 @@ export default class ComponentDoc extends React.Component {
<article> <article>
<Affix className="toc-affix" offsetTop={16}> <Affix className="toc-affix" offsetTop={16}>
<ul className="toc demos-anchor"> <ul className="toc demos-anchor">
{ jumper } {jumper}
</ul> </ul>
</Affix> </Affix>
<section className="markdown"> <section className="markdown">
@ -96,17 +96,17 @@ export default class ComponentDoc extends React.Component {
</h2> </h2>
</section> </section>
<Row gutter={16}> <Row gutter={16}>
<Col span={ isSingleCol ? '24' : '12' } <Col span={isSingleCol ? '24' : '12'}
className={ isSingleCol ? className={isSingleCol ?
'code-boxes-col-1-1' : 'code-boxes-col-1-1' :
'code-boxes-col-2-1' 'code-boxes-col-2-1'
} }
> >
{ leftChildren } {leftChildren}
</Col> </Col>
{ {
isSingleCol ? null : isSingleCol ? null :
<Col className="code-boxes-col-2-1" span="12">{ rightChildren }</Col> <Col className="code-boxes-col-2-1" span="12">{rightChildren}</Col>
} }
</Row> </Row>
{ {

4
site/component/Demo/index.jsx
View File

@ -51,10 +51,10 @@ export default class Demo extends React.Component {
<section className="code-box-meta markdown"> <section className="code-box-meta markdown">
<div className="code-box-title"> <div className="code-box-title">
<Link to={{ pathname, query: { scrollTo: id } }}> <Link to={{ pathname, query: { scrollTo: id } }}>
{ meta.title } {meta.title}
</Link> </Link>
</div> </div>
{ introChildren } {introChildren}
<span className="collapse anticon anticon-circle-o-right" <span className="collapse anticon anticon-circle-o-right"
onClick={this.handleCodeExapnd} onClick={this.handleCodeExapnd}
unselectable="none" /> unselectable="none" />

2
site/component/IconSet/index.jsx
View File

@ -15,7 +15,7 @@ export default class IconSet extends React.Component {
[className]: !!className, [className]: !!className,
}); });
return ( return (
<ul className={listClassName}> <ul className={listClassName}>
{this.props.icons.map((type, i) => <CopyableIcon key={i} type={type} />)} {this.props.icons.map((type, i) => <CopyableIcon key={i} type={type} />)}
</ul> </ul>
); );

2
site/component/ImagePreview/index.jsx
View File

@ -26,7 +26,7 @@ function PreviewImageBox({ cover, coverMeta, imgs, style, previewVisible,
<Modal className="image-modal" width={960} visible={previewVisible} title={null} footer={null} <Modal className="image-modal" width={960} visible={previewVisible} title={null} footer={null}
onCancel={onCancel}> onCancel={onCancel}>
<Carousel className={`${onlyOneImg ? 'image-modal-single' : ''}`} adaptiveHeight> <Carousel className={`${onlyOneImg ? 'image-modal-single' : ''}`} adaptiveHeight>
{ comparable ? cover : imgs } {comparable ? cover : imgs}
</Carousel> </Carousel>
<div className="preview-image-title">{coverMeta.alt}</div> <div className="preview-image-title">{coverMeta.alt}</div>
</Modal> </Modal>

54
site/component/MainContent/index.jsx
View File

@ -45,23 +45,23 @@ export default class MainContent extends React.Component {
generateMenuItem(isTop, item) { generateMenuItem(isTop, item) {
const key = this.fileNameToPath(item.fileName); const key = this.fileNameToPath(item.fileName);
const text = isTop ? const text = isTop ?
item.chinese || item.english : [ item.chinese || item.english : [
<span key="english">{ item.english }</span>, <span key="english">{item.english}</span>,
<span className="chinese" key="chinese">{ item.chinese }</span> <span className="chinese" key="chinese">{item.chinese}</span>
]; ];
const disabled = item.disabled; const disabled = item.disabled;
const url = item.fileName.replace(/(\/index)?\.md$/i, ''); const url = item.fileName.replace(/(\/index)?\.md$/i, '');
const child = !item.link ? const child = !item.link ?
<Link to={url} disabled={disabled}> <Link to={url} disabled={disabled}>
{ text } {text}
</Link> : </Link> :
<a href={item.link} target="_blank" disabled={disabled}> <a href={item.link} target="_blank" disabled={disabled}>
{ text } {text}
</a>; </a>;
return ( return (
<Menu.Item key={key} disabled={disabled}> <Menu.Item key={key} disabled={disabled}>
{ child } {child}
</Menu.Item> </Menu.Item>
); );
} }
@ -73,20 +73,20 @@ export default class MainContent extends React.Component {
generateSubMenuItems(obj) { generateSubMenuItems(obj) {
const topLevel = (obj.topLevel || []).map(this.generateMenuItem.bind(this, true)); const topLevel = (obj.topLevel || []).map(this.generateMenuItem.bind(this, true));
const itemGroups = Object.keys(obj).filter(this.isNotTopLevel) const itemGroups = Object.keys(obj).filter(this.isNotTopLevel)
.sort((a, b) => { .sort((a, b) => {
return config.typeOrder[a] - config.typeOrder[b]; return config.typeOrder[a] - config.typeOrder[b];
}) })
.map((type, index) => { .map((type, index) => {
const groupItems = obj[type].sort((a, b) => { const groupItems = obj[type].sort((a, b) => {
return a.english.charCodeAt(0) - b.english.charCodeAt(0); return a.english.charCodeAt(0) - b.english.charCodeAt(0);
}).map(this.generateMenuItem.bind(this, false)); }).map(this.generateMenuItem.bind(this, false));
return ( return (
<Menu.ItemGroup title={type} key={index}> <Menu.ItemGroup title={type} key={index}>
{ groupItems } {groupItems}
</Menu.ItemGroup> </Menu.ItemGroup>
); );
}); });
return [...topLevel, ...itemGroups]; return [...topLevel, ...itemGroups];
} }
@ -103,7 +103,7 @@ export default class MainContent extends React.Component {
return ( return (
<SubMenu title={<h4>{category}</h4>} key={category}> <SubMenu title={<h4>{category}</h4>} key={category}>
{ subMenuItems } {subMenuItems}
</SubMenu> </SubMenu>
); );
}); });
@ -148,11 +148,11 @@ export default class MainContent extends React.Component {
<Menu className="aside-container" mode="inline" <Menu className="aside-container" mode="inline"
defaultOpenKeys={Object.keys(this.props.menuItems)} defaultOpenKeys={Object.keys(this.props.menuItems)}
selectedKeys={[activeMenuItem]}> selectedKeys={[activeMenuItem]}>
{ menuItems } {menuItems}
</Menu> </Menu>
</Col> </Col>
<Col lg={20} md={18} sm={24} xs={24} className="main-container"> <Col lg={20} md={18} sm={24} xs={24} className="main-container">
{ this.props.children } {this.props.children}
</Col> </Col>
</Row> </Row>

2
site/component/utils.js
View File

@ -25,7 +25,7 @@ export function jsonmlToComponent(pathname, jsonml) {
id: children, id: children,
...getAttributes(node), ...getAttributes(node),
}, [ }, [
<span key="title">{ children.map((child) => toReactComponent(child)) }</span>, <span key="title">{children.map((child) => toReactComponent(child))}</span>,
<Link to={{ pathname, query: { scrollTo: children } }} className="anchor" key="anchor">#</Link>, <Link to={{ pathname, query: { scrollTo: children } }} className="anchor" key="anchor">#</Link>,
]); ]);
}], }],

12
site/entry/index.jsx
View File

@ -50,28 +50,28 @@ ReactDOM.render(
<Route path="/" component={App}> <Route path="/" component={App}>
<IndexRoute component={Home} /> <IndexRoute component={Home} />
<Route path="components" component={ReactComponents}> <Route path="components" component={ReactComponents}>
{ utils.generateIndex(reactComponents) } {utils.generateIndex(reactComponents)}
<Route path=":children" <Route path=":children"
component={utils.getChildrenWrapper(reactComponents)} /> component={utils.getChildrenWrapper(reactComponents)} />
</Route> </Route>
{ redirects } {redirects}
<Route path="docs/practice" component={Practice}> <Route path="docs/practice" component={Practice}>
{ utils.generateIndex(practice) } {utils.generateIndex(practice)}
<Route path=":children" <Route path=":children"
component={utils.getChildrenWrapper(practice)} /> component={utils.getChildrenWrapper(practice)} />
</Route> </Route>
<Route path="docs/pattern" component={Pattern}> <Route path="docs/pattern" component={Pattern}>
{ utils.generateIndex(pattern) } {utils.generateIndex(pattern)}
<Route path=":children" <Route path=":children"
component={utils.getChildrenWrapper(pattern)} /> component={utils.getChildrenWrapper(pattern)} />
</Route> </Route>
<Route path="docs/spec" component={Spec}> <Route path="docs/spec" component={Spec}>
{ utils.generateIndex(spec) } {utils.generateIndex(spec)}
<Route path=":children" <Route path=":children"
component={utils.getChildrenWrapper(spec)} /> component={utils.getChildrenWrapper(spec)} />
</Route> </Route>
<Route path="docs/resource" component={Resource}> <Route path="docs/resource" component={Resource}>
{ utils.generateIndex(resource) } {utils.generateIndex(resource)}
<Route path=":children" <Route path=":children"
component={utils.getChildrenWrapper(resource)} /> component={utils.getChildrenWrapper(resource)} />
</Route> </Route>