🔧 Move build deps and scripts to archetype

.babelrc

@@ -1,13 +1,3 @@
 {
- "presets": ["es2015", "react"],
- "env": {
- "development": {
- "presets": ["es2015-webpack", "react"],
- "plugins": [
- ["transform-es2015-modules-commonjs-simple", {
- "noMangle": true
- }]
- ]
- }
- }
+ "extends": "./node_modules/dash-components-archetype/config/babel/babelrc"
 }

.builderrc

@@ -0,0 +1,3 @@
+---
+archetypes:
+ - dash-components-archetype

.eslintrc

@@ -0,0 +1,2 @@
+---
+ extends: ./node_modules/dash-components-archetype/config/eslint/eslintrc-react.json

package.json

@@ -6,41 +6,22 @@
  "type": "git",
  "url": "git://github.com/plotly/dash-components-core.git"
  },
- "main": "lib/basic/index.js",
+ "main": "lib/index.js",
  "scripts": {
- "clean-lib": "mkdir -p lib && rm -rf lib/*",
- "transpile-dev": "npm run clean-lib && npm run extract-metadata && babel --source-root ./src/ -d lib/ src/",
- "transpile-dev-watch": "npm run clean-lib && npm run extract-metadata && babel --watch --source-root ./src/ -d lib/ src/",
- "build-dev": "webpack --config=config/webpack/webpack.config.dev.js",
- "extract-metadata": "mkdir -p lib && react-docgen --pretty -o lib/metadata.json src/basic/components",
- "dev": "webpack-dev-server --config=config/webpack/webpack.config.dev.js",
- "lint": "eslint --quiet --fix --ignore-path .gitignore .",
- "prepublish": "npm test",
- "start": "npm run transpile-dev-watch",
- "test": "npm run lint"
+ "start": "builder run transpile-dev-watch",
+ "test": "builder run lint"
  },
  "author": "Per Nilsson <per@sproutlab.com>",
  "license": "MIT",
  "dependencies": {
- "babel-cli": "^6.10.1",
- "babel-core": "^6.9.0",
- "babel-loader": "^6.2.4",
- "babel-preset-es2015": "^6.6.0",
- "babel-preset-react": "^6.5.0",
- "clean-webpack-plugin": "^0.1.9",
+ "builder": "2.10.1",
+ "dash-components-archetype": "^0.1.0",
  "radium": "^0.17.1",
  "ramda": "^0.21.0",
- "react-docgen": "^2.8.2",
- "react-dom": "^15.1.0",
- "webpack": "^1.13.1",
- "webpack-partial": "^1.2.0"
+ "react": "^15.1.0",
+ "react-dom": "^15.1.0"
  },
  "devDependencies": {
- "babel-plugin-transform-es2015-modules-commonjs-simple": "^6.7.4",
- "babel-preset-es2015-webpack": "^6.4.1",
- "eslint": "^2.8.0",
- "eslint-plugin-import": "^1.8.1",
- "eslint-plugin-react": "^5.1.1",
- "react": "^15.1.0"
+ "dash-components-archetype-dev": "^0.1.0"
  }
 }

src/basic/Styles.js → src/Styles.js

@@ -9,4 +9,4 @@ const palette = {
 
 export default {
  colors: palette
-}
+};

src/basic/components/EditableDiv.react.js → src/components/EditableDiv.react.js

@@ -10,20 +10,20 @@ const baseStyles = {
  ':hover': {
  color: Styles.colors.baseHover
  }
-}
+};
 
 /**
  * A div for displaying text. The text is editable.
  */
 export default class EditableDiv extends Component {
 
  constructor(props) {
- super(props);
- this.state = {inEditMode: false};
+ super(props)
+ this.state = {inEditMode: false}
  }
 
  componentDidUpdate() {
- if (this.state.inEditMode) ReactDOM.findDOMNode(this.refs.input).focus();
+ if (this.state.inEditMode) ReactDOM.findDOMNode(this.refs.input).focus()
  }
 
  render() {
@@ -43,18 +43,18 @@ export default class EditableDiv extends Component {
  onBlur={() => this.setState({inEditMode: false})}
  />
  </div>
- );
+ )
  }
  else {
  return (
  <div style={R.merge(baseStyles, this.props.style)}
  onClick={() => {
- if (this.props.editable) this.setState({inEditMode: true});
+ if (this.props.editable) this.setState({inEditMode: true})
  }}
  >
  {this.props.text}
  </div>
- );
+ )
  }
  }
 

src/basic/components/Header.react.js → src/components/Header.react.js

@@ -1,13 +1,11 @@
-'use strict';
-
 import React, {Component, PropTypes} from 'react';
 
 /**
  * A component that greets a person in a header
  */
 class Header extends Component {
  render() {
- return <h2>Hello, {this.props.name}</h2>;
+ return <h2>Hello, {this.props.name}</h2>
  }
 }
 

src/basic/components/InputControl.react.js → src/components/InputControl.react.js

