perf(general): Trim fat (#35) 🐎

* perf(pencil): Over 90% reduction in file size and over 80% reduction in Gzipped file after refactoring and reducing dependency footprint.

Before:
Stat: 611.06KB
Parsed: 105.41KB
Gzipped: 32.8KB

After:
Stat: 56.67KB
Parsed: 22.38KB
Gzipped: 6.02KB

Author: mrchief

.babelrc

@@ -1,6 +1,9 @@
 {
   "presets": [["es2015", { "modules": false }], "stage-0", "react"],
-  "plugins": ["transform-class-properties"],
+  "plugins": [
+    "transform-class-properties",
+    "transform-react-remove-prop-types"
+  ],
   "env": {
       "test": {
         "presets": ["es2015", "stage-0", "react"],

.eslintignore

@@ -1 +1 @@
-docs/bundle.js
+docs/**/bundle.js

.gitignore

@@ -43,4 +43,5 @@ dist
 *.tgz
 
 # Webstorm cache
-.idea
+.idea
+/webpack-stats.json

.travis.yml

@@ -4,16 +4,17 @@ cache:
     - node_modules
 node_js: 
   - '8'
-  - '7'
   - '6'
 before_install:
   - npm install -g npm@5
   - npm install -g greenkeeper-lockfile@1
+install:
+  - yarn install --ignore-engines
 before_script: greenkeeper-lockfile-update
 after_script: greenkeeper-lockfile-upload
 after_success: 
-  - npm run coveralls
-  - npm run semantic-release
+  - npm run coveralls  
+  - npm run travis-deploy-once "npm run semantic-release"
 branches:
   except:
     - /^v\d+\.\d+\.\d+$/

docs/examples/bootstrap/bundle.js

@@ -8,10 +8,10 @@ const onAction = ({action, node}) => { console.log(`onAction:: [${action}]`, nod
 const onNodeToggle = (curNode) => { console.log('onNodeToggle::', curNode) }
 
 ReactDOM.render(
-<DropdownTreeSelect 
-    data={data} 
-    onChange={onChange} 
-    onAction={onAction} 
-    onNodeToggle={onNodeToggle} 
+  <DropdownTreeSelect
+    data={data}
+    onChange={onChange}
+    onAction={onAction}
+    onNodeToggle={onNodeToggle}
     className="bootstrap-demo"
-/>, document.getElementById('app'))
+  />, document.getElementById('app'))

docs/examples/bootstrap/index.js

@@ -8,10 +8,10 @@ const onAction = ({action, node}) => { console.log(`onAction:: [${action}]`, nod
 const onNodeToggle = (curNode) => { console.log('onNodeToggle::', curNode) }
 
 ReactDOM.render(
-<DropdownTreeSelect 
-    data={data} 
-    onChange={onChange} 
-    onAction={onAction} 
-    onNodeToggle={onNodeToggle} 
+  <DropdownTreeSelect
+    data={data}
+    onChange={onChange}
+    onAction={onAction}
+    onNodeToggle={onNodeToggle}
     className="mdl-demo"
-/>, document.getElementById('app'))
+  />, document.getElementById('app'))

docs/examples/material/bundle.js

@@ -12,7 +12,8 @@
     "demo": "webpack-dev-server --config docs/webpack.config.js",
     "prepublishOnly": "npm run build",
     "lint": "eslint --fix src docs webpack.config.js",
-    "semantic-release": "semantic-release pre && npm publish && semantic-release post",
+    "semantic-release": "semantic-release",
+    "travis-deploy-once": "travis-deploy-once",
     "test": "cross-env NODE_ENV=test ava",
     "test:cov": "rimraf .nyc_output && nyc npm test"
   },
@@ -21,7 +22,7 @@
   ],
   "dependencies": {
     "classnames": "^2.2.5",
-    "lodash": "^4.17.4",
+    "lodash.debounce": "^4.0.8",
     "prop-types": "^15.5.8",
     "react-simple-dropdown": "^3.2.0"
   },
@@ -32,6 +33,8 @@
     "babel-loader": "^7.1.2",
     "babel-plugin-istanbul": "^4.1.3",
     "babel-plugin-transform-class-properties": "^6.24.1",
+    "babel-plugin-transform-imports": "^1.4.1",
+    "babel-plugin-transform-react-remove-prop-types": "^0.4.12",
     "babel-preset-es2015": "^6.24.1",
     "babel-preset-react": "^6.24.1",
     "babel-preset-stage-0": "^6.24.1",
@@ -57,10 +60,12 @@
     "react-dom": "^16.0.0",
     "react-test-renderer": "^16.0.0",
     "rimraf": "^2.6.1",
-    "semantic-release": "^11.0.2",
+    "semantic-release": "^12.2.2",
     "sinon": "^4.0.0",
     "style-loader": "^0.19.0",
+    "travis-deploy-once": "^4.3.2",
     "webpack": "^3.5.6",
+    "webpack-bundle-analyzer": "^2.9.2",
     "webpack-dev-server": "^2.9.4"
   },
   "peerDependencies": {

docs/examples/material/index.js

@@ -128,10 +128,10 @@ class DropdownTreeSelect extends Component {
             {this.state.allNodesHidden
               ? <span className='no-matches'>No matches found</span>
               : (<Tree data={this.state.tree}
-                       searchModeOn={this.state.searchModeOn}
-                       onAction={this.onAction}
-                       onCheckboxChange={this.onCheckboxChange}
-                       onNodeToggle={this.onNodeToggle} />)
+                searchModeOn={this.state.searchModeOn}
+                onAction={this.onAction}
+                onCheckboxChange={this.onCheckboxChange}
+                onNodeToggle={this.onNodeToggle} />)
             }
           </DropdownContent>
         </Dropdown>