chore: update pkg

.babelrc

@@ -1,15 +1,8 @@
 {
-  "presets": [
-    "es2015",
-    "react",
-    "stage-0"
-  ],
+  "presets": ["@babel/preset-env", "@babel/react"],
   "plugins": [
-    "transform-decorators-legacy",
-    "transform-class-properties",
-    "transform-es2015-spread",
-    "transform-object-rest-spread"
-  ],
-  "ignore": [
+    [ "@babel/plugin-proposal-decorators", { "legacy": true } ],
+    [ "@babel/plugin-proposal-class-properties", { "loose": true } ],
+    [ "import", { "libraryName": "antd" } ]
   ]
 }

.editorconfig

@@ -1,9 +1,11 @@
 root = true
 
 [*]
-charset = utf-8
 indent_style = space
 indent_size = 2
-end_of_line = lf
-insert_final_newline = true
+charset = utf-8
 trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false

.gitignore

@@ -3,6 +3,8 @@ bower_components
 coverage
 npm-debug.log
 yarn.lock
+Gemfile.lock
+yarn-error.log
 package-lock.json
 .DS_Store
 .idea

.npmignore

@@ -1,9 +1,34 @@
-build
-src
-config
-static
+.idea
+.DS_Store
+.prettierrc
 .babelrc
-.gitignore
-yarn.lock
+.editorconfig
+Gemfile
+postcss.config.js
+Rakefile
+**/npm-debug.log
+**/node_modules
+
+bin
+src
+docs
+build
+docs
+public
+tests
+postcss.config.js
+webpack.config.babel.js
+example
+examples
+
+# vscode
+jsconfig.json
+
+# tests
 test
-index.html
+__test__
+__tests__
+jest.config.js
+jest.setup.js
+
+

.npmrc

@@ -0,0 +1,2 @@
+sass_binary_site=https://npm.taobao.org/mirrors/node-sass/
+package-lock=false

.prettierrc

@@ -0,0 +1,38 @@
+{
+  "trailingComma": "none",
+  "arrowParens": "always",
+  "printWidth": 80,
+  "bracketSpacing": true,
+  "jsxBracketSameLine": true,
+  "tabWidth": 2,
+  "semi": true,
+  "singleQuote": true,
+  "overrides": [
+    {
+      "files": [
+        "*.json",
+        ".eslintrc",
+        ".tslintrc",
+        ".prettierrc",
+        ".tern-project"
+      ],
+      "options": {
+        "parser": "json",
+        "tabWidth": 2
+      }
+    },
+    {
+      "files": "*.{css,sass,scss,less}",
+      "options": {
+        "parser": "postcss",
+        "tabWidth": 2
+      }
+    },
+    {
+      "files": "*.ts",
+      "options": {
+        "parser": "typescript"
+      }
+    }
+  ]
+}

Gemfile

@@ -0,0 +1,5 @@
+source 'https://rubygems.org'
+
+gem 'fileutils'
+gem 'sshkit'
+gem 'semver'

README.md

@@ -1,82 +1,88 @@
 # react-digital
-> React digital
+> React digital.
 
-## properties:
-```javascript
-
-  static propTypes = {
-    className: PropTypes.string,
-    value: PropTypes.any,
-  };
-
-  static defaultProps = {
-    value: ':',
-    flat: false
-  };
-
+## installation
+```shell
+npm install -S @feizheng/react-digital
 ```
 
-## install && import:
-```bash
-npm install --save afeiship/react-digital --registry=https://registry.npm.taobao.org
+## update
+```shell
+npm update @feizheng/react-digital
 ```
 
-```js
-import ReactDigital from 'react-digital';
-```
+## properties
+| Name      | Type   | Default | Description                           |
+| --------- | ------ | ------- | ------------------------------------- |
+| className | string | -       | The extended className for component. |
+| value     | any    | ':'     | Default value.                        |
+| onChange  | func   | noop    | The change handler.                   |
+| flat      | bool   | false   | If digit equal width.                 |
 