@@ -5,14 +5,14 @@ import React, {Component, PropTypes} from 'react';
  */
 export default class InputControl extends Component {
  constructor() {
- super();
+ super()
  this.state = {
  value: ''
  }
  }
 
  handleChange(value) {
- this.setState({value});
+ this.setState({value})
  /**
  * TODO (#22): Remove conditional. Always pass a callback function
  * to components that can change value.
@@ -29,7 +29,7 @@ export default class InputControl extends Component {
  onChange={e => this.handleChange(e.target.value)}
  {...this.props}
  />
- );
+ )
  }
 }
 

src/basic/index.js → src/index.js

@@ -10,4 +10,4 @@ export {
  EditableDiv,
  Header,
  InputControl
-};
+};

.babelrc

@@ -1,13 +1,3 @@
 {
- "presets": ["es2015", "react"],
- "env": {
- "development": {
- "presets": ["es2015-webpack", "react"],
- "plugins": [
- ["transform-es2015-modules-commonjs-simple", {
- "noMangle": true
- }]
- ]
- }
- }
+ "extends": "./node_modules/dash-components-archetype/config/babel/babelrc"
 }

.builderrc

@@ -0,0 +1,3 @@
+---
+archetypes:
+ - dash-components-archetype

.eslintrc

@@ -0,0 +1,2 @@
+---
+ extends: ./node_modules/dash-components-archetype/config/eslint/eslintrc-react.json

package.json

@@ -6,41 +6,22 @@
  "type": "git",
  "url": "git://github.com/plotly/dash-components-core.git"
  },
- "main": "lib/basic/index.js",
+ "main": "lib/index.js",
  "scripts": {
- "clean-lib": "mkdir -p lib && rm -rf lib/*",
- "transpile-dev": "npm run clean-lib && npm run extract-metadata && babel --source-root ./src/ -d lib/ src/",
- "transpile-dev-watch": "npm run clean-lib && npm run extract-metadata && babel --watch --source-root ./src/ -d lib/ src/",
- "build-dev": "webpack --config=config/webpack/webpack.config.dev.js",
- "extract-metadata": "mkdir -p lib && react-docgen --pretty -o lib/metadata.json src/basic/components",
- "dev": "webpack-dev-server --config=config/webpack/webpack.config.dev.js",
- "lint": "eslint --quiet --fix --ignore-path .gitignore .",
- "prepublish": "npm test",
- "start": "npm run transpile-dev-watch",
- "test": "npm run lint"
+ "start": "builder run transpile-dev-watch",
+ "test": "builder run lint"
  },
  "author": "Per Nilsson <per@sproutlab.com>",
  "license": "MIT",
  "dependencies": {
- "babel-cli": "^6.10.1",
- "babel-core": "^6.9.0",
- "babel-loader": "^6.2.4",
- "babel-preset-es2015": "^6.6.0",
- "babel-preset-react": "^6.5.0",
- "clean-webpack-plugin": "^0.1.9",
+ "builder": "2.10.1",
+ "dash-components-archetype": "^0.1.0",
  "radium": "^0.17.1",
  "ramda": "^0.21.0",
- "react-docgen": "^2.8.2",
- "react-dom": "^15.1.0",
- "webpack": "^1.13.1",
- "webpack-partial": "^1.2.0"
+ "react": "^15.1.0",
+ "react-dom": "^15.1.0"
  },
  "devDependencies": {
- "babel-plugin-transform-es2015-modules-commonjs-simple": "^6.7.4",
- "babel-preset-es2015-webpack": "^6.4.1",
- "eslint": "^2.8.0",
- "eslint-plugin-import": "^1.8.1",
- "eslint-plugin-react": "^5.1.1",
- "react": "^15.1.0"
+ "dash-components-archetype-dev": "^0.1.0"
  }
 }

src/basic/Styles.js → src/Styles.js

@@ -9,4 +9,4 @@ const palette = {
 
 export default {
  colors: palette
-}
+};

src/basic/components/EditableDiv.react.js → src/components/EditableDiv.react.js

@@ -10,20 +10,20 @@ const baseStyles = {
  ':hover': {
  color: Styles.colors.baseHover
  }
-}
+};
 
 /**
  * A div for displaying text. The text is editable.
  */
 export default class EditableDiv extends Component {
 
  constructor(props) {
- super(props);
- this.state = {inEditMode: false};
+ super(props)
+ this.state = {inEditMode: false}
  }
 
  componentDidUpdate() {
- if (this.state.inEditMode) ReactDOM.findDOMNode(this.refs.input).focus();
+ if (this.state.inEditMode) ReactDOM.findDOMNode(this.refs.input).focus()
  }
 
  render() {
@@ -43,18 +43,18 @@ export default class EditableDiv extends Component {
  onBlur={() => this.setState({inEditMode: false})}
  />
  </div>
- );
+ )
  }
  else {
  return (
  <div style={R.merge(baseStyles, this.props.style)}
  onClick={() => {
- if (this.props.editable) this.setState({inEditMode: true});
+ if (this.props.editable) this.setState({inEditMode: true})
  }}
  >
  {this.props.text}
  </div>
- );
+ )
  }
  }
 

src/basic/components/Header.react.js → src/components/Header.react.js

@@ -1,13 +1,11 @@
-'use strict';
-
 import React, {Component, PropTypes} from 'react';
 
 /**
  * A component that greets a person in a header
  */
 class Header extends Component {
  render() {
- return <h2>Hello, {this.props.name}</h2>;
+ return <h2>Hello, {this.props.name}</h2>
  }
 }
 

src/basic/components/InputControl.react.js → src/components/InputControl.react.js

