chore: use umi father build (#250)

* chore: use umi father build

* set node verison

* change now distDir

.eslintrc.js

@@ -0,0 +1,22 @@
+const base = require('@umijs/fabric/dist/eslint');
+
+module.exports = {
+  ...base,
+  rules: {
+    ...base.rules,
+    'react/sort-comp': 0,
+    'react/no-array-index-key': 0,
+    'react/no-access-state-in-setstate': 0,
+    'no-plusplus': 0,
+    'no-param-reassign': 0,
+    'react/require-default-props': 0,
+    'react/require-default-props': 0,
+    'no-underscore-dangle': 0,
+    'react/no-find-dom-node': 0,
+    'no-mixed-operators': 0,
+    'prefer-destructuring': 0,
+    'react/no-unused-prop-types': 0,
+    'max-len': 0,
+    'brace-style': 0,
+  },
+};

.fatherrc.js

@@ -0,0 +1,8 @@
+export default {
+  cjs: "babel",
+  esm: { type: "babel", importLibToEs: true },
+  preCommit: {
+    eslint: true,
+    prettier: true
+  }
+};

.gitignore

@@ -1,3 +1,4 @@
+.storybook
 *.iml
 *.log
 *.log.*

.prettierrc

@@ -0,0 +1,14 @@
+{
+  "singleQuote": true,
+  "trailingComma": "all",
+  "printWidth": 100,
+  "proseWrap": "never",
+  "overrides": [
+    {
+      "files": ".prettierrc",
+      "options": {
+        "parser": "json"
+      }
+    }
+  ]
+}

.travis.yml

@@ -8,7 +8,7 @@ notifications:
   - [email protected]
 
 node_js:
-- 6.0.0
+- 10
 
 before_install:
 - |
@@ -30,11 +30,6 @@ env:
   - TEST_TYPE=lint
   - TEST_TYPE=test
   - TEST_TYPE=coverage
-  - TEST_TYPE=saucelabs
   global:
   - secure: S1VwbaPzLnSH/IUT/wlJulxAX5VHRIDmSt53h/ycHcZsszUpWcLCJRQAe0fTVB2dAx5MdBbSZ+o+tr3tRwVB5TRAYm0oTCsYAkOZaWOB28RuUQtdGt3wf9xxTG1UiPiaLLUW3waX9zAaf3yqKBcJGf1op0RD8dksxbCFw/7xVbU=
   - secure: EBEDg8k///IlEsnx0AE8X3mbFl0QE5+xGKbG4AxXlGZda12uTIPUSMKJzdZQ2hVbZXduTzf1cQl9rcu9nGoSnkL/DWnIax9cvHi+1orx5+YPlxPHNWAwWByTnHosBn2MJhfy1s5paJfHC9cUzmmEL6x4fYthWxjsPUo+irEZH6E=
-
-matrix:
-  allow_failures:
-  - env: "TEST_TYPE=saucelabs"

examples/activeKey.js

@@ -1,13 +1,16 @@
-/* eslint react/no-multi-comp:0, no-console:0, react/prop-types:0 */
-import 'rc-tabs/assets/index.less';
+/* eslint-disable no-console,react/button-has-type */
+import '../assets/index.less';
 import React from 'react';
-import ReactDOM from 'react-dom';
-import Tabs, { TabPane } from 'rc-tabs';
-import TabContent from 'rc-tabs/lib/SwipeableTabContent';
-import ScrollableInkTabBar from 'rc-tabs/lib/ScrollableInkTabBar';
+import Tabs, { TabPane } from '../src';
+import TabContent from '../src/SwipeableTabContent';
+import ScrollableInkTabBar from '../src/ScrollableInkTabBar';
 
 const PanelContent = ({ id }) => (
-  <div>{[1, 2, 3, 4].map(item => <p key={item}>{id}</p>)}</div>
+  <div>
+    {[1, 2, 3, 4].map(item => (
+      <p key={item}>{id}</p>
+    ))}
+  </div>
 );
 
 class Demo extends React.Component {
@@ -16,41 +19,41 @@ class Demo extends React.Component {
     start: 0,
   };
 
-  onChange = (activeKey) => {
+  onChange = activeKey => {
     console.log(`onChange ${activeKey}`);
     this.setState({
       activeKey,
     });
-  }
+  };
 
-  onTabClick = (key) => {
+  onTabClick = key => {
     console.log(`onTabClick ${key}`);
     if (key === this.state.activeKey) {
       this.setState({
         activeKey: '',
       });
     }
-  }
+  };
 
   tick = () => {
     this.setState({
       start: this.state.start + 10,
     });
-  }
+  };
 
   handleNotExistKey = () => {
     this.setState({
       activeKey: '-1',
     });
-  }
+  };
 
   render() {
-    const start = this.state.start;
+    const { start } = this.state;
     return (
       <div style={{ margin: 20 }}>
         <h1>Simple Tabs</h1>
         <Tabs
-          renderTabBar={() => <ScrollableInkTabBar onTabClick={this.onTabClick}/>}
+          renderTabBar={() => <ScrollableInkTabBar onTabClick={this.onTabClick} />}
           renderTabContent={() => <TabContent animatedWithMargin />}
           activeKey={this.state.activeKey}
           onChange={this.onChange}
@@ -69,14 +72,11 @@ class Demo extends React.Component {
           </TabPane>
         </Tabs>
         <button onClick={this.tick}>rerender</button>
-        <button onClick={this.handleNotExistKey}
-          style={{ marginLeft: 10 }}
-        >
+        <button onClick={this.handleNotExistKey} style={{ marginLeft: 10 }}>
           change to a non-existent activeKey
         </button>
       </div>
     );
   }
 }