-```scss
-// customize your styles:
-$react-digital-options:(
-);
 
-@import 'node_modules/react-digital/dist/style.scss';
-```
+## usage
+1. import css
+  ```scss
+  @import "~@feizheng/react-digital/dist/style.scss";
 
+  // customize your styles:
+  $react-digital-options: ()
+  ```
+2. import js
+  ```js
+  import ReactDigital from '@feizheng/react-digital';
+  import ReactDOM from 'react-dom';
+  import React from 'react';
+  import './assets/style.scss';
 
-## usage:
-```jsx
+  class App extends React.Component {
+    componentDidMount() {}
+    render() {
+      return (
+        <div className="app-container">
+          <div className="dib_ mr5_" style={{ fontSize: 20 }}>
+            <ReactDigital value={2} />
+            <ReactDigital value={0} />
+            <ReactDigital value={1} />
+            <ReactDigital value={7} />
+            <ReactDigital value={'-'} />
+            <ReactDigital value={1} />
+            <ReactDigital value={2} />
+            <ReactDigital value={'-'} />
+            <ReactDigital value={0} />
+            <ReactDigital value={7} />
+          </div>
+          <div className="mr5_" style={{ fontSize: 10, marginTop: 20 }}>
+            <ReactDigital flat={true} className="dib" value={0} />
+            <ReactDigital flat={true} className="dib" value={0} />
+            <ReactDigital flat={true} className="dib" value={':'} />
+            <ReactDigital flat={true} className="dib" value={1} />
+            <ReactDigital flat={true} className="dib" value={6} />
+            <ReactDigital flat={true} className="dib" value={':'} />
+            <ReactDigital flat={true} className="dib" value={0} />
+            <ReactDigital flat={true} className="dib" value={0} />
+          </div>
+        </div>
+      );
+    }
+  }
 
-// install: npm install afeiship/react-digital --save
-// import : import ReactDigital from 'react-digital'
+  ReactDOM.render(<App />, document.getElementById('app'));
 
-class App extends React.Component{
-  state = {
-  };
+  ```
 
-  constructor(props){
-    super(props);
-    window.demo = this;
-    window.refs = this.refs;
-    window.rc = this.refs.rc;
-  }
+## documentation
+- https://afeiship.github.io/react-digital/
 
-  render(){
-    return (
-      <div className="hello-react-digital">
-        <ReactDigital value={2} />
-        <ReactDigital value={0} />
-        <ReactDigital value={1} />
-        <ReactDigital value={7} />
-        <ReactDigital value={'-'} />
-        <ReactDigital value={1} />
-        <ReactDigital value={2} />
-        <ReactDigital value={'-'} />
-        <ReactDigital value={0} />
-        <ReactDigital value={7} />
-        <div className="mr5_" style={{ fontSize: 10, marginTop: 20}}>
-          <ReactDigital className="dib" value={0} />
-          <ReactDigital className="dib" value={0} />
-          <ReactDigital className="dib" value={':'} />
-          <ReactDigital className="dib" value={1} />
-          <ReactDigital className="dib" value={6} />
-          <ReactDigital className="dib" value={':'} />
-          <ReactDigital className="dib" value={0} />
-          <ReactDigital className="dib" value={0} />
-        </div>
-      </div>
-    );
-  }
-}
+## resources
+- https://www.robinwieruch.de/minimal-react-webpack-babel-setup/
+- https://www.valentinog.com/blog/react-webpack-babel/
+- https://jestjs.io/docs/en/tutorial-react#snapshot-testing-with-mocks-enzyme-and-react-16
+- https://testing-library.com/docs/react-testing-library/api
 
-```
+## todos
+- [ ] Add: semver number for every build files.
+- [ ] Add: need output css files.
+- [ ] Add: PWA support for docs.
+- [ ] Add: source.map file for dist(`you can upload for production debug`).
+- [ ] BUG: npm run dev will clean dist.

Rakefile

@@ -0,0 +1,4 @@
+
+Dir["./node_modules/@feizheng/rake-*/index.rake"].each do |task|
+  load task
+end

__tests__/index.spec.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import { shallow } from 'enzyme';
+import BoilerplateReactCompnent from '../src/main';
+
+describe('Basic Test', () => {
+  test('renders to document', () => {
+    const component = shallow(<BoilerplateReactCompnent />);
+    const cnt = component.find('.react-component');
+    cnt.simulate('click');
+    expect(cnt).toMatch(/Hello React/);
+  });
+});