@@ -5,14 +5,14 @@ import React, {Component, PropTypes} from 'react';
  */
 export default class InputControl extends Component {
  constructor() {
- super();
+ super()
  this.state = {
  value: ''
  }
  }
 
  handleChange(value) {
- this.setState({value});
+ this.setState({value})
  /**
  * TODO (#22): Remove conditional. Always pass a callback function
  * to components that can change value.
@@ -29,7 +29,7 @@ export default class InputControl extends Component {
  onChange={e => this.handleChange(e.target.value)}
  {...this.props}
  />
- );
+ )
  }
 }
 

src/basic/index.js → src/index.js

@@ -10,4 +10,4 @@ export {
  EditableDiv,
  Header,
  InputControl
-};
+};

.babelrc

@@ -1,13 +1,3 @@
 {
- "presets": ["es2015", "react"],
- "env": {
- "development": {
- "presets": ["es2015-webpack", "react"],
- "plugins": [
- ["transform-es2015-modules-commonjs-simple", {
- "noMangle": true
- }]
- ]
- }
- }
+ "extends": "./node_modules/dash-components-archetype/config/babel/babelrc"
 }

.builderrc

@@ -0,0 +1,3 @@
+---
+archetypes:
+ - dash-components-archetype

.eslintrc

@@ -0,0 +1,2 @@
+---
+ extends: ./node_modules/dash-components-archetype/config/eslint/eslintrc-react.json

package.json

@@ -6,41 +6,22 @@
  "type": "git",
  "url": "git://github.com/plotly/dash-components-core.git"
  },
- "main": "lib/basic/index.js",
+ "main": "lib/index.js",
  "scripts": {
- "clean-lib": "mkdir -p lib && rm -rf lib/*",
- "transpile-dev": "npm run clean-lib && npm run extract-metadata && babel --source-root ./src/ -d lib/ src/",
- "transpile-dev-watch": "npm run clean-lib && npm run extract-metadata && babel --watch --source-root ./src/ -d lib/ src/",
- "build-dev": "webpack --config=config/webpack/webpack.config.dev.js",
- "extract-metadata": "mkdir -p lib && react-docgen --pretty -o lib/metadata.json src/basic/components",
- "dev": "webpack-dev-server --config=config/webpack/webpack.config.dev.js",
- "lint": "eslint --quiet --fix --ignore-path .gitignore .",
- "prepublish": "npm test",
- "start": "npm run transpile-dev-watch",
- "test": "npm run lint"
+ "start": "builder run transpile-dev-watch",
+ "test": "builder run lint"
  },
  "author": "Per Nilsson <per@sproutlab.com>",
  "license": "MIT",
  "dependencies": {
- "babel-cli": "^6.10.1",
- "babel-core": "^6.9.0",
- "babel-loader": "^6.2.4",
- "babel-preset-es2015": "^6.6.0",
- "babel-preset-react": "^6.5.0",
- "clean-webpack-plugin": "^0.1.9",
+ "builder": "2.10.1",
+ "dash-components-archetype": "^0.1.0",
  "radium": "^0.17.1",
  "ramda": "^0.21.0",
- "react-docgen": "^2.8.2",
- "react-dom": "^15.1.0",
- "webpack": "^1.13.1",
- "webpack-partial": "^1.2.0"
+ "react": "^15.1.0",
+ "react-dom": "^15.1.0"
  },
  "devDependencies": {
- "babel-plugin-transform-es2015-modules-commonjs-simple": "^6.7.4",
- "babel-preset-es2015-webpack": "^6.4.1",
- "eslint": "^2.8.0",
- "eslint-plugin-import": "^1.8.1",
- "eslint-plugin-react": "^5.1.1",
- "react": "^15.1.0"
+ "dash-components-archetype-dev": "^0.1.0"
  }
 }

src/basic/Styles.js → src/Styles.js

@@ -9,4 +9,4 @@ const palette = {
 
 export default {
  colors: palette
-}
+};

src/basic/components/EditableDiv.react.js → src/components/EditableDiv.react.js

@@ -10,20 +10,20 @@ const baseStyles = {
  ':hover': {
  color: Styles.colors.baseHover
  }
-}
+};
 
 /**
  * A div for displaying text. The text is editable.
  */
 export default class EditableDiv extends Component {
 
  constructor(props) {
- super(props);
- this.state = {inEditMode: false};
+ super(props)
+ this.state = {inEditMode: false}
  }
 
  componentDidUpdate() {
- if (this.state.inEditMode) ReactDOM.findDOMNode(this.refs.input).focus();
+ if (this.state.inEditMode) ReactDOM.findDOMNode(this.refs.input).focus()
  }
 
  render() {
@@ -43,18 +43,18 @@ export default class EditableDiv extends Component {
  onBlur={() => this.setState({inEditMode: false})}
  />
  </div>
- );
+ )
  }
  else {
  return (
  <div style={R.merge(baseStyles, this.props.style)}
  onClick={() => {
- if (this.props.editable) this.setState({inEditMode: true});
+ if (this.props.editable) this.setState({inEditMode: true})
  }}
  >
  {this.props.text}
  </div>
- );
+ )
  }
  }
 

src/basic/components/Header.react.js → src/components/Header.react.js

@@ -1,13 +1,11 @@
-'use strict';
-
 import React, {Component, PropTypes} from 'react';
 
 /**
  * A component that greets a person in a header
  */
 class Header extends Component {
  render() {
- return <h2>Hello, {this.props.name}</h2>;
+ return <h2>Hello, {this.props.name}</h2>
  }
 }
 

src/basic/components/InputControl.react.js → src/components/InputControl.react.js

