diff --git a/.babelrc b/.babelrc index 1c6ca3a6..e0e22ee7 100644 --- a/.babelrc +++ b/.babelrc @@ -1,4 +1,21 @@ { "stage": 2, - "optional": ["es7.classProperties"] + "optional": ["es7.classProperties"], + "env": { + "development": { + "plugins": ["react-transform"], + "extra": { + "react-transform": { + "transforms": [{ + "transform": "react-transform-hmr", + "imports": ["react"], + "locals": ["module"] + }, { + "transform": "react-transform-catch-errors", + "imports": ["react", "redbox-react"] + }] + } + } + } + } } diff --git a/.eslintignore b/.eslintignore index 02c4323f..b04f9cd2 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1,2 +1,3 @@ **/node_modules/ **/build/ +lib diff --git a/.eslintrc b/.eslintrc index e25aff71..32c6d3f3 100644 --- a/.eslintrc +++ b/.eslintrc @@ -207,6 +207,9 @@ "wrap-regex": [2], "yoda": [2, "never", { "exceptRange": true - }] + }], + "react/jsx-uses-react": [2], + "react/jsx-uses-vars": [2], + "react/react-in-jsx-scope": [2] } } diff --git a/components/app/index.jsx b/components/app/index.jsx index 913ab874..35a1a73d 100644 --- a/components/app/index.jsx +++ b/components/app/index.jsx @@ -2,11 +2,24 @@ import React from 'react'; import style from './style'; const App = (props) => { + let className = style.root; + if (props.className) { + className += ` ${props.className}`; + } + return ( - +
{props.children} - +
); }; +App.propTypes = { + className: React.PropTypes.string +}; + +App.defaultProps = { + className: '' +}; + export default App; diff --git a/components/app/style.scss b/components/app/style.scss index 0f94251d..7913cedb 100644 --- a/components/app/style.scss +++ b/components/app/style.scss @@ -1,6 +1,6 @@ @import "../commons"; -.app { +.root { position: absolute; top: 0; left: 0; diff --git a/components/app_bar/index.jsx b/components/app_bar/index.jsx index 14faef77..ae65577d 100644 --- a/components/app_bar/index.jsx +++ b/components/app_bar/index.jsx @@ -2,7 +2,7 @@ import React from 'react'; import style from './style'; const AppBar = (props) => { - let className = style.appbar; + let className = style.root; if (props.className) className += ` ${props.className}`; if (props.fixed) className += ` ${style.fixed}`; if (props.flat) className += ` ${style.flat}`; diff --git a/components/app_bar/style.scss b/components/app_bar/style.scss index fa0a2bf1..57162c1b 100644 --- a/components/app_bar/style.scss +++ b/components/app_bar/style.scss @@ -1,7 +1,7 @@ @import "../base"; @import "./config"; -.appbar { +.root { display: flex; height: $appbar-height; align-items: center; diff --git a/components/index.js b/components/index.js index da482a6e..503abd3a 100644 --- a/components/index.js +++ b/components/index.js @@ -1,35 +1,39 @@ -export default { - App: require('./app'), - AppBar: require('./app_bar'), - Autocomplete: require('./autocomplete'), - Button: require('./button'), - Card: require('./card'), - Checkbox: require('./checkbox'), - DatePicker: require('./date_picker'), - Dialog: require('./dialog'), - Drawer: require('./drawer'), - Dropdown: require('./dropdown'), - FontIcon: require('./font_icon'), - Form: require('./form'), - Input: require('./input'), - Link: require('./link'), - List: require('./list/list'), - ListItem: require('./list/item'), - ListDivider: require('./list/divider'), - ListCheckbox: require('./list/checkbox'), - ListSubHeader: require('./list/subheader'), - Menu: require('./menu/menu'), - MenuItem: require('./menu/menu_item'), - MenuDivider: require('./menu/menu_divider'), - IconMenu: require('./menu/icon_menu'), - Navigation: require('./navigation'), - ProgressBar: require('./progress_bar'), - RadioGroup: require('./radio/radio_group'), - RadioButton: require('./radio/radio_button'), - Ripple: require('./ripple'), - Slider: require('./slider'), - Switch: require('./switch'), - Tab: require('./tabs/tab'), - Tabs: require('./tabs/tabs'), - TimePicker: require('./time_picker') -}; +import App from './app'; +import AppBar from './app_bar'; +import Autocomplete from './autocomplete'; +import Button from './button'; +import Card from './card'; +import Checkbox from './checkbox'; +import DatePicker from './date_picker'; +import Dialog from './dialog'; +import Drawer from './drawer'; +import Dropdown from './dropdown'; +import FontIcon from './font_icon'; +import Form from './form'; +import Input from './input'; +import Link from './link'; +import List from './list/list'; +import ListItem from './list/item'; +import ListDivider from './list/divider'; +import ListCheckbox from './list/checkbox'; +import ListSubHeader from './list/subheader'; +import Menu from './menu/menu'; +import MenuItem from './menu/menu_item'; +import MenuDivider from './menu/menu_divider'; +import IconMenu from './menu/icon_menu'; +import Navigation from './navigation'; +import ProgressBar from './progress_bar'; +import RadioGroup from './radio/radio_group'; +import RadioButton from './radio/radio_button'; +import Ripple from './ripple'; +import Slider from './slider'; +import Switch from './switch'; +import Tab from './tabs/tab'; +import Tabs from './tabs/tabs'; +import TimePicker from './time_picker'; + +export default { App, AppBar, Autocomplete, Button, Card, Checkbox, DatePicker, + Dialog, Drawer, Dropdown, FontIcon, Form, Input, Link, List, ListItem, + ListDivider, ListCheckbox, ListSubHeader, Menu, MenuItem, MenuDivider, + IconMenu, Navigation, ProgressBar, RadioGroup, RadioButton, Ripple, Slider, + Switch, Tab, Tabs, TimePicker }; diff --git a/components/menu/menu_divider.jsx b/components/menu/menu_divider.jsx index bb4e13a7..8eac0f30 100644 --- a/components/menu/menu_divider.jsx +++ b/components/menu/menu_divider.jsx @@ -1,4 +1,3 @@ -/*eslint-disable no-unused-vars*/ import React from 'react'; import style from './style.menu_divider'; diff --git a/docs/.babelrc b/docs/.babelrc new file mode 100644 index 00000000..a3a2c1d4 --- /dev/null +++ b/docs/.babelrc @@ -0,0 +1,20 @@ +{ + "stage": 0, + "env": { + "development": { + "plugins": ["react-transform"], + "extra": { + "react-transform": { + "transforms": [{ + "transform": "react-transform-hmr", + "imports": ["react"], + "locals": ["module"] + }, { + "transform": "react-transform-catch-errors", + "imports": ["react", "redbox-react"] + }] + } + } + } + } +} diff --git a/docs/app/app.jsx b/docs/app/app.jsx deleted file mode 100644 index 41908d2b..00000000 --- a/docs/app/app.jsx +++ /dev/null @@ -1,12 +0,0 @@ -/*eslint-disable no-unused-vars*/ -import React from 'react'; -import ReactDOM from 'react-dom'; -import Router from 'react-router'; -import AppRoutes from './app-routes'; -import createHashHistory from 'history/lib/createHashHistory'; - -ReactDOM.render( - - {AppRoutes} - -, document.getElementById('app')); diff --git a/docs/app/components/layout/home/index.jsx b/docs/app/components/layout/home/index.jsx index a16f5a0c..fc102e53 100644 --- a/docs/app/components/layout/home/index.jsx +++ b/docs/app/components/layout/home/index.jsx @@ -1,4 +1,3 @@ -/*eslint-disable no-unused-vars*/ import React from 'react'; import style from './style'; import Logo from '../../logo'; diff --git a/docs/app/components/layout/home/style.scss b/docs/app/components/layout/home/style.scss index 60f369e2..20ade71f 100644 --- a/docs/app/components/layout/home/style.scss +++ b/docs/app/components/layout/home/style.scss @@ -1,4 +1,3 @@ -@import "~react-toolbox/base"; @import "../../globals"; @import "./config"; diff --git a/docs/app/components/layout/main/appbar.jsx b/docs/app/components/layout/main/appbar.jsx index 287f3e6c..429d22a8 100644 --- a/docs/app/components/layout/main/appbar.jsx +++ b/docs/app/components/layout/main/appbar.jsx @@ -1,4 +1,3 @@ -/*eslint-disable no-unused-vars*/ import React from 'react'; import { AppBar } from 'react-toolbox'; import { Link } from 'react-router'; diff --git a/docs/app/components/layout/main/component.jsx b/docs/app/components/layout/main/component.jsx index 7a4dade8..ab705e8e 100644 --- a/docs/app/components/layout/main/component.jsx +++ b/docs/app/components/layout/main/component.jsx @@ -1,4 +1,3 @@ -/*eslint-disable no-unused-vars*/ import React from 'react'; import ToolboxComponents from './components'; import style from './style'; diff --git a/docs/app/components/layout/main/drawer.jsx b/docs/app/components/layout/main/drawer.jsx index 4204d6ae..9757c891 100644 --- a/docs/app/components/layout/main/drawer.jsx +++ b/docs/app/components/layout/main/drawer.jsx @@ -1,4 +1,3 @@ -/*eslint-disable no-unused-vars*/ import React from 'react'; import ToolboxComponents from './components'; import { List, ListItem } from 'react-toolbox'; diff --git a/docs/app/components/layout/main/index.jsx b/docs/app/components/layout/main/index.jsx index 63be04b4..57d20ad6 100644 --- a/docs/app/components/layout/main/index.jsx +++ b/docs/app/components/layout/main/index.jsx @@ -1,4 +1,3 @@ -/*eslint-disable no-unused-vars*/ import React from 'react'; import MainAppBar from './appbar'; import MainDrawer from './drawer'; diff --git a/docs/app/components/layout/main/playground.jsx b/docs/app/components/layout/main/playground.jsx index 6a2b4b2f..483430a8 100644 --- a/docs/app/components/layout/main/playground.jsx +++ b/docs/app/components/layout/main/playground.jsx @@ -1,4 +1,3 @@ -/*eslint-disable no-unused-vars*/ import React from 'react'; import Playground from '../../playground'; import code from '../../../examples/example.txt'; diff --git a/docs/app/components/layout/main/style.scss b/docs/app/components/layout/main/style.scss index 1bcab0f4..5a40ce09 100644 --- a/docs/app/components/layout/main/style.scss +++ b/docs/app/components/layout/main/style.scss @@ -3,7 +3,7 @@ @import "./config"; .appbar { - composes: appbar from "react-toolbox/app_bar/style"; + composes: root from "react-toolbox/app_bar/style"; background: $color-primary-dark; } diff --git a/docs/app/components/navigation/index.jsx b/docs/app/components/navigation/index.jsx index 1da07cea..bca85591 100644 --- a/docs/app/components/navigation/index.jsx +++ b/docs/app/components/navigation/index.jsx @@ -1,4 +1,3 @@ -/*eslint-disable no-unused-vars*/ import React from 'react'; import { Link } from 'react-router'; diff --git a/docs/app/components/preview/index.jsx b/docs/app/components/preview/index.jsx index 0f5cf7e1..3710e57b 100644 --- a/docs/app/components/preview/index.jsx +++ b/docs/app/components/preview/index.jsx @@ -1,4 +1,3 @@ -/*eslint-disable no-eval*/ import React from 'react'; import ReactDOM from 'react-dom'; import babel from 'babel-core/browser'; @@ -71,6 +70,8 @@ const Preview = React.createClass({ try { const compiledCode = this.compileCode(); + + /*eslint-disable no-eval*/ const Component = eval(compiledCode).apply(null, scope); ReactDOM.render(Component, mountNode); if (this.state.error) { diff --git a/docs/app/docs.jsx b/docs/app/docs.jsx new file mode 100644 index 00000000..0aecc72d --- /dev/null +++ b/docs/app/docs.jsx @@ -0,0 +1,17 @@ +import React from 'react'; +import Router from 'react-router'; +import routes from './routes'; + +const Docs = props => { + return ( + + {routes} + + ); +}; + +Docs.propTypes = { + history: React.PropTypes.object +}; + +export default Docs; diff --git a/docs/app/history.js b/docs/app/history.js new file mode 100644 index 00000000..94749b79 --- /dev/null +++ b/docs/app/history.js @@ -0,0 +1,2 @@ +import {createHashHistory} from 'history'; +export default createHashHistory(); diff --git a/docs/app/index.jsx b/docs/app/index.jsx new file mode 100644 index 00000000..b24e8c7f --- /dev/null +++ b/docs/app/index.jsx @@ -0,0 +1,6 @@ +import React from 'react'; +import ReactDOM from 'react-dom'; +import history from './history'; +import Docs from './docs'; + +ReactDOM.render(, document.getElementById('app')); diff --git a/docs/app/app-routes.jsx b/docs/app/routes.jsx similarity index 89% rename from docs/app/app-routes.jsx rename to docs/app/routes.jsx index 46b78a7d..34a7c8a0 100644 --- a/docs/app/app-routes.jsx +++ b/docs/app/routes.jsx @@ -1,4 +1,3 @@ -/*eslint-disable no-unused-vars*/ import React from 'react'; import { App } from 'react-toolbox'; import { Route, IndexRoute } from 'react-router'; @@ -7,7 +6,7 @@ import Main from './components/layout/main'; import Playground from './components/layout/main/playground'; import Component from './components/layout/main/component'; -const Routes = ( +const routes = ( @@ -18,4 +17,4 @@ const Routes = ( ); -export default Routes; +export default routes; diff --git a/docs/package.json b/docs/package.json index 0bed43c6..453e2253 100644 --- a/docs/package.json +++ b/docs/package.json @@ -4,7 +4,8 @@ "description": "Documentation for React Toolbox", "author": "React Toolbox Team (http://github.com/react-toolbox)", "scripts": { - "start": "UV_THREADPOOL_SIZE=100 node ./server" + "start": "node ./server", + "build": "NODE_ENV=production webpack --config ./webpack.config.production" }, "dependencies": { "codemirror": "^5.8.0", @@ -19,7 +20,9 @@ "babel-core": "^5.8.23", "babel-eslint": "^4.1.3", "babel-loader": "^5.3.2", + "babel-plugin-react-transform": "^1.1.1", "css-loader": "^0.21.0", + "express": "^4.13.3", "extract-text-webpack-plugin": "^0.8.2", "html-loader": "^0.3.0", "html-webpack-plugin": "^1.6.2", @@ -27,12 +30,16 @@ "node-sass": "^3.3.3", "postcss-loader": "^0.7.0", "raw-loader": "^0.5.1", - "react-hot-loader": "^1.3.0", + "react-transform-catch-errors": "^1.0.0", + "react-transform-hmr": "^1.0.1", + "redbox-react": "^1.1.1", "sass-loader": "^3.0.0", "style-loader": "^0.13.0", "transfer-webpack-plugin": "^0.1.4", "webpack": "^1.12.0", - "webpack-dev-server": "^1.12.1" + "webpack-dev-middleware": "^1.2.0", + "webpack-hot-middleware": "^2.4.1" }, - "repository": "github:react-toolbox/react-toolbox" + "repository": "github:react-toolbox/react-toolbox", + "license": "MIT" } diff --git a/docs/server.js b/docs/server.js index 811c92e1..ddd810a5 100644 --- a/docs/server.js +++ b/docs/server.js @@ -1,22 +1,31 @@ -const webpack = require('webpack'); -const WebpackDevServer = require('webpack-dev-server'); -const config = require('./webpack.config.development'); -const devServer = { - host: '0.0.0.0', - port: 8080, - inline: true -}; +process.env.UV_THREADPOOL_SIZE = Math.ceil(Math.max(4, require('os').cpus().length * 1.5)); -new WebpackDevServer(webpack(config), { - contentBase: 'www', +const path = require('path'); +const express = require('express'); +const webpack = require('webpack'); +const config = require('./webpack.config.development'); + +const app = express(); +const compiler = webpack(config); + +app.use(require('webpack-dev-middleware')(compiler, { publicPath: config.output.publicPath, - historyApiFallback: false, - hot: true, stats: { colors: true } -}).listen(devServer.port, devServer.host, (err) => { - if (err) console.error(err); - console.log(`Listening at ${devServer.host}:${devServer.port}`); - console.log(`open http://${devServer.host}:${devServer.port}/spec/`); +})); + +app.use(require('webpack-hot-middleware')(compiler)); + +app.get('*', (req, res) => { + res.sendFile(path.join(__dirname, './www/index.html')); +}); + +app.listen(8081, '0.0.0.0', (err) => { + if (err) { + console.log(err); + return; + } + + console.log('Listening at http://0.0.0.0:8081'); }); diff --git a/docs/webpack.config.development.js b/docs/webpack.config.development.js index cc193019..ac9ec3eb 100644 --- a/docs/webpack.config.development.js +++ b/docs/webpack.config.development.js @@ -7,9 +7,8 @@ module.exports = { context: __dirname, devtool: '#eval-source-map', entry: [ - 'webpack-dev-server/client?http://0.0.0.0:8080', - 'webpack/hot/only-dev-server', - './app/app.jsx' + 'webpack-hot-middleware/client', + './app/index.jsx' ], output: { path: path.join(__dirname, 'build'), @@ -33,7 +32,7 @@ module.exports = { { test: /(\.js|\.jsx)$/, exclude: /(node_modules)/, - loader: 'react-hot!babel' + loader: 'babel' }, { test: /(\.scss|\.css)$/, loader: ExtractTextPlugin.extract('style', 'css?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!sass') @@ -51,7 +50,7 @@ module.exports = { plugins: [ new ExtractTextPlugin('docs.css', {allChunks: true}), new webpack.HotModuleReplacementPlugin(), - new webpack.optimize.OccurenceOrderPlugin(), + new webpack.NoErrorsPlugin(), new webpack.DefinePlugin({ 'process.env.NODE_ENV': JSON.stringify('development') }) diff --git a/docs/webpack.config.production.js b/docs/webpack.config.production.js index e5830e8f..33153090 100644 --- a/docs/webpack.config.production.js +++ b/docs/webpack.config.production.js @@ -7,8 +7,7 @@ const TransferWebpackPlugin = require('transfer-webpack-plugin'); module.exports = { context: __dirname, - devtool: '#eval-source-map', - entry: ['./app/app.jsx'], + entry: ['./app/index.jsx'], output: { path: path.join(__dirname, 'build'), filename: 'docs.js' @@ -33,7 +32,7 @@ module.exports = { { test: /(\.js|\.jsx)$/, exclude: /(node_modules)/, - loader: 'react-hot!babel' + loader: 'babel' }, { test: /(\.scss|\.css)$/, loader: ExtractTextPlugin.extract('style', 'css?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!sass') @@ -54,8 +53,12 @@ module.exports = { inject: false, template: path.resolve(__dirname, './www/index.html') }), - new TransferWebpackPlugin([ - { from: 'www/images', to: 'images' } - ], path.resolve(__dirname, './')) + new TransferWebpackPlugin([{ + from: 'www/images', + to: 'images' + }], path.resolve(__dirname, './')), + new webpack.DefinePlugin({ + 'process.env.NODE_ENV': JSON.stringify('production') + }) ] }; diff --git a/package.json b/package.json index dd643faa..17c3bd8b 100644 --- a/package.json +++ b/package.json @@ -18,15 +18,15 @@ "main": "./lib", "scripts": { "start": "node ./server", + "lint": "eslint ./ --ext .js,.jsx", "babel": "babel ./components --out-dir ./lib", - "build": "npm run lint && npm run babel && npm run sass", + "sass": "cpx './components/**/*.scss' ./lib", + "build": "npm run babel && npm run sass", "clean": "rimraf ./lib", - "lint": "eslint ./components ./spec ./example --ext .js,.jsx", "prebuild": "npm run clean", "prepublish": "npm run build", - "sass": "node-sass ./components -o ./lib", - "test": "karma start", - "test:watch": "karma start --no-single-run" + "test": "NODE_ENV=test karma start", + "test:watch": "NODE_ENV=test karma start --no-single-run" }, "bugs": { "url": "https://github.com/react-toolbox/react-toolbox/issues", @@ -52,10 +52,13 @@ "babel-core": "^5.8.23", "babel-eslint": "^4.1.3", "babel-loader": "^5.3.2", + "babel-plugin-react-transform": "^1.1.1", + "cpx": "^1.2.1", "css-loader": "^0.21.0", "eslint": "^1.7.3", "eslint-plugin-react": "^3.3.1", "expect": "^1.8.0", + "express": "^4.13.3", "karma": "^0.13.3", "karma-chrome-launcher": "^0.2.0", "karma-cli": "^0.1.0", @@ -63,23 +66,25 @@ "karma-phantomjs-launcher": "~0.2", "karma-webpack": "^1.7.0", "mocha": "^2.3.3", - "node-libs-browser": "^0.5.2", "node-sass": "^3.3.3", "normalize.css": "^3.0.3", - "object-assign": "^4.0.1", + "phantomjs": "^1.9.18", "phantomjs-polyfill": "0.0.1", "postcss-loader": "^0.7.0", "react": "^0.14", "react-addons-css-transition-group": "^0.14.0", "react-addons-test-utils": "^0.14.0", "react-dom": "^0.14.0", - "react-hot-loader": "^1.3.0", + "react-transform-catch-errors": "^1.0.0", + "react-transform-hmr": "^1.0.1", + "redbox-react": "^1.1.1", "rimraf": "^2.4.3", "sass-loader": "^3.0.0", "sinon": "git://github.com/cjohansen/Sinon.JS#sinon-2.0", "style-loader": "^0.13.0", "webpack": "^1.12.0", - "webpack-dev-server": "^1.12.1" + "webpack-dev-middleware": "^1.2.0", + "webpack-hot-middleware": "^2.4.1" }, "repository": "github:react-toolbox/react-toolbox" } diff --git a/server.js b/server.js index e1d0e5e3..08b9fe0a 100644 --- a/server.js +++ b/server.js @@ -1,22 +1,31 @@ process.env.UV_THREADPOOL_SIZE = Math.ceil(Math.max(4, require('os').cpus().length * 1.5)); +const path = require('path'); +const express = require('express'); const webpack = require('webpack'); -const WebpackDevServer = require('webpack-dev-server'); const config = require('./webpack.config.development'); -const devServer = { - host: '0.0.0.0', - port: 8080, - inline: true -}; -new WebpackDevServer(webpack(config), { +const app = express(); +const compiler = webpack(config); + +app.use(require('webpack-dev-middleware')(compiler, { publicPath: config.output.publicPath, - historyApiFallback: false, stats: { colors: true } -}).listen(devServer.port, devServer.host, (err) => { - if (err) console.error(err); - console.log(`Listening at ${devServer.host}:${devServer.port}`); - console.log(`open http://${devServer.host}:${devServer.port}/spec/`); +})); + +app.use(require('webpack-hot-middleware')(compiler)); + +app.get('*', (req, res) => { + res.sendFile(path.join(__dirname, './spec/index.html')); +}); + +app.listen(8080, '0.0.0.0', (err) => { + if (err) { + console.log(err); + return; + } + + console.log('Listening at http://0.0.0.0:8080'); }); diff --git a/spec/components/button.jsx b/spec/components/button.jsx index 641c4f7e..3d2ebc42 100644 --- a/spec/components/button.jsx +++ b/spec/components/button.jsx @@ -1,4 +1,3 @@ -/*eslint-disable no-unused-vars*/ import React from 'react'; import Button from '../../components/button'; diff --git a/spec/components/font_icon.jsx b/spec/components/font_icon.jsx index 8caad367..ba115a79 100644 --- a/spec/components/font_icon.jsx +++ b/spec/components/font_icon.jsx @@ -1,4 +1,3 @@ -/*eslint-disable no-unused-vars*/ import React from 'react'; import FontIcon from '../../components/font_icon'; diff --git a/spec/components/input.jsx b/spec/components/input.jsx index 467b6904..dbb3bc11 100644 --- a/spec/components/input.jsx +++ b/spec/components/input.jsx @@ -1,4 +1,3 @@ -/*eslint-disable no-unused-vars*/ import React from 'react'; import Input from '../../components/input'; diff --git a/spec/components/link.jsx b/spec/components/link.jsx index 48a29c47..a409d1ae 100644 --- a/spec/components/link.jsx +++ b/spec/components/link.jsx @@ -1,4 +1,3 @@ -/*eslint-disable no-unused-vars*/ import React from 'react'; import Link from '../../components/link'; diff --git a/spec/components/list.jsx b/spec/components/list.jsx index 85063990..1b24cc3f 100644 --- a/spec/components/list.jsx +++ b/spec/components/list.jsx @@ -1,4 +1,3 @@ -/*eslint-disable no-unused-vars*/ import React from 'react'; import { ListCheckbox, ListSubHeader, List, ListItem, ListDivider } from '../../components/list'; diff --git a/spec/components/pickers.jsx b/spec/components/pickers.jsx index c4fb1255..b0911619 100644 --- a/spec/components/pickers.jsx +++ b/spec/components/pickers.jsx @@ -1,4 +1,3 @@ -/*eslint-disable no-unused-vars*/ import React from 'react'; import DatePicker from '../../components/date_picker'; import TimePicker from '../../components/time_picker'; diff --git a/spec/components/slider.jsx b/spec/components/slider.jsx index bf65429b..d16c4247 100644 --- a/spec/components/slider.jsx +++ b/spec/components/slider.jsx @@ -1,4 +1,3 @@ -/*eslint-disable no-unused-vars*/ import React from 'react'; import Slider from '../../components/slider'; diff --git a/spec/components/tabs.jsx b/spec/components/tabs.jsx index 2a3406cd..62b58573 100644 --- a/spec/components/tabs.jsx +++ b/spec/components/tabs.jsx @@ -1,4 +1,3 @@ -/*eslint-disable no-unused-vars*/ import React from 'react'; import { Tabs, Tab } from '../../components/tabs'; diff --git a/spec/index.jsx b/spec/index.jsx index 770ca08d..5c10207c 100644 --- a/spec/index.jsx +++ b/spec/index.jsx @@ -1,6 +1,5 @@ -/*eslint-disable no-unused-vars*/ import React from 'react'; import ReactDOM from 'react-dom'; -import App from './app'; +import Root from './root'; -ReactDOM.render(, document.getElementById('toolbox-test')); +ReactDOM.render(, document.getElementById('toolbox-test')); diff --git a/spec/app.jsx b/spec/root.jsx similarity index 58% rename from spec/app.jsx rename to spec/root.jsx index 6353b24e..f6e69aa2 100644 --- a/spec/app.jsx +++ b/spec/root.jsx @@ -1,6 +1,5 @@ -/*eslint-disable no-unused-vars*/ import React from 'react'; -import commons from '../components/commons'; +import App from '../components/app'; import Autocomplete from './components/autocomplete'; import Button from './components/button'; import Card from './components/card'; @@ -21,32 +20,30 @@ import Switch from './components/switch'; import Tabs from './components/tabs'; import style from './style'; -const App = () => { - return ( - -

React Toolbox

-

Component Spec v0.10.20

+const Root = () => ( + +

React Toolbox

+

Component Spec v0.10.20

- -