-
-ReactDOM.render(<Demo />, document.getElementById('__react-content'));
+export default Demo;

examples/add.js

@@ -1,59 +1,70 @@
-/* eslint react/no-multi-comp:0, no-console:0, no-alert:0, no-undef: 0 */
-import 'rc-tabs/assets/index.less';
+/* eslint-disable no-console,react/button-has-type,no-alert,no-plusplus */
+import '../assets/index.less';
 import React from 'react';
-import ReactDOM from 'react-dom';
-import Tabs, { TabPane } from 'rc-tabs';
-import TabContent from 'rc-tabs/lib/TabContent';
-import ScrollableInkTabBar from 'rc-tabs/lib/ScrollableInkTabBar';
+import Tabs, { TabPane } from '../src';
+import TabContent from '../src/TabContent';
+import ScrollableInkTabBar from '../src/ScrollableInkTabBar';
 
 let index = 1;
 
 class Demo extends React.Component {
   state = {
-    tabs: [{
-      title: '初始',
-      content: '初始内容',
-    }],
+    tabs: [
+      {
+        title: '初始',
+        content: '初始内容',
+      },
+    ],
     activeKey: '初始',
   };
 
-  onTabChange = (activeKey) => {
+  onTabChange = activeKey => {
     this.setState({
       activeKey,
     });
-  }
+  };
 
   construct() {
     const disabled = true;
-    return this.state.tabs.map((t) => {
-      return (<TabPane
-        tab={<span>{t.title}
-          <a
-            style={{
-              position: 'absolute',
-              cursor: 'pointer',
-              color: 'red',
-              right: 5,
-              top: 0,
-            }}
-            onClick={(e) => {
-              this.remove(t.title, e)
-            }}
-          >x</a>
-      </span>}
-        key={t.title}
-      >
-        <div style={{ padding: 100 }}>
-          {t.content}
-        </div>
-      </TabPane>);
-    }).concat([
-      <TabPane
-        tab={<a style={{ color: 'black', cursor: 'pointer' }} onClick={this.add}> + 添加</a>}
-        disabled={disabled}
-        key="__add"
-      />,
-    ]);
+    return this.state.tabs
+      .map(t => (
+        <TabPane
+          tab={
+            <span>
+              {t.title}
+              <a
+                style={{
+                  position: 'absolute',
+                  cursor: 'pointer',
+                  color: 'red',
+                  right: 5,
+                  top: 0,
+                }}
+                onClick={e => {
+                  this.remove(t.title, e);
+                }}
+              >
+                x
+              </a>
+            </span>
+          }
+          key={t.title}
+        >
+          <div style={{ padding: 100 }}>{t.content}</div>
+        </TabPane>
+      ))
+      .concat([
+        <TabPane
+          tab={
+            <a style={{ color: 'black', cursor: 'pointer' }} onClick={this.add}>
+              {' '}
+              + 添加
+            </a>
+          }
+          disabled={disabled}
+          key="__add"
+        />,
+      ]);
   }
 
   remove = (title, e) => {
@@ -70,7 +81,8 @@ class Demo extends React.Component {
       foundIndex = i;
       return false;
     });
-    let activeKey = this.state.activeKey;
+
+    let { activeKey } = this.state;
     if (activeKey === title) {
       if (foundIndex) {
         foundIndex--;
@@ -81,9 +93,9 @@ class Demo extends React.Component {
       tabs: after,
       activeKey,
     });
-  }
+  };
 
-  add = (e) => {
+  add = e => {
     e.stopPropagation();
     index++;
     const newTab = {
@@ -94,7 +106,7 @@ class Demo extends React.Component {
       tabs: this.state.tabs.concat(newTab),
       activeKey: `名称: ${index}`,
     });
-  }
+  };
 
   render() {
     const tabStyle = {
@@ -107,13 +119,9 @@ class Demo extends React.Component {
         <div style={tabStyle}>
           <Tabs
             renderTabBar={() => (
-              <ScrollableInkTabBar
-                extraContent={
-                  <button onClick={this.add}>+添加</button>
-                }
-              />
+              <ScrollableInkTabBar extraContent={<button onClick={this.add}>+添加</button>} />
             )}
-            renderTabContent={() => <TabContent/>}
+            renderTabContent={() => <TabContent />}
             activeKey={this.state.activeKey}
             onChange={this.onTabChange}
           >
@@ -125,4 +133,4 @@ class Demo extends React.Component {
   }
 }
 
-ReactDOM.render(<Demo />, document.getElementById('__react-content'));
+export default Demo;