@@ -5,14 +5,14 @@ import React, {Component, PropTypes} from 'react';
  */
 export default class InputControl extends Component {
  constructor() {
- super();
+ super()
  this.state = {
  value: ''
  }
  }
 
  handleChange(value) {
- this.setState({value});
+ this.setState({value})
  /**
  * TODO (#22): Remove conditional. Always pass a callback function
  * to components that can change value.
@@ -29,7 +29,7 @@ export default class InputControl extends Component {
  onChange={e => this.handleChange(e.target.value)}
  {...this.props}
  />
- );
+ )
  }
 }
 

src/basic/index.js → src/index.js

@@ -10,4 +10,4 @@ export {
  EditableDiv,
  Header,
  InputControl
-};
+};

.babelrc

@@ -1,13 +1,3 @@
 {
- "presets": ["es2015", "react"],
- "env": {
- "development": {
- "presets": ["es2015-webpack", "react"],
- "plugins": [
- ["transform-es2015-modules-commonjs-simple", {
- "noMangle": true
- }]
- ]
- }
- }
+ "extends": "./node_modules/dash-components-archetype/config/babel/babelrc"
 }

.builderrc

@@ -0,0 +1,3 @@
+---
+archetypes:
+ - dash-components-archetype

.eslintrc

@@ -0,0 +1,2 @@
+---
+ extends: ./node_modules/dash-components-archetype/config/eslint/eslintrc-react.json

package.json

@@ -6,41 +6,22 @@
  "type": "git",
  "url": "git://github.com/plotly/dash-components-core.git"
  },
- "main": "lib/basic/index.js",
+ "main": "lib/index.js",
  "scripts": {
- "clean-lib": "mkdir -p lib && rm -rf lib/*",
- "transpile-dev": "npm run clean-lib && npm run extract-metadata && babel --source-root ./src/ -d lib/ src/",
- "transpile-dev-watch": "npm run clean-lib && npm run extract-metadata && babel --watch --source-root ./src/ -d lib/ src/",
- "build-dev": "webpack --config=config/webpack/webpack.config.dev.js",
- "extract-metadata": "mkdir -p lib && react-docgen --pretty -o lib/metadata.json src/basic/components",
- "dev": "webpack-dev-server --config=config/webpack/webpack.config.dev.js",
- "lint": "eslint --quiet --fix --ignore-path .gitignore .",
- "prepublish": "npm test",
- "start": "npm run transpile-dev-watch",
- "test": "npm run lint"
+ "start": "builder run transpile-dev-watch",
+ "test": "builder run lint"
  },
  "author": "Per Nilsson <per@sproutlab.com>",
  "license": "MIT",
  "dependencies": {
- "babel-cli": "^6.10.1",
- "babel-core": "^6.9.0",
- "babel-loader": "^6.2.4",
- "babel-preset-es2015": "^6.6.0",
- "babel-preset-react": "^6.5.0",
- "clean-webpack-plugin": "^0.1.9",
+ "builder": "2.10.1",
+ "dash-components-archetype": "^0.1.0",
  "radium": "^0.17.1",
  "ramda": "^0.21.0",
- "react-docgen": "^2.8.2",
- "react-dom": "^15.1.0",
- "webpack": "^1.13.1",
- "webpack-partial": "^1.2.0"
+ "react": "^15.1.0",
+ "react-dom": "^15.1.0"
  },
  "devDependencies": {
- "babel-plugin-transform-es2015-modules-commonjs-simple": "^6.7.4",
- "babel-preset-es2015-webpack": "^6.4.1",
- "eslint": "^2.8.0",
- "eslint-plugin-import": "^1.8.1",
- "eslint-plugin-react": "^5.1.1",
- "react": "^15.1.0"
+ "dash-components-archetype-dev": "^0.1.0"
  }
 }

src/basic/Styles.js → src/Styles.js

@@ -9,4 +9,4 @@ const palette = {
 
 export default {
  colors: palette
-}
+};

src/basic/components/EditableDiv.react.js → src/components/EditableDiv.react.js

@@ -10,20 +10,20 @@ const baseStyles = {
  ':hover': {
  color: Styles.colors.baseHover
  }
-}
+};
 
 /**
  * A div for displaying text. The text is editable.
  */
 export default class EditableDiv extends Component {
 
  constructor(props) {
- super(props);
- this.state = {inEditMode: false};
+ super(props)
+ this.state = {inEditMode: false}
  }
 
  componentDidUpdate() {
- if (this.state.inEditMode) ReactDOM.findDOMNode(this.refs.input).focus();
+ if (this.state.inEditMode) ReactDOM.findDOMNode(this.refs.input).focus()
  }
 
  render() {
@@ -43,18 +43,18 @@ export default class EditableDiv extends Component {
  onBlur={() => this.setState({inEditMode: false})}
  />
  </div>
- );
+ )
  }
  else {
  return (
  <div style={R.merge(baseStyles, this.props.style)}
  onClick={() => {
- if (this.props.editable) this.setState({inEditMode: true});
+ if (this.props.editable) this.setState({inEditMode: true})
  }}
  >
  {this.props.text}
  </div>
- );
+ )
  }
  }
 

src/basic/components/Header.react.js → src/components/Header.react.js

@@ -1,13 +1,11 @@
-'use strict';
-
 import React, {Component, PropTypes} from 'react';
 
 /**
  * A component that greets a person in a header
  */
 class Header extends Component {
  render() {
- return <h2>Hello, {this.props.name}</h2>;
+ return <h2>Hello, {this.props.name}</h2>
  }
 }
 

src/basic/components/InputControl.react.js → src/components/InputControl.react.js

