diff --git a/lib/styleguide/StyleGuideRenderer.js b/lib/styleguide/StyleGuideRenderer.js
deleted file mode 100644
index 3a7d1428cad53a745ed56bfdb1f5e7fb3a57a6b7..0000000000000000000000000000000000000000
--- a/lib/styleguide/StyleGuideRenderer.js
+++ /dev/null
@@ -1,25 +0,0 @@
-import React from 'react'
-import 'xpub-fonts'
-import classes from './StyleGuideRenderer.local.css'
-
-const StyleGuideRenderer = ({ title, children, toc }) => {
- return (
- <div className={classes.root}>
- <div className={classes.sidebar}>
- <header className={classes.header}>
- <h1 className={classes.title}>{title}</h1>
- </header>
-
- <nav className={classes.nav}>
- {toc}
- </nav>
- </div>
-
- <div className={classes.content}>
- {children}
- </div>
- </div>
- )
-}
-
-export default StyleGuideRenderer
diff --git a/lib/styleguide/StyleGuideRenderer.local.css b/lib/styleguide/StyleGuideRenderer.local.css
deleted file mode 100644
index ddcdbb33071538347eb9907b44dad20dc4531d96..0000000000000000000000000000000000000000
--- a/lib/styleguide/StyleGuideRenderer.local.css
+++ /dev/null
@@ -1,37 +0,0 @@
-.root {
- display: grid;
- grid-template-columns: 1fr 3fr;
- grid-template-areas: "side content";
- height: 100vh;
- width: 100vw;
-}
-
-.sidebar {
- grid-area: side;
- display: flex;
- flex-direction: column;
- overflow-y: hidden;
-}
-
-.content {
- grid-area: content;
- padding: 1rem;
- overflow-y: auto;
-}
-
-.header {
- padding: 0.5rem;
-}
-
-.nav {
- flex: 1;
- overflow-y: auto;
- padding: 0.5rem;
-}
-
-.title {
- font-family: "Fira Sans", serif;
- font-size: 1rem;
- margin-bottom: 0;
- padding: 0 1rem;
-}
diff --git a/lib/styleguide/Wrapper.js b/lib/styleguide/Wrapper.js
deleted file mode 100644
index a1569989fe823e85af0ed44d8a94488b388b35df..0000000000000000000000000000000000000000
--- a/lib/styleguide/Wrapper.js
+++ /dev/null
@@ -1,34 +0,0 @@
-import React from 'react'
-// import { Router, createMemoryHistory } from 'react-router'
-import { Provider } from 'react-redux'
-import { reducer as formReducer } from 'redux-form'
-import { createStore, combineReducers } from 'redux'
-
-import 'xpub-fonts'
-import classes from './Wrapper.local.css'
-
-const rootReducer = combineReducers({
- form: formReducer
-})
-
-const store = createStore(rootReducer)
-
-const Wrapper = ({ children }) => (
- <Provider store={store}>
- <div className={classes.root}>
- {children}
- </div>
- </Provider>
-)
-
-/*const Wrapper = ({ children }) => (
- <Provider store={store}>
- <Router history={createMemoryHistory()}>
- <div className={classes.root}>
- {children}
- </div>
- </Router>
- </Provider>
-)*/
-
-export default Wrapper
diff --git a/lib/styleguide/Wrapper.local.css b/lib/styleguide/Wrapper.local.css
deleted file mode 100644
index a72adc66096660c2be4b656582b5ec7e6fb3962c..0000000000000000000000000000000000000000
--- a/lib/styleguide/Wrapper.local.css
+++ /dev/null
@@ -1,3 +0,0 @@
-.root {
- font-family: "Fira Sans", sans-serif;
-}
diff --git a/package.json b/package.json
index 6e9ae95ff2d16f1ebad314a0d1d2dbf272920e80..5e080451349a470c3f26037745e282203dc03c5d 100644
--- a/package.json
+++ b/package.json
@@ -9,26 +9,28 @@
"main": "src",
"jsnext:main": "src",
"dependencies": {
- "babel-core": "^6.26.0",
- "babel-loader": "^7.1.2",
"classnames": "^2.2.5",
- "css-loader": "^0.28.5",
- "file-loader": "^0.11.2",
- "lodash": "^4.17.4",
"prop-types": "^15.5.10",
"react": "^15.6.1",
"react-dom": "^15.6.1",
"react-redux": "^5.0.6",
"react-router": "^3.0.5",
"redux": "^3.6.0",
- "redux-form": "^7.0.3",
- "style-loader": "^0.18.2",
"xpub-fonts": "^0.0.2"
},
"devDependencies": {
- "babel-preset-react-app": "^3.0.2",
+ "babel-core": "^6.26.0",
+ "babel-loader": "^7.1.2",
+ "babel-preset-env": "^1.6.0",
+ "babel-preset-minify": "^0.2.0",
+ "babel-preset-react": "^6.24.1",
+ "babel-preset-stage-2": "^6.24.1",
+ "css-loader": "^0.28.4",
"faker": "^4.1.0",
+ "file-loader": "^0.11.2",
+ "xpub-styleguide": "^0.0.2",
"react-styleguidist": "^6.0.8",
+ "style-loader": "^0.18.2",
"webpack": "^3.5.5",
"webpack-node-externals": "^1.6.0"
},
diff --git a/src/index.js b/src/index.js
index c11202f70363baa414ac147d5f2c5af84dd5703a..b90319f982aee80332a7297f58324e8c87a99a6a 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,4 +1,2 @@
export { default as AppBar } from './molecules/AppBar'
-export { default as Login } from './molecules/Login'
-export { default as Signup } from './molecules/Signup'
export { default as YesOrNo } from './molecules/YesOrNo'
diff --git a/src/molecules/Login.js b/src/molecules/Login.js
deleted file mode 100644
index 513c6f87c1513bc00f4461a00d158ea49933b40b..0000000000000000000000000000000000000000
--- a/src/molecules/Login.js
+++ /dev/null
@@ -1,38 +0,0 @@
-import React from 'react'
-import classnames from 'classnames'
-import { Field } from 'redux-form'
-import classes from './Login.local.css'
-
- const Login = ({ loginError, handleSubmit }) => (
- <div className={classes.root}>
- <div className={classes.title}>
- Login
- </div>
-
- {loginError && <div className={classes.error}>{loginError}</div>}
-
- <form
- onSubmit={handleSubmit}
- className={classnames({ error: !!loginError, success: !loginError })}>
- <div>
- <label>
- Username
- <Field name="username" component="input" type="text"/>
- </label>
- </div>
-
- <div>
- <label>
- Password
- <Field name="password" component="input" type="password"/>
- </label>
- </div>
-
- <div>
- <button type="submit" className={classes.button}>Login</button>
- </div>
- </form>
- </div>
-)
-
-export default Login
diff --git a/src/molecules/Login.local.css b/src/molecules/Login.local.css
deleted file mode 100644
index ee7dba2315cbe848026d243951aa45c13ddf5c12..0000000000000000000000000000000000000000
--- a/src/molecules/Login.local.css
+++ /dev/null
@@ -1,3 +0,0 @@
-.error {
- color: red;
-}
diff --git a/src/molecules/Login.md b/src/molecules/Login.md
deleted file mode 100644
index b786a768b020332bfc519aea7dfea5f1479c23d8..0000000000000000000000000000000000000000
--- a/src/molecules/Login.md
+++ /dev/null
@@ -1,23 +0,0 @@
-A login form.
-
-```js
-const { reduxForm } = require('redux-form');
-
-const LoginForm = reduxForm({ form: 'login' })(Login);
-
-<LoginForm
- onSubmit={values => console.log(values)}/>
-```
-
-An error is displayed at the top of the form.
-
-```js
-const { reduxForm } = require('redux-form');
-
-const LoginForm = reduxForm({ form: 'login-error' })(Login);
-
-<LoginForm
- loginError="There was an error"
- onSubmit={values => console.log(values)}/>
-```
-
diff --git a/src/molecules/Signup.js b/src/molecules/Signup.js
deleted file mode 100644
index a96ea0f0e71bb4f1a372d4cae0727166ba817c93..0000000000000000000000000000000000000000
--- a/src/molecules/Signup.js
+++ /dev/null
@@ -1,45 +0,0 @@
-import React from 'react'
-import classnames from 'classnames'
-import { Field } from 'redux-form'
-import classes from './Signup.local.css'
-
-const Signup = ({ signupError, handleSubmit }) => (
- <div className={classes.root}>
- <div className={classes.title}>
- Sign up
- </div>
-
- {signupError && <div className={classes.error}>{signupError}</div>}
-
- <form
- onSubmit={handleSubmit}
- className={classnames({ error: !!signupError, success: !signupError })}>
- <div>
- <label>
- Username
- <Field name="username" component="input" type="text"/>
- </label>
- </div>
-
- <div>
- <label>
- Email
- <Field name="email" component="input" type="email"/>
- </label>
- </div>
-
- <div>
- <label>
- Password
- <Field name="password" component="input" type="password"/>
- </label>
- </div>
-
- <div>
- <button type="submit" className={classes.button}>Sign up</button>
- </div>
- </form>
- </div>
-)
-
-export default Signup
diff --git a/src/molecules/Signup.local.css b/src/molecules/Signup.local.css
deleted file mode 100644
index ee7dba2315cbe848026d243951aa45c13ddf5c12..0000000000000000000000000000000000000000
--- a/src/molecules/Signup.local.css
+++ /dev/null
@@ -1,3 +0,0 @@
-.error {
- color: red;
-}
diff --git a/src/molecules/Signup.md b/src/molecules/Signup.md
deleted file mode 100644
index eef2d43915781350bec3754a0d350d39b34b5223..0000000000000000000000000000000000000000
--- a/src/molecules/Signup.md
+++ /dev/null
@@ -1,24 +0,0 @@
-A signup form.
-
-```js
-const { reduxForm } = require('redux-form');
-
-const SignupForm = reduxForm({ form: 'signup' })(Signup);
-
-<SignupForm
- onSubmit={values => console.log(values)}/>
-```
-
-An error is displayed at the top of the form.
-
-```js
-
-const { reduxForm } = require('redux-form');
-
-const SignupForm = reduxForm({ form: 'signup-error' })(Signup);
-
-<SignupForm
- signupError="There was an error"
- onSubmit={values => console.log(values)}/>
-```
-
diff --git a/styleguide.config.js b/styleguide.config.js
index 905c4b2946b728ec89592b9ab2fd5636ff909d59..fc12e711a42680f00e0ad662d8bfeb26c1b8148e 100644
--- a/styleguide.config.js
+++ b/styleguide.config.js
@@ -1,11 +1,8 @@
-const path = require('path')
+const styleguideComponents = require('xpub-styleguide')
module.exports = {
title: 'xpub-ui style guide',
- styleguideComponents: {
- StyleGuideRenderer: path.join(__dirname, 'lib/styleguide/StyleGuideRenderer'),
- Wrapper: path.join(__dirname, 'lib/styleguide/Wrapper'),
- },
+ styleguideComponents,
context: {
faker: 'faker',
},
diff --git a/webpack.config.js b/webpack.config.js
index eb924224b64ea33582065ee8ffe2082e3cff1c89..842d4ee1c90261ada12d399f6d369ee8b058aef2 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -16,6 +16,9 @@ module.exports = {
externals: [nodeExternals({
whitelist: [/\.(?!js$).{1,5}$/i]
})],
+ resolve: {
+ symlinks: false
+ },
module: {
rules: [
{
@@ -25,12 +28,14 @@ module.exports = {
test: /\.js$/,
include: [
path.join(__dirname, 'src'),
- path.join(__dirname, 'lib'),
+ /xpub-[^/]+\/src/,
],
loader: 'babel-loader',
options: {
presets: [
- 'react-app',
+ ['env', { modules: false }],
+ 'react',
+ 'stage-2'
],
cacheDirectory: true,
},
@@ -41,7 +46,7 @@ module.exports = {
test: /\.local\.css$/,
include: [
path.join(__dirname, 'src'),
- path.join(__dirname, 'lib'),
+ /xpub-[^/]+\/src/,
],
use: [
'style-loader',