upgrade eslint-config-airbnb

This commit is contained in:
afc163 2017-10-09 13:23:20 +08:00
parent 8ccd02139c
commit 475e4ff23d
47 changed files with 394 additions and 352 deletions

View File

@ -30,6 +30,7 @@ const eslintrc = {
'import/extensions': 0,
'import/no-unresolved': 0,
'import/no-extraneous-dependencies': 0,
'prefer-destructuring': 0,
'no-param-reassign': 0,
'no-return-assign': 0,
'max-len': 0,
@ -38,8 +39,13 @@ const eslintrc = {
'react/require-extension': 0,
'jsx-a11y/no-static-element-interactions': 0,
'jsx-a11y/anchor-has-content': 0,
'jsx-a11y/click-events-have-key-events': 0,
'jsx-a11y/anchor-is-valid': 0,
'react/no-danger': 0,
'comma-dangle': ['error', 'always-multiline'],
'function-paren-newline': 0,
'object-curly-newline': 0,
'no-restricted-globals': 0,
},
};
@ -51,6 +57,7 @@ if (process.env.RUN_ENV === 'DEMO') {
};
Object.assign(eslintrc.rules, {
indent: 0,
'no-console': 0,
'no-plusplus': 0,
'eol-last': 0,

View File

@ -18,30 +18,32 @@ class AffixMounter extends React.Component {
return this.container;
}
render() {
return (<div
style={{
height: 100,
overflowY: 'scroll',
}}
ref={(node) => { this.container = node; }}
>
return (
<div
className="background"
style={{
paddingTop: 60,
height: 300,
height: 100,
overflowY: 'scroll',
}}
ref={(node) => { this.container = node; }}
>
<Affix
target={() => this.container}
ref={ele => this.affix = ele}
<div
className="background"
style={{
paddingTop: 60,
height: 300,
}}
>
<Button type="primary" >
Fixed at the top of container
</Button>
</Affix>
<Affix
target={() => this.container}
ref={ele => this.affix = ele}
>
<Button type="primary" >
Fixed at the top of container
</Button>
</Affix>
</div>
</div>
</div>);
);
}
}

View File

@ -20,17 +20,21 @@ const onClose = function (e) {
console.log(e, 'I was closed.');
};
ReactDOM.render(<div>
<Alert message="Warning Text Warning Text Warning TextW arning Text Warning Text Warning TextWarning Text"
type="warning"
closable
onClose={onClose}
/>
<Alert message="Error Text"
description="Error Description Error Description Error Description Error Description Error Description Error Description"
type="error"
closable
onClose={onClose}
/>
</div>, mountNode);
ReactDOM.render(
<div>
<Alert
message="Warning Text Warning Text Warning TextW arning Text Warning Text Warning TextWarning Text"
type="warning"
closable
onClose={onClose}
/>
<Alert
message="Error Text"
description="Error Description Error Description Error Description Error Description Error Description Error Description"
type="error"
closable
onClose={onClose}
/>
</div>
, mountNode);
````

View File

@ -16,26 +16,28 @@ Additional description for alert message.
````jsx
import { Alert } from 'antd';
ReactDOM.render(<div>
<Alert
message="Success Text"
description="Success Description Success Description Success Description"
type="success"
/>
<Alert
message="Info Text"
description="Info Description Info Description Info Description Info Description"
type="info"
/>
<Alert
message="Warning Text"
description="Warning Description Warning Description Warning Description Warning Description"
type="warning"
/>
<Alert
message="Error Text"
description="Error Description Error Description Error Description Error Description"
type="error"
/>
</div>, mountNode);
ReactDOM.render(
<div>
<Alert
message="Success Text"
description="Success Description Success Description Success Description"
type="success"
/>
<Alert
message="Info Text"
description="Info Description Info Description Info Description Info Description"
type="info"
/>
<Alert
message="Warning Text"
description="Warning Description Warning Description Warning Description Warning Description"
type="warning"
/>
<Alert
message="Error Text"
description="Error Description Error Description Error Description Error Description"
type="error"
/>
</div>
, mountNode);
````

View File

@ -16,34 +16,36 @@ Decent icon make information more clear and more friendly.
````jsx
import { Alert } from 'antd';
ReactDOM.render(<div>
<Alert message="Success Tips" type="success" showIcon />
<Alert message="Informational Notes" type="info" showIcon />
<Alert message="Warning" type="warning" showIcon />
<Alert message="Error" type="error" showIcon />
<Alert
message="success tips"
description="Detailed description and advices about successful copywriting."
type="success"
showIcon
/>
<Alert
message="Informational Notes"
description="Additional description and informations about copywriting."
type="info"
showIcon
/>
<Alert
message="Warning"
description="This is a warning notice about copywriting."
type="warning"
showIcon
/>
<Alert
message="Error"
description="This is an error message about copywriting."
type="error"
showIcon
/>
</div>, mountNode);
ReactDOM.render(
<div>
<Alert message="Success Tips" type="success" showIcon />
<Alert message="Informational Notes" type="info" showIcon />
<Alert message="Warning" type="warning" showIcon />
<Alert message="Error" type="error" showIcon />
<Alert
message="success tips"
description="Detailed description and advices about successful copywriting."
type="success"
showIcon
/>
<Alert
message="Informational Notes"
description="Additional description and informations about copywriting."
type="info"
showIcon
/>
<Alert
message="Warning"
description="This is a warning notice about copywriting."
type="warning"
showIcon
/>
<Alert
message="Error"
description="This is an error message about copywriting."
type="error"
showIcon
/>
</div>
, mountNode);
````

View File

@ -16,10 +16,12 @@ There are 4 types of Alert: `success`, `info`, `warning`, `error`.
````jsx
import { Alert } from 'antd';
ReactDOM.render(<div>
<Alert message="Success Text" type="success" />
<Alert message="Info Text" type="info" />
<Alert message="Warning Text" type="warning" />
<Alert message="Error Text" type="error" />
</div>, mountNode);
ReactDOM.render(
<div>
<Alert message="Success Text" type="success" />
<Alert message="Info Text" type="info" />
<Alert message="Warning Text" type="warning" />
<Alert message="Error Text" type="error" />
</div>
, mountNode);
````

View File

@ -68,10 +68,12 @@ function getMonthData(value) {
function monthCellRender(value) {
const num = getMonthData(value);
return num ? <div className="notes-month">
<section>{num}</section>
<span>Backlog number</span>
</div> : null;
return num ? (
<div className="notes-month">
<section>{num}</section>
<span>Backlog number</span>
</div>
) : null;
}
ReactDOM.render(

View File

@ -5,7 +5,7 @@ import Carousel from '..';
describe('Carousel', () => {
it('should has innerSlider', () => {
const wrapper = mount(<Carousel><div /></Carousel>);
const innerSlider = wrapper.node.innerSlider;
const { innerSlider } = wrapper.node;
const innerSliderFromRefs = wrapper.node.refs.slick.innerSlider;
expect(innerSlider).toBe(innerSliderFromRefs);
expect(typeof innerSlider.slickNext).toBe('function');

View File

@ -32,14 +32,10 @@ const options = [{
class LazyOptions extends React.Component {
state = {
inputValue: '',
options,
};
onChange = (value, selectedOptions) => {
console.log(value, selectedOptions);
this.setState({
inputValue: selectedOptions.map(o => o.label).join(', '),
});
}
loadData = (selectedOptions) => {
const targetOption = selectedOptions[selectedOptions.length - 1];

View File

@ -1,6 +1,6 @@
---
order: 1
title:
title:
zh-CN: 手风琴
en-US: Accordion
---
@ -25,13 +25,13 @@ const text = `
ReactDOM.render(
<Collapse accordion>
<Panel header={'This is panel header 1'} key="1">
<Panel header="This is panel header 1" key="1">
<p>{text}</p>
</Panel>
<Panel header={'This is panel header 2'} key="2">
<Panel header="This is panel header 2" key="2">
<p>{text}</p>
</Panel>
<Panel header={'This is panel header 3'} key="3">
<Panel header="This is panel header 3" key="3">
<p>{text}</p>
</Panel>
</Collapse>

View File

@ -29,17 +29,17 @@ const text = `
ReactDOM.render(
<Collapse onChange={callback}>
<Panel header={'This is panel header 1'} key="1">
<Panel header="This is panel header 1" key="1">
<Collapse defaultActiveKey="1">
<Panel header={'This is panel nest panel'} key="1">
<Panel header="This is panel nest panel" key="1">
<p>{text}</p>
</Panel>
</Collapse>
</Panel>
<Panel header={'This is panel header 2'} key="2">
<Panel header="This is panel header 2" key="2">
<p>{text}</p>
</Panel>
<Panel header={'This is panel header 3'} key="3">
<Panel header="This is panel header 3" key="3">
<p>{text}</p>
</Panel>
</Collapse>

View File

@ -29,11 +29,11 @@ const menu = (
</Menu>
);
ReactDOM.render(<div>
ReactDOM.render(
<Dropdown overlay={menu} trigger={['click']}>
<a className="ant-dropdown-link" href="#">
Click me <Icon type="down" />
</a>
</Dropdown>
</div>, mountNode);
, mountNode);
````

View File

@ -21,44 +21,46 @@ Layout.Sider supports responsive layout.
import { Layout, Menu, Icon } from 'antd';
const { Header, Content, Footer, Sider } = Layout;
ReactDOM.render(<Layout>
<Sider
breakpoint="lg"
collapsedWidth="0"
onCollapse={(collapsed, type) => { console.log(collapsed, type); }}
>
<div className="logo" />
<Menu theme="dark" mode="inline" defaultSelectedKeys={['4']}>
<Menu.Item key="1">
<Icon type="user" />
<span className="nav-text">nav 1</span>
</Menu.Item>
<Menu.Item key="2">
<Icon type="video-camera" />
<span className="nav-text">nav 2</span>
</Menu.Item>
<Menu.Item key="3">
<Icon type="upload" />
<span className="nav-text">nav 3</span>
</Menu.Item>
<Menu.Item key="4">
<Icon type="user" />
<span className="nav-text">nav 4</span>
</Menu.Item>
</Menu>
</Sider>
ReactDOM.render(
<Layout>
<Header style={{ background: '#fff', padding: 0 }} />
<Content style={{ margin: '24px 16px 0' }}>
<div style={{ padding: 24, background: '#fff', minHeight: 360 }}>
content
</div>
</Content>
<Footer style={{ textAlign: 'center' }}>
Ant Design ©2016 Created by Ant UED
</Footer>
<Sider
breakpoint="lg"
collapsedWidth="0"
onCollapse={(collapsed, type) => { console.log(collapsed, type); }}
>
<div className="logo" />
<Menu theme="dark" mode="inline" defaultSelectedKeys={['4']}>
<Menu.Item key="1">
<Icon type="user" />
<span className="nav-text">nav 1</span>
</Menu.Item>
<Menu.Item key="2">
<Icon type="video-camera" />
<span className="nav-text">nav 2</span>
</Menu.Item>
<Menu.Item key="3">
<Icon type="upload" />
<span className="nav-text">nav 3</span>
</Menu.Item>
<Menu.Item key="4">
<Icon type="user" />
<span className="nav-text">nav 4</span>
</Menu.Item>
</Menu>
</Sider>
<Layout>
<Header style={{ background: '#fff', padding: 0 }} />
<Content style={{ margin: '24px 16px 0' }}>
<div style={{ padding: 24, background: '#fff', minHeight: 360 }}>
content
</div>
</Content>
<Footer style={{ textAlign: 'center' }}>
Ant Design ©2016 Created by Ant UED
</Footer>
</Layout>
</Layout>
</Layout>, mountNode);
, mountNode);
````
````css

View File

@ -2,7 +2,7 @@ import React from 'react';
import { mount } from 'enzyme';
import moment from 'moment';
import { LocaleProvider, Pagination, DatePicker, TimePicker, Calendar,
Popconfirm, Table, Modal, Select, Transfer } from '../../';
Popconfirm, Table, Modal, Select, Transfer } from '../../';
import enGB from '../en_GB';
import frFR from '../fr_FR';
import nlBE from '../nl_BE';
@ -36,8 +36,8 @@ import srRS from '../sr_RS';
const locales = [enUS, ptPT, ptBR, ruRU, esES, svSE, frBE, deDE, nlNL, caES, csCZ, koKR, etEE, skSK, jaJP, trTR, zhTW, fiFI, plPL, bgBG, enGB, frFR, nlBE, itIT, viVN, thTH, faIR, elGR, nbNO, srRS];
const Option = Select.Option;
const RangePicker = DatePicker.RangePicker;
const { Option } = Select;
const { RangePicker } = DatePicker;
const columns = [{
title: 'Name',

View File

@ -3,7 +3,7 @@ import { mount } from 'enzyme';
import Menu from '..';
import Icon from '../../icon';
const SubMenu = Menu.SubMenu;
const { SubMenu } = Menu;
const delay = timeout => new Promise(resolve => setTimeout(resolve, timeout));
describe('Menu', () => {

View File

@ -1,6 +1,6 @@
import Modal from '..';
const confirm = Modal.confirm;
const { confirm } = Modal;
describe('Modal.confirm triggers callbacks correctly', () => {
const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});

View File

@ -8,7 +8,7 @@ describe('Notification.placement', () => {
}
function getStyle(el, prop, getComputedStyle, style) {
getComputedStyle = window.getComputedStyle;
getComputedStyle = getComputedStyle || window.getComputedStyle;
style = getComputedStyle ? getComputedStyle(el) : el.currentStyle;
// If a css property's value is `auto`, it will return an empty string.

View File

@ -19,7 +19,7 @@ import { Popconfirm, Switch, message } from 'antd';
class App extends React.Component {
state = {
visible: false,
condition: true, // Whether meet the condition, if not show popconfirm.
condition: true, // Whether meet the condition, if not show popconfirm.
}
changeCondition = (value) => {
this.setState({ condition: value });
@ -40,9 +40,9 @@ class App extends React.Component {
// Determining condition before show the popconfirm.
console.log(this.state.condition);
if (this.state.condition) {
this.confirm(); // next step
this.confirm(); // next step
} else {
this.setState({ visible }); // show the popconfirm
this.setState({ visible }); // show the popconfirm
}
}
render() {

View File

@ -22,52 +22,54 @@ function confirm() {
message.info('Click on Yes.');
}
ReactDOM.render(<div className="demo">
<div style={{ marginLeft: 70, whiteSpace: 'nowrap' }}>
<Popconfirm placement="topLeft" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>TL</Button>
</Popconfirm>
<Popconfirm placement="top" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>Top</Button>
</Popconfirm>
<Popconfirm placement="topRight" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>TR</Button>
</Popconfirm>
ReactDOM.render(
<div className="demo">
<div style={{ marginLeft: 70, whiteSpace: 'nowrap' }}>
<Popconfirm placement="topLeft" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>TL</Button>
</Popconfirm>
<Popconfirm placement="top" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>Top</Button>
</Popconfirm>
<Popconfirm placement="topRight" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>TR</Button>
</Popconfirm>
</div>
<div style={{ width: 70, float: 'left' }}>
<Popconfirm placement="leftTop" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>LT</Button>
</Popconfirm>
<Popconfirm placement="left" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>Left</Button>
</Popconfirm>
<Popconfirm placement="leftBottom" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>LB</Button>
</Popconfirm>
</div>
<div style={{ width: 70, marginLeft: 304 }}>
<Popconfirm placement="rightTop" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>RT</Button>
</Popconfirm>
<Popconfirm placement="right" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>Right</Button>
</Popconfirm>
<Popconfirm placement="rightBottom" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>RB</Button>
</Popconfirm>
</div>
<div style={{ marginLeft: 70, clear: 'both', whiteSpace: 'nowrap' }}>
<Popconfirm placement="bottomLeft" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>BL</Button>
</Popconfirm>
<Popconfirm placement="bottom" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>Bottom</Button>
</Popconfirm>
<Popconfirm placement="bottomRight" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>BR</Button>
</Popconfirm>
</div>
</div>
<div style={{ width: 70, float: 'left' }}>
<Popconfirm placement="leftTop" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>LT</Button>
</Popconfirm>
<Popconfirm placement="left" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>Left</Button>
</Popconfirm>
<Popconfirm placement="leftBottom" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>LB</Button>
</Popconfirm>
</div>
<div style={{ width: 70, marginLeft: 304 }}>
<Popconfirm placement="rightTop" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>RT</Button>
</Popconfirm>
<Popconfirm placement="right" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>Right</Button>
</Popconfirm>
<Popconfirm placement="rightBottom" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>RB</Button>
</Popconfirm>
</div>
<div style={{ marginLeft: 70, clear: 'both', whiteSpace: 'nowrap' }}>
<Popconfirm placement="bottomLeft" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>BL</Button>
</Popconfirm>
<Popconfirm placement="bottom" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>Bottom</Button>
</Popconfirm>
<Popconfirm placement="bottomRight" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>BR</Button>
</Popconfirm>
</div>
</div>, mountNode);
, mountNode);
````
<style>

View File

@ -22,30 +22,32 @@ function onChange(e) {
console.log(`radio checked:${e.target.value}`);
}
ReactDOM.render(<div>
ReactDOM.render(
<div>
<RadioGroup onChange={onChange} defaultValue="a">
<RadioButton value="a">Hangzhou</RadioButton>
<RadioButton value="b">Shanghai</RadioButton>
<RadioButton value="c">Beijing</RadioButton>
<RadioButton value="d">Chengdu</RadioButton>
</RadioGroup>
<div>
<RadioGroup onChange={onChange} defaultValue="a">
<RadioButton value="a">Hangzhou</RadioButton>
<RadioButton value="b">Shanghai</RadioButton>
<RadioButton value="c">Beijing</RadioButton>
<RadioButton value="d">Chengdu</RadioButton>
</RadioGroup>
</div>
<div style={{ marginTop: 16 }}>
<RadioGroup onChange={onChange} defaultValue="a">
<RadioButton value="a">Hangzhou</RadioButton>
<RadioButton value="b" disabled>Shanghai</RadioButton>
<RadioButton value="c">Beijing</RadioButton>
<RadioButton value="d">Chengdu</RadioButton>
</RadioGroup>
</div>
<div style={{ marginTop: 16 }}>
<RadioGroup disabled onChange={onChange} defaultValue="a">
<RadioButton value="a">Hangzhou</RadioButton>
<RadioButton value="b">Shanghai</RadioButton>
<RadioButton value="c">Beijing</RadioButton>
<RadioButton value="d">Chengdu</RadioButton>
</RadioGroup>
</div>
</div>
<div style={{ marginTop: 16 }}>
<RadioGroup onChange={onChange} defaultValue="a">
<RadioButton value="a">Hangzhou</RadioButton>
<RadioButton value="b" disabled>Shanghai</RadioButton>
<RadioButton value="c">Beijing</RadioButton>
<RadioButton value="d">Chengdu</RadioButton>
</RadioGroup>
</div>
<div style={{ marginTop: 16 }}>
<RadioGroup disabled onChange={onChange} defaultValue="a">
<RadioButton value="a">Hangzhou</RadioButton>
<RadioButton value="b">Shanghai</RadioButton>
<RadioButton value="c">Beijing</RadioButton>
<RadioButton value="d">Chengdu</RadioButton>
</RadioGroup>
</div>
</div>, mountNode);
, mountNode);
```

View File

@ -18,30 +18,32 @@ import { Radio } from 'antd';
const RadioButton = Radio.Button;
const RadioGroup = Radio.Group;
ReactDOM.render(<div>
ReactDOM.render(
<div>
<RadioGroup defaultValue="a" size="large">
<RadioButton value="a">Hangzhou</RadioButton>
<RadioButton value="b">Shanghai</RadioButton>
<RadioButton value="c">Beijing</RadioButton>
<RadioButton value="d">Chengdu</RadioButton>
</RadioGroup>
<div>
<RadioGroup defaultValue="a" size="large">
<RadioButton value="a">Hangzhou</RadioButton>
<RadioButton value="b">Shanghai</RadioButton>
<RadioButton value="c">Beijing</RadioButton>
<RadioButton value="d">Chengdu</RadioButton>
</RadioGroup>
</div>
<div style={{ marginTop: 16 }}>
<RadioGroup defaultValue="a">
<RadioButton value="a">Hangzhou</RadioButton>
<RadioButton value="b">Shanghai</RadioButton>
<RadioButton value="c">Beijing</RadioButton>
<RadioButton value="d">Chengdu</RadioButton>
</RadioGroup>
</div>
<div style={{ marginTop: 16 }}>
<RadioGroup defaultValue="a" size="small">
<RadioButton value="a">Hangzhou</RadioButton>
<RadioButton value="b">Shanghai</RadioButton>
<RadioButton value="c">Beijing</RadioButton>
<RadioButton value="d">Chengdu</RadioButton>
</RadioGroup>
</div>
</div>
<div style={{ marginTop: 16 }}>
<RadioGroup defaultValue="a">
<RadioButton value="a">Hangzhou</RadioButton>
<RadioButton value="b">Shanghai</RadioButton>
<RadioButton value="c">Beijing</RadioButton>
<RadioButton value="d">Chengdu</RadioButton>
</RadioGroup>
</div>
<div style={{ marginTop: 16 }}>
<RadioGroup defaultValue="a" size="small">
<RadioButton value="a">Hangzhou</RadioButton>
<RadioButton value="b">Shanghai</RadioButton>
<RadioButton value="c">Beijing</RadioButton>
<RadioButton value="d">Chengdu</RadioButton>
</RadioGroup>
</div>
</div>, mountNode);
, mountNode);
```

View File

@ -19,7 +19,6 @@ import { Rate } from 'antd';
class Rater extends React.Component {
state = {
value: 3,
count: null,
}
handleChange = (value) => {
this.setState({ value });

View File

@ -22,7 +22,7 @@ import { Select } from 'antd';
const Option = Select.Option;
function handleChange(value) {
console.log(value); // { key: "lucy", label: "Lucy (101)" }
console.log(value); // { key: "lucy", label: "Lucy (101)" }
}
ReactDOM.render(

View File

@ -16,11 +16,13 @@ With text and icon.
````jsx
import { Switch, Icon } from 'antd';
ReactDOM.render(<div>
<Switch checkedChildren="开" unCheckedChildren="关" />
<br />
<Switch checkedChildren="1" unCheckedChildren="0" />
<br />
<Switch checkedChildren={<Icon type="check" />} unCheckedChildren={<Icon type="cross" />} />
</div>, mountNode);
ReactDOM.render(
<div>
<Switch checkedChildren="开" unCheckedChildren="关" />
<br />
<Switch checkedChildren="1" unCheckedChildren="0" />
<br />
<Switch checkedChildren={<Icon type="check" />} unCheckedChildren={<Icon type="cross" />} />
</div>
, mountNode);
````

View File

@ -94,10 +94,12 @@ describe('Table.filter', () => {
const dropdown = wrapper.find('Dropdown').first();
expect(dropdown.props().visible).toBe(true);
wrapper.setProps({ columns: [{
...column,
filterDropdownVisible: false,
}] });
wrapper.setProps({
columns: [{
...column,
filterDropdownVisible: false,
}],
});
expect(dropdown.props().visible).toBe(false);
});
@ -124,10 +126,12 @@ describe('Table.filter', () => {
}));
expect(wrapper.find('tbody tr').length).toBe(1);
wrapper.setProps({ columns: [{
...column,
filteredValue: [],
}] });
wrapper.setProps({
columns: [{
...column,
filteredValue: [],
}],
});
expect(wrapper.find('tbody tr').length).toBe(4);
});
@ -140,10 +144,12 @@ describe('Table.filter', () => {
}));
expect(wrapper.find('tbody tr').length).toBe(1);
wrapper.setProps({ columns: [{
...column,
filteredValue: null,
}] });
wrapper.setProps({
columns: [{
...column,
filteredValue: null,
}],
});
expect(wrapper.find('tbody tr').length).toBe(4);
});

View File

@ -14,8 +14,12 @@ const columns = [
];
const columnsFixed = [
{ title: 'Full Name', width: 100, dataIndex: 'name', key: 'name', fixed: 'left' },
{ title: 'Age', width: 100, dataIndex: 'age', key: 'age', fixed: 'left' },
{
title: 'Full Name', width: 100, dataIndex: 'name', key: 'name', fixed: 'left',
},
{
title: 'Age', width: 100, dataIndex: 'age', key: 'age', fixed: 'left',
},
{ title: 'Column 1', dataIndex: 'address', key: '1' },
{ title: 'Column 2', dataIndex: 'address', key: '2' },
{ title: 'Column 3', dataIndex: 'address', key: '3' },

View File

@ -40,7 +40,7 @@ function NestedTable() {
dataIndex: 'operation',
key: 'operation',
render: () => (
<span className={'table-operation'}>
<span className="table-operation">
<a href="#">Pause</a>
<a href="#">Stop</a>
<Dropdown overlay={menu}>

View File

@ -40,7 +40,7 @@ for (let i = 0; i < 46; i++) {
class App extends React.Component {
state = {
selectedRowKeys: [], // Check here to configure the default column
selectedRowKeys: [], // Check here to configure the default column
loading: false,
};
start = () => {

View File

@ -40,7 +40,7 @@ for (let i = 0; i < 46; i++) {
class App extends React.Component {
state = {
selectedRowKeys: [], // Check here to configure the default column
selectedRowKeys: [], // Check here to configure the default column
};
onSelectChange = (selectedRowKeys) => {
console.log('selectedRowKeys changed: ', selectedRowKeys);
@ -57,7 +57,7 @@ class App extends React.Component {
text: 'Select All Data',
onSelect: () => {
this.setState({
selectedRowKeys: [...Array(46).keys()], // 0...45
selectedRowKeys: [...Array(46).keys()], // 0...45
});
},
}, {

View File

@ -55,7 +55,7 @@ const rowSelection = {
console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
},
getCheckboxProps: record => ({
disabled: record.name === 'Disabled User', // Column configuration not to be checked
disabled: record.name === 'Disabled User', // Column configuration not to be checked
}),
};

View File

@ -4,7 +4,7 @@ import Search from '../search';
describe('Search', () => {
it('should show cross icon when input value exists', () => {
const wrapper = mount(<Search value={''} />);
const wrapper = mount(<Search value="" />);
expect(wrapper).toMatchSnapshot();

View File

@ -53,8 +53,8 @@ class App extends React.Component {
);
return {
label: customLabel, // for displayed item
value: item.title, // for title and filter matching
label: customLabel, // for displayed item
value: item.title, // for title and filter matching
};
}
render() {

View File

@ -27,7 +27,7 @@ const props = {
uid: 1,
name: 'xxx.png',
status: 'done',
reponse: 'Server Error 500', // custom error message to show
reponse: 'Server Error 500', // custom error message to show
url: 'http://www.baidu.com/xxx.png',
}, {
uid: 2,
@ -38,7 +38,7 @@ const props = {
uid: 3,
name: 'zzz.png',
status: 'error',
reponse: 'Server Error 500', // custom error message to show
reponse: 'Server Error 500', // custom error message to show
url: 'http://www.baidu.com/zzz.png',
}],
};

View File

@ -59,8 +59,8 @@ When uploading state change, it returns:
{
uid: 'uid', // unique identifiernegative is recommendto prevent interference with internal generated id
name: 'xx.png' // file name
status: 'done', // optionsuploading, done, error, removed
response: '{"status": "success"}', // response from server
status: 'done', // optionsuploading, done, error, removed
response: '{"status": "success"}', // response from server
}
```

View File

@ -60,8 +60,8 @@ title: Upload
{
uid: 'uid', // 文件唯一标识,建议设置为负数,防止和内部产生的 id 冲突
name: 'xx.png' // 文件名
status: 'done', // 状态有uploading done error removed
response: '{"status": "success"}', // 服务端响应内容
status: 'done', // 状态有uploading done error removed
response: '{"status": "success"}', // 服务端响应内容
}
```
> `antd@1.9.0` 之前multiple 模式下,此参数为一个对象数组 `[file, ...]``antd@1.9.0` 开始无论是否多选,均为一个对象。

View File

@ -107,17 +107,17 @@
"enquire.js": "^2.1.1",
"enzyme": "^2.6.0",
"enzyme-to-json": "^1.3.0",
"eslint": "^3.0.1",
"eslint": "^4.8.0",
"eslint-config-airbnb": "latest",
"eslint-plugin-babel": "^4.0.0",
"eslint-plugin-import": "^2.2.0",
"eslint-plugin-jsx-a11y": "^5.1.1",
"eslint-plugin-jsx-a11y": "^6.0.2",
"eslint-plugin-markdown": "~1.0.0-beta.4",
"eslint-plugin-react": "^7.0.1",
"eslint-tinker": "^0.4.0",
"fetch-jsonp": "^1.0.3",
"glob": "^7.1.1",
"jest": "^20.0.4",
"jest": "^21.1.0",
"jsonml.js": "^0.1.0",
"lint-staged": "^4.0.2",
"mockdate": "^2.0.1",

View File

@ -6,7 +6,7 @@ const contentTmpl = './template/Content/index';
function pickerGenerator(module) {
const tester = new RegExp(`^docs/${module}`);
return (markdownData) => {
const filename = markdownData.meta.filename;
const { filename } = markdownData.meta;
if (tester.test(filename) &&
!/\/demo$/.test(path.dirname(filename))) {
return {
@ -25,7 +25,7 @@ module.exports = {
},
pick: {
components(markdownData) {
const filename = markdownData.meta.filename;
const { filename } = markdownData.meta;
if (!/^components/.test(filename) ||
/[/\\]demo$/.test(path.dirname(filename))) return;

View File

@ -5,10 +5,10 @@ import ColorBlock from './ColorBlock';
import ColorPicker from './ColorPicker';
const easing = BezierEasing.apply(null, [0.26, 0.09, 0.37, 0.18]); // 线
const warmDark = 0.5; //
const warmRotate = -26; //
const coldDark = 0.55; //
const coldRotate = 10; //
const warmDark = 0.5; //
const warmRotate = -26; //
const coldDark = 0.55; //
const coldRotate = 10; //
// eslint-disable-next-line
export default class ColorPaletteTool extends Component {

View File

@ -65,12 +65,12 @@ export default class Article extends React.Component {
});
}
render() {
const props = this.props;
const content = props.content;
const { props } = this;
const { content } = props;
const { meta, description } = content;
const { title, subtitle, filename } = meta;
const locale = this.context.intl.locale;
const { locale } = this.context.intl;
const isNotTranslated = locale === 'en-US' && typeof title === 'object';
return (
<DocumentTitle title={`${title[locale] || title} - Ant Design`}>

View File

@ -28,10 +28,10 @@ export default class ComponentDoc extends React.Component {
}
render() {
const props = this.props;
const { props } = this;
const { doc, location } = props;
const { content, meta } = doc;
const locale = this.context.intl.locale;
const { locale } = this.context.intl;
const demos = Object.keys(props.demos).map(key => props.demos[key]);
const expand = this.state.expandAll;
@ -39,7 +39,7 @@ export default class ComponentDoc extends React.Component {
const leftChildren = [];
const rightChildren = [];
const showedDemo = demos.some(demo => demo.meta.only) ?
demos.filter(demo => demo.meta.only) : demos.filter(demo => demo.preview);
demos.filter(demo => demo.meta.only) : demos.filter(demo => demo.preview);
showedDemo.sort((a, b) => a.meta.order - b.meta.order)
.forEach((demoData, index) => {
const demoElem = (
@ -63,7 +63,7 @@ export default class ComponentDoc extends React.Component {
});
const jumper = showedDemo.map((demo) => {
const title = demo.meta.title;
const { title } = demo.meta;
const localizeTitle = title[locale] || title;
return (
<li key={demo.meta.id} title={localizeTitle}>

View File

@ -82,8 +82,8 @@ export default class Demo extends React.Component {
}
render() {
const state = this.state;
const props = this.props;
const { state } = this;
const { props } = this;
const {
meta,
src,
@ -105,7 +105,7 @@ export default class Demo extends React.Component {
expand: codeExpand,
});
const locale = this.context.intl.locale;
const { locale } = this.context.intl;
const localizedTitle = meta.title[locale] || meta.title;
const localizeIntro = content[locale] || content;
const introChildren = props.utils

View File

@ -7,22 +7,22 @@ import Article from './Article';
import ComponentDoc from './ComponentDoc';
import * as utils from '../utils';
const SubMenu = Menu.SubMenu;
const { SubMenu } = Menu;
function getActiveMenuItem(props) {
const children = props.params.children;
const { children } = props.params;
return (children && children.replace('-cn', '')) ||
props.location.pathname.replace(/(^\/|-cn$)/g, '');
}
function getModuleData(props) {
const pathname = props.location.pathname;
const { pathname } = props.location;
const moduleName = /^\/?components/.test(pathname) ?
'components' : pathname.split('/').filter(item => item).slice(0, 2).join('/');
'components' : pathname.split('/').filter(item => item).slice(0, 2).join('/');
const moduleData = moduleName === 'components' || moduleName === 'docs/react' ||
moduleName === 'changelog' || moduleName === 'changelog-cn' ?
[...props.picked.components, ...props.picked['docs/react'], ...props.picked.changelog] :
props.picked[moduleName];
[...props.picked.components, ...props.picked['docs/react'], ...props.picked.changelog] :
props.picked[moduleName];
const excludedSuffix = utils.isZhCN(props.location.pathname) ? 'en-US.md' : 'zh-CN.md';
return moduleData.filter(({ meta }) => !meta.filename.endsWith(excludedSuffix));
}
@ -58,7 +58,7 @@ export default class MainContent extends React.Component {
}
componentDidUpdate() {
if (!location.hash) {
if (!window.location.hash) {
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
return;
@ -67,7 +67,7 @@ export default class MainContent extends React.Component {
clearTimeout(this.timer);
}
this.timer = setTimeout(() => {
location.hash = location.hash;
window.location.hash = window.location.hash;
}, 10);
}
@ -80,7 +80,7 @@ export default class MainContent extends React.Component {
}
getSideBarOpenKeys(nextProps) {
const pathname = nextProps.location.pathname;
const { pathname } = nextProps.location;
const prevModule = this.currentModule;
this.currentModule = pathname.replace(/^\//).split('/')[1] || 'components';
if (this.currentModule === 'react') {
@ -95,14 +95,14 @@ export default class MainContent extends React.Component {
}
generateMenuItem(isTop, item) {
const locale = this.context.intl.locale;
const { locale } = this.context.intl;
const key = fileNameToPath(item.filename);
const text = isTop ?
item.title[locale] || item.title : [
<span key="english">{item.title}</span>,
<span className="chinese" key="chinese">{item.subtitle}</span>,
];
const disabled = item.disabled;
item.title[locale] || item.title : [
<span key="english">{item.title}</span>,
<span className="chinese" key="chinese">{item.subtitle}</span>,
];
const { disabled } = item;
const url = item.filename.replace(/(\/index)?((\.zh-CN)|(\.en-US))?\.md$/i, '').toLowerCase();
const child = !item.link ? (
<Link
@ -193,11 +193,11 @@ export default class MainContent extends React.Component {
}
render() {
const props = this.props;
const { props } = this;
const activeMenuItem = getActiveMenuItem(props);
const menuItems = this.getMenuItems();
const { prev, next } = this.getFooterNav(menuItems, activeMenuItem);
const localizedPageData = props.localizedPageData;
const { localizedPageData } = props;
const mainContainerClass = classNames('main-container', {
'main-container-component': !!props.demos,
});

View File

@ -7,18 +7,18 @@ function isChangelog(pathname) {
}
export default collect(async (nextProps) => {
const pathname = nextProps.location.pathname;
const { pathname } = nextProps.location;
const pageDataPath = pathname.replace('-cn', '').split('/');
const pageData = isChangelog(pathname) ?
nextProps.data.changelog.CHANGELOG :
nextProps.utils.get(nextProps.data, pageDataPath);
nextProps.data.changelog.CHANGELOG :
nextProps.utils.get(nextProps.data, pageDataPath);
if (!pageData) {
throw 404; // eslint-disable-line no-throw-literal
}
const locale = utils.isZhCN(pathname) ? 'zh-CN' : 'en-US';
const pageDataPromise = typeof pageData === 'function' ?
pageData() : (pageData[locale] || pageData.index[locale] || pageData.index)();
pageData() : (pageData[locale] || pageData.index[locale] || pageData.index)();
const demosFetcher = nextProps.utils.get(nextProps.data, [...pageDataPath, 'demo']);
if (demosFetcher) {
const [localizedPageData, demos] = await Promise.all([pageDataPromise, demosFetcher()]);

View File

@ -19,7 +19,9 @@ export default function Page4() {
<TweenOne
key="image"
className="image4 bottom-wrapper"
animation={{ y: 0, opacity: 1, duration: 550, delay: 150, ease: 'easeOutQuad' }}
animation={{
y: 0, opacity: 1, duration: 550, delay: 150, ease: 'easeOutQuad',
}}
style={{ transform: 'translateY(50px)', opacity: 0 }}
/>
</ScrollOverPack>

View File

@ -59,7 +59,7 @@ class Footer extends React.Component {
}
infoNewVersion() {
const messages = this.props.intl.messages;
const { messages } = this.props.intl;
Modal.info({
title: messages['app.publish.title'],
content: (

View File

@ -7,7 +7,7 @@ import { Select, Menu, Row, Col, Icon, Button, Popover, AutoComplete, Input } fr
import * as utils from '../utils';
import { version as antdVersion } from '../../../../package.json';
const Option = AutoComplete.Option;
const { Option } = AutoComplete;
const searchEngine = 'Google';
const searchLink = 'https://www.google.com/#q=site:ant.design+';
@ -25,7 +25,7 @@ export default class Header extends React.Component {
componentDidMount() {
this.context.router.listen(this.handleHideMenu);
const searchInput = this.searchInput;
const { searchInput } = this;
/* eslint-disable global-require */
require('enquire.js')
.register('only screen and (min-width: 0) and (max-width: 992px)', {
@ -90,16 +90,16 @@ export default class Header extends React.Component {
}
handleLangChange = () => {
const pathname = this.props.location.pathname;
const currentProtocol = `${location.protocol}//`;
const currentHref = location.href.substr(currentProtocol.length);
const { pathname } = this.props.location;
const currentProtocol = `${window.location.protocol}//`;
const currentHref = window.location.href.substr(currentProtocol.length);
if (utils.isLocalStorageNameSupported()) {
localStorage.setItem('locale', utils.isZhCN(pathname) ? 'en-US' : 'zh-CN');
}
location.href = currentProtocol + currentHref.replace(
location.pathname,
window.location.href = currentProtocol + currentHref.replace(
window.location.pathname,
utils.getLocalizedPathname(pathname, !utils.isZhCN(pathname)),
);
}
@ -113,18 +113,20 @@ export default class Header extends React.Component {
render() {
const { inputValue, menuMode, menuVisible } = this.state;
const { location, picked, isFirstScreen, themeConfig } = this.props;
const {
location, picked, isFirstScreen, themeConfig,
} = this.props;
const docVersions = { ...themeConfig.docVersions, [antdVersion]: antdVersion };
const versionOptions = Object.keys(docVersions)
.map(version => <Option value={docVersions[version]} key={version}>{version}</Option>);
const components = picked.components;
const { components } = picked;
const module = location.pathname.replace(/(^\/|\/$)/g, '').split('/').slice(0, -1).join('/');
let activeMenuItem = module || 'home';
if (activeMenuItem === 'components' || location.pathname === 'changelog') {
activeMenuItem = 'docs/react';
}
const locale = this.context.intl.locale;
const { locale } = this.context.intl;
const isZhCN = locale === 'zh-CN';
const excludedSuffix = isZhCN ? 'en-US.md' : 'zh-CN.md';
const options = components
@ -132,7 +134,7 @@ export default class Header extends React.Component {
.map(({ meta }) => {
const pathSnippet = meta.filename.split('/')[1];
const url = `/components/${pathSnippet}`;
const subtitle = meta.subtitle;
const { subtitle } = meta;
return (
<Option value={url} key={url} data-label={`${meta.title.toLowerCase()} ${subtitle || ''}`}>
<strong>{meta.title}</strong>
@ -204,21 +206,23 @@ export default class Header extends React.Component {
const searchPlaceholder = locale === 'zh-CN' ? '搜索组件...' : 'Search Components...';
return (
<header id="header" className={headerClassName}>
{menuMode === 'inline' ? <Popover
overlayClassName="popover-menu"
placement="bottomRight"
content={menu}
trigger="click"
visible={menuVisible}
arrowPointAtCenter
onVisibleChange={this.onMenuVisibleChange}
>
<Icon
className="nav-phone-icon"
type="menu"
onClick={this.handleShowMenu}
/>
</Popover> : null}
{menuMode === 'inline' ? (
<Popover
overlayClassName="popover-menu"
placement="bottomRight"
content={menu}
trigger="click"
visible={menuVisible}
arrowPointAtCenter
onVisibleChange={this.onMenuVisibleChange}
>
<Icon
className="nav-phone-icon"
type="menu"
onClick={this.handleShowMenu}
/>
</Popover>
) : null}
<Row>
<Col lg={4} md={5} sm={24} xs={24}>
<Link to={utils.getLocalizedPathname('/', isZhCN)} id="logo">

View File

@ -28,7 +28,7 @@ export default class Layout extends React.Component {
constructor(props) {
super(props);
const pathname = props.location.pathname;
const { pathname } = props.location;
const appLocale = utils.isZhCN(pathname) ? cnLocale : enLocale;
addLocaleData(appLocale.data);
this.state = {