@@ -5,14 +5,14 @@ import React, {Component, PropTypes} from 'react';
  */
 export default class InputControl extends Component {
  constructor() {
- super();
+ super()
  this.state = {
  value: ''
  }
  }
 
  handleChange(value) {
- this.setState({value});
+ this.setState({value})
  /**
  * TODO (#22): Remove conditional. Always pass a callback function
  * to components that can change value.
@@ -29,7 +29,7 @@ export default class InputControl extends Component {
  onChange={e => this.handleChange(e.target.value)}
  {...this.props}
  />
- );
+ )
  }
 }
 

src/basic/index.js → src/index.js

@@ -10,4 +10,4 @@ export {
  EditableDiv,
  Header,
  InputControl
-};
+};

.babelrc

@@ -1,13 +1,3 @@
 {
- "presets": ["es2015", "react"],
- "env": {
- "development": {
- "presets": ["es2015-webpack", "react"],
- "plugins": [
- ["transform-es2015-modules-commonjs-simple", {
- "noMangle": true
- }]
- ]
- }
- }
+ "extends": "./node_modules/dash-components-archetype/config/babel/babelrc"
 }

.builderrc

@@ -0,0 +1,3 @@
+---
+archetypes:
+ - dash-components-archetype

.eslintrc

@@ -0,0 +1,2 @@
+---
+ extends: ./node_modules/dash-components-archetype/config/eslint/eslintrc-react.json

package.json

@@ -6,41 +6,22 @@
  "type": "git",
  "url": "git://github.com/plotly/dash-components-core.git"
  },
- "main": "lib/basic/index.js",
+ "main": "lib/index.js",
  "scripts": {
- "clean-lib": "mkdir -p lib && rm -rf lib/*",
- "transpile-dev": "npm run clean-lib && npm run extract-metadata && babel --source-root ./src/ -d lib/ src/",
- "transpile-dev-watch": "npm run clean-lib && npm run extract-metadata && babel --watch --source-root ./src/ -d lib/ src/",
- "build-dev": "webpack --config=config/webpack/webpack.config.dev.js",
- "extract-metadata": "mkdir -p lib && react-docgen --pretty -o lib/metadata.json src/basic/components",
- "dev": "webpack-dev-server --config=config/webpack/webpack.config.dev.js",
- "lint": "eslint --quiet --fix --ignore-path .gitignore .",
- "prepublish": "npm test",
- "start": "npm run transpile-dev-watch",
- "test": "npm run lint"
+ "start": "builder run transpile-dev-watch",
+ "test": "builder run lint"
  },
  "author": "Per Nilsson <per@sproutlab.com>",
  "license": "MIT",
  "dependencies": {
- "babel-cli": "^6.10.1",
- "babel-core": "^6.9.0",
- "babel-loader": "^6.2.4",
- "babel-preset-es2015": "^6.6.0",
- "babel-preset-react": "^6.5.0",
- "clean-webpack-plugin": "^0.1.9",
+ "builder": "2.10.1",
+ "dash-components-archetype": "^0.1.0",
  "radium": "^0.17.1",
  "ramda": "^0.21.0",
- "react-docgen": "^2.8.2",
- "react-dom": "^15.1.0",
- "webpack": "^1.13.1",
- "webpack-partial": "^1.2.0"
+ "react": "^15.1.0",
+ "react-dom": "^15.1.0"
  },
  "devDependencies": {
- "babel-plugin-transform-es2015-modules-commonjs-simple": "^6.7.4",
- "babel-preset-es2015-webpack": "^6.4.1",
- "eslint": "^2.8.0",
- "eslint-plugin-import": "^1.8.1",
- "eslint-plugin-react": "^5.1.1",
- "react": "^15.1.0"
+ "dash-components-archetype-dev": "^0.1.0"
  }
 }

src/basic/Styles.js → src/Styles.js

@@ -9,4 +9,4 @@ const palette = {
 
 export default {
  colors: palette
-}
+};

src/basic/components/EditableDiv.react.js → src/components/EditableDiv.react.js

@@ -10,20 +10,20 @@ const baseStyles = {
  ':hover': {
  color: Styles.colors.baseHover
  }
-}
+};
 
 /**
  * A div for displaying text. The text is editable.
  */
 export default class EditableDiv extends Component {
 
  constructor(props) {
- super(props);
- this.state = {inEditMode: false};
+ super(props)
+ this.state = {inEditMode: false}
  }
 
  componentDidUpdate() {
- if (this.state.inEditMode) ReactDOM.findDOMNode(this.refs.input).focus();
+ if (this.state.inEditMode) ReactDOM.findDOMNode(this.refs.input).focus()
  }
 
  render() {
@@ -43,18 +43,18 @@ export default class EditableDiv extends Component {
  onBlur={() => this.setState({inEditMode: false})}
  />
  </div>
- );
+ )
  }
  else {
  return (
  <div style={R.merge(baseStyles, this.props.style)}
  onClick={() => {
- if (this.props.editable) this.setState({inEditMode: true});
+ if (this.props.editable) this.setState({inEditMode: true})
  }}
  >
  {this.props.text}
  </div>
- );
+ )
  }
  }
 

src/basic/components/Header.react.js → src/components/Header.react.js

@@ -1,13 +1,11 @@
-'use strict';
-
 import React, {Component, PropTypes} from 'react';
 
 /**
  * A component that greets a person in a header
  */
 class Header extends Component {
  render() {
- return <h2>Hello, {this.props.name}</h2>;
+ return <h2>Hello, {this.props.name}</h2>
  }
 }
 

src/basic/components/InputControl.react.js → src/components/InputControl.react.js

