style: update code style to please lint, close: #2811

.eslintrc.js

@@ -35,6 +35,9 @@ const eslintrc = {
     'consistent-return': 0,
     'no-redeclare': 0,
     'react/require-extension': 0,
+    'react/jsx-indent': 0,
+    'jsx-a11y/no-static-element-interactions': 0,
+    'jsx-a11y/anchor-has-content': 0,
   },
 };
 
@@ -47,6 +50,7 @@ if (process.env.RUN_ENV === 'DEMO') {
 
   Object.assign(eslintrc.rules, {
     'no-console': 0,
+    'no-plusplus': 0,
     'eol-last': 0,
     'prefer-rest-params': 0,
     'react/no-multi-comp': 0,

components/breadcrumb/demo/router.md

@@ -29,7 +29,7 @@ const Apps = () => (
   </ul>
 );
 
-const Home = (props) => (
+const Home = props => (
   <div>
     <div className="demo-nav">
       <Link to="/">Home</Link>

components/cascader/demo/custom-render.md

@@ -52,7 +52,7 @@ const displayRender = (labels, selectedOptions) => labels.map((label, i) => {
   if (i === labels.length - 1) {
     return (
       <span key={option.value}>
-        {label} (<a onClick={(e) => handleAreaClick(e, label, option)}>{option.code}</a>)
+        {label} (<a onClick={e => handleAreaClick(e, label, option)}>{option.code}</a>)
       </span>
     );
   }

components/menu/demo/sider-current.md

@@ -33,7 +33,7 @@ const Sider = React.createClass({
     this.setState({ current: e.key });
   },
   onOpenChange(openKeys) {
-    const latestOpenKey = openKeys.find((key) => !(this.state.openKeys.indexOf(key) > -1));
+    const latestOpenKey = openKeys.find(key => !(this.state.openKeys.indexOf(key) > -1));
     this.setState({ openKeys: this.getKeyPath(latestOpenKey) });
   },
   getKeyPath(key) {

components/notification/demo/with-icon.md

@@ -16,7 +16,7 @@ A notification box with a icon at the left side.
 ````jsx
 import { Button, notification } from 'antd';
 
-const openNotificationWithIcon = (type) => () => (
+const openNotificationWithIcon = type => () => (
   notification[type]({
     message: 'Notification Title',
     description: 'This is the content of the notification. This is the content of the notification. This is the content of the notification.',

components/select/demo/search-box.md

@@ -64,7 +64,7 @@ const SearchInput = React.createClass({
   },
   handleChange(value) {
     this.setState({ value });
-    fetch(value, (data) => this.setState({ data }));
+    fetch(value, data => this.setState({ data }));
   },
   handleSubmit() {
     console.log('输入框内容是: ', this.state.value);

components/table/demo/ajax.md

@@ -75,7 +75,7 @@ const Test = React.createClass({
         ...params,
       },
       type: 'json',
-    }).then(data => {
+    }).then((data) => {
       const pagination = this.state.pagination;
       // Read total count from server
       // pagination.total = data.totalCount;

components/table/demo/basic.md

@@ -20,7 +20,7 @@ const columns = [{
   title: '姓名',
   dataIndex: 'name',
   key: 'name',
-  render: (text) => <a href="#">{text}</a>,
+  render: text => <a href="#">{text}</a>,
 }, {
   title: '年龄',
   dataIndex: 'age',

components/table/demo/bordered.md

@@ -19,7 +19,7 @@ import { Table } from 'antd';
 const columns = [{
   title: '姓名',
   dataIndex: 'name',
-  render: (text) => <a href="#">{text}</a>,
+  render: text => <a href="#">{text}</a>,
 }, {
   title: '资产',
   className: 'column-money',

package.json

@@ -91,13 +91,13 @@
     "enquire.js": "^2.1.1",
     "es6-shim": "^0.35.0",
     "eslint": "^3.0.1",
-    "eslint-config-airbnb": "^10.0.1",
+    "eslint-config-airbnb": "latest",
     "eslint-plugin-babel": "^3.0.0",
     "eslint-plugin-import": "^1.6.1",
     "eslint-plugin-jsx-a11y": "^2.0.1",
     "eslint-plugin-markdown": "*",
     "eslint-plugin-react": "^6.1.2",
-    "eslint-tinker": "^0.3.1",
+    "eslint-tinker": "^0.4.0",
     "history": "^3.0.0",
     "jest-cli": "^13.2.3",
     "jsonml-to-react-component": "~0.2.0",
@@ -140,7 +140,7 @@
     "tslint": "antd-tools run ts-lint",
     "demolint": "RUN_ENV=DEMO eslint components/*/demo/*.md --ext '.md'",
     "lesshint": "lesshint components -r scripts/lesshint-report.js",
-    "eslint-fix": "eslint --fix components test site scripts ./*.js --ext '.js,.jsx' && eslint-tinker ./components/*/demo/*.md",
+    "eslint-fix": "eslint --fix test site scripts ./.eslintrc.js ./webpack.config.js --ext '.js,.jsx,.tsx' --ignore-pattern '!.eslintrc.js' && eslint-tinker ./components/*/demo/*.md",
     "test": "npm run lint && npm run dist",
     "jest": "jest",
     "pre-publish": "node ./scripts/prepub",

scripts/build-common.js

@@ -1,36 +0,0 @@
-/* eslint strict: 0 */
-'use strict';
-
-const fs = require('fs');
-const path = require('path');
-const utils = require('./utils');
-
-module.exports = function buildCommon(dirs, outputFile) {
-  const mds = utils.findMDFile(dirs, true)
-    .filter((file) => !/\/demo$/i.test(path.dirname(file)))
-    .filter((file) => !/install_en\.md$/gi.test(file)); // TODO
-
-  const addedMd = [];
-  let content = 'module.exports = {';
-  mds.forEach((fileName) => {
-    const localeId = path.basename(fileName, '.md').split('.')[1];
-    const simplifiedFileName = fileName.replace(`.${localeId}`, '');
-    if (addedMd.indexOf(simplifiedFileName) > -1) return;
-
-    const isLocalized = ['zh-CN', 'en-US'].indexOf(localeId) > -1;
-    if (isLocalized) {
-      content += `\n  '${simplifiedFileName}': {` +
-        '\n    localized: true,' +
-        `\n    'zh-CN': require('${path.relative(path.dirname(outputFile), fileName.replace(localeId, 'zh-CN'))}'),` +
-        `\n    'en-US': require('${path.relative(path.dirname(outputFile), fileName.replace(localeId, 'en-US'))}'),` +
-        '\n  },';
-      addedMd.push(simplifiedFileName);
-    } else {
-      const requirePath = path.relative(path.dirname(outputFile), fileName);
-      content += `\n  '${simplifiedFileName}': require('${requirePath}'),`;
-    }
-  });
-  content += '\n};';
-
-  fs.writeFile(outputFile, content);
-};

scripts/update-rc.js

@@ -1,6 +1,7 @@
 #!/usr/bin/env node
 
 /* eslint strict:0, camelcase:0 */
+
 'use strict';
 
 require('antd-tools/lib/updateComponents')((name) => {

site/theme/template/Content/Article.jsx

@@ -20,7 +20,7 @@ export default class Article extends React.Component {
       return;
     }
     const checkImgUrl = 'http://alipay-rmsdeploy-dev-image.oss-cn-hangzhou-zmf.aliyuncs.com/rmsportal/JdVaTbZzPxEldUi.png';
-    this.pingTimer = utils.ping(checkImgUrl, status => {
+    this.pingTimer = utils.ping(checkImgUrl, (status) => {
       if (status === 'responded') {
         links.forEach(link => (link.style.display = 'block'));
       } else {
@@ -40,7 +40,7 @@ export default class Article extends React.Component {
     const timelineItems = [];
     let temp = [];
     let i = 1;
-    Children.forEach(article.props.children, child => {
+    Children.forEach(article.props.children, (child) => {
       if (child.type === 'h2' && temp.length > 0) {
         timelineItems.push(<Timeline.Item key={i}>{temp}</Timeline.Item>);
         temp = [];

site/theme/template/Content/ComponentDoc.jsx

@@ -31,8 +31,8 @@ export default class ComponentDoc extends React.Component {
     const { doc, location } = props;
     const { content, meta } = doc;
     const locale = this.context.intl.locale;
-    const demos = Object.keys(props.demos).map((key) => props.demos[key])
-      .filter((demoData) => !demoData.meta.hidden);
+    const demos = Object.keys(props.demos).map(key => props.demos[key])
+      .filter(demoData => !demoData.meta.hidden);
     const expand = this.state.expandAll;
 
     const isSingleCol = meta.cols === 1;

site/theme/template/Content/MainContent.jsx

@@ -8,6 +8,19 @@ import config from '../../';
 
 const SubMenu = Menu.SubMenu;
 
+function getActiveMenuItem(props) {
+  return props.params.children || props.location.pathname;
+}
+
+function fileNameToPath(filename) {
+  const snippets = filename.replace(/(\/index)?((\.zh-CN)|(\.en-US))?\.md$/i, '').split('/');
+  return snippets[snippets.length - 1];
+}
+
+function isNotTopLevel(level) {
+  return level !== 'topLevel';
+}
+
 export default class MainContent extends React.Component {
   static contextTypes = {
     intl: PropTypes.object.isRequired,
@@ -60,18 +73,9 @@ export default class MainContent extends React.Component {
     this.setState({ openKeys });
   }
 
-  getActiveMenuItem(props) {
-    return props.params.children || props.location.pathname;
-  }
-
-  fileNameToPath(filename) {
-    const snippets = filename.replace(/(\/index)?((\.zh-CN)|(\.en-US))?\.md$/i, '').split('/');
-    return snippets[snippets.length - 1];
-  }
-
   generateMenuItem(isTop, item) {
     const locale = this.context.intl.locale;
-    const key = this.fileNameToPath(item.filename);
+    const key = fileNameToPath(item.filename);
     const text = isTop ?
             item.title[locale] || item.title : [
               <span key="english">{item.title}</span>,
@@ -94,13 +98,9 @@ export default class MainContent extends React.Component {
     );
   }
 
-  isNotTopLevel(level) {
-    return level !== 'topLevel';
-  }
-
   generateSubMenuItems(obj) {
     const topLevel = (obj.topLevel || []).map(this.generateMenuItem.bind(this, true));
-    const itemGroups = Object.keys(obj).filter(this.isNotTopLevel)
+    const itemGroups = Object.keys(obj).filter(isNotTopLevel)
       .sort((a, b) => config.typeOrder[a] - config.typeOrder[b])
       .map((type, index) => {
         const groupItems = obj[type].sort((a, b) => {
@@ -134,7 +134,7 @@ export default class MainContent extends React.Component {
       moduleData, this.context.intl.locale
     );
     const topLevel = this.generateSubMenuItems(menuItems.topLevel);
-    const subMenu = Object.keys(menuItems).filter(this.isNotTopLevel)
+    const subMenu = Object.keys(menuItems).filter(isNotTopLevel)
       .sort((a, b) => config.categoryOrder[a] - config.categoryOrder[b])
       .map((category) => {
         const subMenuItems = this.generateSubMenuItems(menuItems[category]);
@@ -174,7 +174,7 @@ export default class MainContent extends React.Component {
 
   render() {
     const props = this.props;
-    const activeMenuItem = this.getActiveMenuItem(props);
+    const activeMenuItem = getActiveMenuItem(props);
     const menuItems = this.getMenuItems();
     const { prev, next } = this.getFooterNav(menuItems, activeMenuItem);
     const localizedPageData = props.localizedPageData;

site/theme/template/Content/index.jsx

@@ -28,7 +28,7 @@ export function collect(nextProps, callback) {
     promises.push(demos());
   }
   Promise.all(promises)
-    .then((list) => callback(null, {
+    .then(list => callback(null, {
       ...nextProps,
       localizedPageData: list[0],
       demos: list[1],

site/theme/template/Home/Banner.jsx

@@ -7,21 +7,20 @@ import 'react-github-button/assets/style.css';
 import { Icon } from 'antd';
 import QueueAnim from 'rc-queue-anim';
 
-export default class Banner extends React.Component {
-  typeFunc(a) {
+function typeFunc(a) {
   if (a.key === 'line') {
     return 'right';
   } else if (a.key === 'button') {
     return 'bottom';
   }
   return 'left';
-  }
+}
 
-  render() {
+export default function Banner() {
   return (
     <section id="banner">
       <ScrollElement scrollName="banner" className="page">
-          <QueueAnim className="banner-text-wrapper" type={this.typeFunc} delay={300}>
+        <QueueAnim className="banner-text-wrapper" type={typeFunc} delay={300}>
           <h2 key="h2">ANT <p>DESIGN</p></h2>
           <p key="content"><FormattedMessage id="app.home.slogan" /></p>
           <span className="line" key="line" />
@@ -41,5 +40,4 @@ export default class Banner extends React.Component {
       </ScrollElement>
     </section>
   );
-  }
 }

site/theme/template/Home/index.jsx

@@ -6,10 +6,8 @@ import Page1 from './Page1';
 import Page2 from './Page2';
 import Page3 from './Page3';
 import Page4 from './Page4';
-
-export default class Home extends React.Component {
-  // To store style which is only for Home and has conflicts with others.
-  getStyle() {
+// To store style which is only for Home and has conflicts with others.
+function getStyle() {
   return `
     #react-content,
     #react-content > div {
@@ -86,9 +84,9 @@ export default class Home extends React.Component {
       animation: upDownMove 1.2s ease-in-out infinite;
     }
   `;
-  }
+}
 
-  render() {
+export default function Home() {
   return (
     <DocumentTitle title="Ant Design - 一个 UI 设计语言">
       <div className="main-wrapper">
@@ -98,9 +96,8 @@ export default class Home extends React.Component {
         <Page2 />
         <Page3 />
         <Page4 />
-          <style dangerouslySetInnerHTML={{ __html: this.getStyle() }} />
+        <style dangerouslySetInnerHTML={{ __html: getStyle() }} />
       </div>
     </DocumentTitle>
   );
-  }
 }

site/theme/template/Layout/Footer.jsx

@@ -18,25 +18,7 @@ function isLocalStorageNameSupported() {
   }
 }
 
-docVersions[antdVersion] = antdVersion;
-
-export default class Footer extends React.Component {
-  componentDidMount() {
-    // for some iOS
-    // http://stackoverflow.com/a/14555361
-    if (!isLocalStorageNameSupported()) {
-      return;
-    }
-    // 大版本发布后全局弹窗提示
-    //   1. 点击『知道了』之后不再提示
-    //   2. 超过截止日期后不再提示
-    if (localStorage.getItem('infoNewVersionSent') !== 'true' &&
-        new Date().getTime() < new Date('2016/05/22').getTime()) {
-      this.infoNewVersion();
-    }
-  }
-
-  infoNewVersion() {
+function infoNewVersion() {
   Modal.info({
     title: 'antd 新版发布！',
     content: (
@@ -53,6 +35,24 @@ export default class Footer extends React.Component {
     className: 'new-version-info-modal',
     width: 470,
   });
+}
+
+docVersions[antdVersion] = antdVersion;
+
+export default class Footer extends React.Component {
+  componentDidMount() {
+    // for some iOS
+    // http://stackoverflow.com/a/14555361
+    if (!isLocalStorageNameSupported()) {
+      return;
+    }
+    // 大版本发布后全局弹窗提示
+    //   1. 点击『知道了』之后不再提示
+    //   2. 超过截止日期后不再提示
+    if (localStorage.getItem('infoNewVersionSent') !== 'true' &&
+        new Date().getTime() < new Date('2016/05/22').getTime()) {
+      infoNewVersion();
+    }
   }
 
   handleVersionChange = (url) => {

site/theme/template/Layout/index.jsx

@@ -3,8 +3,8 @@ import ReactDOM from 'react-dom';
 import { addLocaleData, IntlProvider } from 'react-intl';
 import Header from './Header';
 import Footer from './Footer';
-import enLocale from '../../en-US.js';
-import cnLocale from '../../zh-CN.js';
+import enLocale from '../../en-US';
+import cnLocale from '../../zh-CN';
 import '../../static/style';
 
 // Expose to iframe