@@ -5,14 +5,14 @@ import React, {Component, PropTypes} from 'react';
  */
 export default class InputControl extends Component {
  constructor() {
- super();
+ super()
  this.state = {
  value: ''
  }
  }
 
  handleChange(value) {
- this.setState({value});
+ this.setState({value})
  /**
  * TODO (#22): Remove conditional. Always pass a callback function
  * to components that can change value.
@@ -29,7 +29,7 @@ export default class InputControl extends Component {
  onChange={e => this.handleChange(e.target.value)}
  {...this.props}
  />
- );
+ )
  }
 }
 

src/basic/index.js → src/index.js

@@ -10,4 +10,4 @@ export {
  EditableDiv,
  Header,
  InputControl
-};
+};

.babelrc

@@ -1,13 +1,3 @@
 {
- "presets": ["es2015", "react"],
- "env": {
- "development": {
- "presets": ["es2015-webpack", "react"],
- "plugins": [
- ["transform-es2015-modules-commonjs-simple", {
- "noMangle": true
- }]
- ]
- }
- }
+ "extends": "./node_modules/dash-components-archetype/config/babel/babelrc"
 }

.builderrc

@@ -0,0 +1,3 @@
+---
+archetypes:
+ - dash-components-archetype

.eslintrc

@@ -0,0 +1,2 @@
+---
+ extends: ./node_modules/dash-components-archetype/config/eslint/eslintrc-react.json

package.json

@@ -6,41 +6,22 @@
  "type": "git",
  "url": "git://github.com/plotly/dash-components-core.git"
  },
- "main": "lib/basic/index.js",
+ "main": "lib/index.js",
  "scripts": {
- "clean-lib": "mkdir -p lib && rm -rf lib/*",
- "transpile-dev": "npm run clean-lib && npm run extract-metadata && babel --source-root ./src/ -d lib/ src/",
- "transpile-dev-watch": "npm run clean-lib && npm run extract-metadata && babel --watch --source-root ./src/ -d lib/ src/",
- "build-dev": "webpack --config=config/webpack/webpack.config.dev.js",
- "extract-metadata": "mkdir -p lib && react-docgen --pretty -o lib/metadata.json src/basic/components",
- "dev": "webpack-dev-server --config=config/webpack/webpack.config.dev.js",
- "lint": "eslint --quiet --fix --ignore-path .gitignore .",
- "prepublish": "npm test",
- "start": "npm run transpile-dev-watch",
- "test": "npm run lint"
+ "start": "builder run transpile-dev-watch",
+ "test": "builder run lint"
  },
  "author": "Per Nilsson <per@sproutlab.com>",
  "license": "MIT",
  "dependencies": {
- "babel-cli": "^6.10.1",
- "babel-core": "^6.9.0",
- "babel-loader": "^6.2.4",
- "babel-preset-es2015": "^6.6.0",
- "babel-preset-react": "^6.5.0",
- "clean-webpack-plugin": "^0.1.9",
+ "builder": "2.10.1",
+ "dash-components-archetype": "^0.1.0",
  "radium": "^0.17.1",
  "ramda": "^0.21.0",
- "react-docgen": "^2.8.2",
- "react-dom": "^15.1.0",
- "webpack": "^1.13.1",
- "webpack-partial": "^1.2.0"
+ "react": "^15.1.0",
+ "react-dom": "^15.1.0"
  },
  "devDependencies": {
- "babel-plugin-transform-es2015-modules-commonjs-simple": "^6.7.4",
- "babel-preset-es2015-webpack": "^6.4.1",
- "eslint": "^2.8.0",
- "eslint-plugin-import": "^1.8.1",
- "eslint-plugin-react": "^5.1.1",
- "react": "^15.1.0"
+ "dash-components-archetype-dev": "^0.1.0"
  }
 }

src/basic/Styles.js → src/Styles.js

@@ -9,4 +9,4 @@ const palette = {
 
 export default {
  colors: palette
-}
+};

src/basic/components/EditableDiv.react.js → src/components/EditableDiv.react.js

@@ -10,20 +10,20 @@ const baseStyles = {
  ':hover': {
  color: Styles.colors.baseHover
  }
-}
+};
 
 /**
  * A div for displaying text. The text is editable.
  */
 export default class EditableDiv extends Component {
 
  constructor(props) {
- super(props);
- this.state = {inEditMode: false};
+ super(props)
+ this.state = {inEditMode: false}
  }
 
  componentDidUpdate() {
- if (this.state.inEditMode) ReactDOM.findDOMNode(this.refs.input).focus();
+ if (this.state.inEditMode) ReactDOM.findDOMNode(this.refs.input).focus()
  }
 
  render() {
@@ -43,18 +43,18 @@ export default class EditableDiv extends Component {
  onBlur={() => this.setState({inEditMode: false})}
  />
  </div>
- );
+ )
  }
  else {
  return (
  <div style={R.merge(baseStyles, this.props.style)}
  onClick={() => {
- if (this.props.editable) this.setState({inEditMode: true});
+ if (this.props.editable) this.setState({inEditMode: true})
  }}
  >
  {this.props.text}
  </div>
- );
+ )
  }
  }
 

src/basic/components/Header.react.js → src/components/Header.react.js

@@ -1,13 +1,11 @@
-'use strict';
-
 import React, {Component, PropTypes} from 'react';
 
 /**
  * A component that greets a person in a header
  */
 class Header extends Component {
  render() {
- return <h2>Hello, {this.props.name}</h2>;
+ return <h2>Hello, {this.props.name}</h2>
  }
 }
 

src/basic/components/InputControl.react.js → src/components/InputControl.react.js

@@ -5,14 +5,14 @@ import React, {Component, PropTypes} from 'react';
  */
 export default class InputControl extends Component {
  constructor() {
- super();
+ super()
  this.state = {
  value: ''
  }
  }
 
  handleChange(value) {
- this.setState({value});
+ this.setState({value})
  /**
  * TODO (#22): Remove conditional. Always pass a callback function
  * to components that can change value.
@@ -29,7 +29,7 @@ export default class InputControl extends Component {
  onChange={e => this.handleChange(e.target.value)}
  {...this.props}
  />
- );
+ )
  }
 }
 

src/basic/index.js → src/index.js

@@ -10,4 +10,4 @@ export {
  EditableDiv,
  Header,
  InputControl
-};
+};

.babelrc

@@ -1,13 +1,3 @@
 {
- "presets": ["es2015", "react"],
- "env": {
- "development": {
- "presets": ["es2015-webpack", "react"],
- "plugins": [
- ["transform-es2015-modules-commonjs-simple", {
- "noMangle": true
- }]
- ]
- }
- }
+ "extends": "./node_modules/dash-components-archetype/config/babel/babelrc"
 }

.builderrc

@@ -0,0 +1,3 @@
+---
+archetypes:
+ - dash-components-archetype

.eslintrc

@@ -0,0 +1,2 @@
+---
+ extends: ./node_modules/dash-components-archetype/config/eslint/eslintrc-react.json

package.json

@@ -6,41 +6,22 @@
  "type": "git",
  "url": "git://github.com/plotly/dash-components-core.git"
  },
- "main": "lib/basic/index.js",
+ "main": "lib/index.js",
  "scripts": {
- "clean-lib": "mkdir -p lib && rm -rf lib/*",
- "transpile-dev": "npm run clean-lib && npm run extract-metadata && babel --source-root ./src/ -d lib/ src/",
- "transpile-dev-watch": "npm run clean-lib && npm run extract-metadata && babel --watch --source-root ./src/ -d lib/ src/",
- "build-dev": "webpack --config=config/webpack/webpack.config.dev.js",
- "extract-metadata": "mkdir -p lib && react-docgen --pretty -o lib/metadata.json src/basic/components",
- "dev": "webpack-dev-server --config=config/webpack/webpack.config.dev.js",
- "lint": "eslint --quiet --fix --ignore-path .gitignore .",
- "prepublish": "npm test",
- "start": "npm run transpile-dev-watch",
- "test": "npm run lint"
+ "start": "builder run transpile-dev-watch",
+ "test": "builder run lint"
  },
  "author": "Per Nilsson <per@sproutlab.com>",
  "license": "MIT",
  "dependencies": {
- "babel-cli": "^6.10.1",
- "babel-core": "^6.9.0",
- "babel-loader": "^6.2.4",
- "babel-preset-es2015": "^6.6.0",
- "babel-preset-react": "^6.5.0",
- "clean-webpack-plugin": "^0.1.9",
+ "builder": "2.10.1",
+ "dash-components-archetype": "^0.1.0",
  "radium": "^0.17.1",
  "ramda": "^0.21.0",
- "react-docgen": "^2.8.2",
- "react-dom": "^15.1.0",
- "webpack": "^1.13.1",
- "webpack-partial": "^1.2.0"
+ "react": "^15.1.0",
+ "react-dom": "^15.1.0"
  },
  "devDependencies": {
- "babel-plugin-transform-es2015-modules-commonjs-simple": "^6.7.4",
- "babel-preset-es2015-webpack": "^6.4.1",
- "eslint": "^2.8.0",
- "eslint-plugin-import": "^1.8.1",
- "eslint-plugin-react": "^5.1.1",
- "react": "^15.1.0"
+ "dash-components-archetype-dev": "^0.1.0"
  }
 }

src/basic/Styles.js → src/Styles.js

@@ -9,4 +9,4 @@ const palette = {
 
 export default {
  colors: palette
-}
+};

src/basic/components/EditableDiv.react.js → src/components/EditableDiv.react.js

@@ -10,20 +10,20 @@ const baseStyles = {
  ':hover': {
  color: Styles.colors.baseHover
  }
-}
+};
 
 /**
  * A div for displaying text. The text is editable.
  */
 export default class EditableDiv extends Component {
 
  constructor(props) {
- super(props);
- this.state = {inEditMode: false};
+ super(props)
+ this.state = {inEditMode: false}
  }
 
  componentDidUpdate() {
- if (this.state.inEditMode) ReactDOM.findDOMNode(this.refs.input).focus();
+ if (this.state.inEditMode) ReactDOM.findDOMNode(this.refs.input).focus()
  }
 
  render() {
@@ -43,18 +43,18 @@ export default class EditableDiv extends Component {
  onBlur={() => this.setState({inEditMode: false})}
  />
  </div>
- );
+ )
  }
  else {
  return (
  <div style={R.merge(baseStyles, this.props.style)}
  onClick={() => {
- if (this.props.editable) this.setState({inEditMode: true});
+ if (this.props.editable) this.setState({inEditMode: true})
  }}
  >
  {this.props.text}
  </div>
- );
+ )
  }
  }
 

src/basic/components/Header.react.js → src/components/Header.react.js

@@ -1,13 +1,11 @@
-'use strict';
-
 import React, {Component, PropTypes} from 'react';
 
 /**
  * A component that greets a person in a header
  */
 class Header extends Component {
  render() {
- return <h2>Hello, {this.props.name}</h2>;
+ return <h2>Hello, {this.props.name}</h2>
  }
 }
 

src/basic/components/InputControl.react.js → src/components/InputControl.react.js

@@ -5,14 +5,14 @@ import React, {Component, PropTypes} from 'react';
  */
 export default class InputControl extends Component {
  constructor() {
- super();
+ super()
  this.state = {
  value: ''
  }
  }
 
  handleChange(value) {
- this.setState({value});
+ this.setState({value})
  /**
  * TODO (#22): Remove conditional. Always pass a callback function
  * to components that can change value.
@@ -29,7 +29,7 @@ export default class InputControl extends Component {
  onChange={e => this.handleChange(e.target.value)}
  {...this.props}
  />
- );
+ )
  }
 }
 

src/basic/index.js → src/index.js

@@ -10,4 +10,4 @@ export {
  EditableDiv,
  Header,
  InputControl
-};
+};

.babelrc

@@ -1,13 +1,3 @@
 {
- "presets": ["es2015", "react"],
- "env": {
- "development": {
- "presets": ["es2015-webpack", "react"],
- "plugins": [
- ["transform-es2015-modules-commonjs-simple", {
- "noMangle": true
- }]
- ]
- }
- }
+ "extends": "./node_modules/dash-components-archetype/config/babel/babelrc"
 }

.builderrc

@@ -0,0 +1,3 @@
+---
+archetypes:
+ - dash-components-archetype

.eslintrc

@@ -0,0 +1,2 @@
+---
+ extends: ./node_modules/dash-components-archetype/config/eslint/eslintrc-react.json

package.json

@@ -6,41 +6,22 @@
  "type": "git",
  "url": "git://github.com/plotly/dash-components-core.git"
  },
- "main": "lib/basic/index.js",
+ "main": "lib/index.js",
  "scripts": {
- "clean-lib": "mkdir -p lib && rm -rf lib/*",
- "transpile-dev": "npm run clean-lib && npm run extract-metadata && babel --source-root ./src/ -d lib/ src/",
- "transpile-dev-watch": "npm run clean-lib && npm run extract-metadata && babel --watch --source-root ./src/ -d lib/ src/",
- "build-dev": "webpack --config=config/webpack/webpack.config.dev.js",
- "extract-metadata": "mkdir -p lib && react-docgen --pretty -o lib/metadata.json src/basic/components",
- "dev": "webpack-dev-server --config=config/webpack/webpack.config.dev.js",
- "lint": "eslint --quiet --fix --ignore-path .gitignore .",
- "prepublish": "npm test",
- "start": "npm run transpile-dev-watch",
- "test": "npm run lint"
+ "start": "builder run transpile-dev-watch",
+ "test": "builder run lint"
  },
  "author": "Per Nilsson <per@sproutlab.com>",
  "license": "MIT",
  "dependencies": {
- "babel-cli": "^6.10.1",
- "babel-core": "^6.9.0",
- "babel-loader": "^6.2.4",
- "babel-preset-es2015": "^6.6.0",
- "babel-preset-react": "^6.5.0",
- "clean-webpack-plugin": "^0.1.9",
+ "builder": "2.10.1",
+ "dash-components-archetype": "^0.1.0",
  "radium": "^0.17.1",
  "ramda": "^0.21.0",
- "react-docgen": "^2.8.2",
- "react-dom": "^15.1.0",
- "webpack": "^1.13.1",
- "webpack-partial": "^1.2.0"
+ "react": "^15.1.0",
+ "react-dom": "^15.1.0"
  },
  "devDependencies": {
- "babel-plugin-transform-es2015-modules-commonjs-simple": "^6.7.4",
- "babel-preset-es2015-webpack": "^6.4.1",
- "eslint": "^2.8.0",
- "eslint-plugin-import": "^1.8.1",
- "eslint-plugin-react": "^5.1.1",
- "react": "^15.1.0"
+ "dash-components-archetype-dev": "^0.1.0"
  }
 }

src/basic/Styles.js → src/Styles.js

@@ -9,4 +9,4 @@ const palette = {
 
 export default {
  colors: palette
-}
+};

src/basic/components/EditableDiv.react.js → src/components/EditableDiv.react.js

@@ -10,20 +10,20 @@ const baseStyles = {
  ':hover': {
  color: Styles.colors.baseHover
  }
-}
+};
 
 /**
  * A div for displaying text. The text is editable.
  */
 export default class EditableDiv extends Component {
 
  constructor(props) {
- super(props);
- this.state = {inEditMode: false};
+ super(props)
+ this.state = {inEditMode: false}
  }
 
  componentDidUpdate() {
- if (this.state.inEditMode) ReactDOM.findDOMNode(this.refs.input).focus();
+ if (this.state.inEditMode) ReactDOM.findDOMNode(this.refs.input).focus()
  }
 
  render() {
@@ -43,18 +43,18 @@ export default class EditableDiv extends Component {
  onBlur={() => this.setState({inEditMode: false})}
  />
  </div>
- );
+ )
  }
  else {
  return (
  <div style={R.merge(baseStyles, this.props.style)}
  onClick={() => {
- if (this.props.editable) this.setState({inEditMode: true});
+ if (this.props.editable) this.setState({inEditMode: true})
  }}
  >
  {this.props.text}
  </div>
- );
+ )
  }
  }
 

src/basic/components/Header.react.js → src/components/Header.react.js

@@ -1,13 +1,11 @@
-'use strict';
-
 import React, {Component, PropTypes} from 'react';
 
 /**
  * A component that greets a person in a header
  */
 class Header extends Component {
  render() {
- return <h2>Hello, {this.props.name}</h2>;
+ return <h2>Hello, {this.props.name}</h2>
  }
 }
 

src/basic/components/InputControl.react.js → src/components/InputControl.react.js

@@ -5,14 +5,14 @@ import React, {Component, PropTypes} from 'react';
  */
 export default class InputControl extends Component {
  constructor() {
- super();
+ super()
  this.state = {
  value: ''
  }
  }
 
  handleChange(value) {
- this.setState({value});
+ this.setState({value})
  /**
  * TODO (#22): Remove conditional. Always pass a callback function
  * to components that can change value.
@@ -29,7 +29,7 @@ export default class InputControl extends Component {
  onChange={e => this.handleChange(e.target.value)}
  {...this.props}
  />
- );
+ )
  }
 }
 

src/basic/index.js → src/index.js

@@ -10,4 +10,4 @@ export {
  EditableDiv,
  Header,
  InputControl
-};
+};