Commit 02b508dc by Ari Rizzitano

address pr comments

parent 76e1326b
...@@ -13,6 +13,34 @@ Paragon provides accessible React components for use within the Open edX platfor ...@@ -13,6 +13,34 @@ Paragon provides accessible React components for use within the Open edX platfor
Components' markup, keyboard triggers, and behavior are based on the [WAI-ARIA 1.1 Authoring Practices](https://www.w3.org/TR/wai-aria-practices-1.1/). Components are styled with [Bootstrap 4](https://v4-alpha.getbootstrap.com/) via CSS Modules. Documentation/demo site is available at http://edx.github.io/paragon. Components' markup, keyboard triggers, and behavior are based on the [WAI-ARIA 1.1 Authoring Practices](https://www.w3.org/TR/wai-aria-practices-1.1/). Components are styled with [Bootstrap 4](https://v4-alpha.getbootstrap.com/) via CSS Modules. Documentation/demo site is available at http://edx.github.io/paragon.
## Usage
Paragon requires React 16 or higher. To install Paragon into your project:
```
npm i --save @edx/paragon
```
Since Paragon is a React library, components must be rendered with React and ReactDOM. This doesn't mean the entire page has to be rendered with React. You can read up about rendering React into a page within the [official ReactDOM documentation](https://reactjs.org/docs/react-dom.html).
### Component API
API documentation for each component is available below:
- (asInput)[src/asInput]
- (Button)[src/Button]
- (CheckBox)[src/CheckBox]
- (Dropdown)[src/Dropdown]
- (Hyperlink)[src/Hyperlink]
- (InputSelect)[src/InputSelect]
- (InputText)[src/InputText]
- (Modal)[src/Modal]
- (RadioButtonGroup)[src/RadioButtonGroup]
- (StatusAlert)[src/StatusAlert]
- (Table)[src/Table]
- (Tabs)[src/Tabs]
- (TextArea)[src/TextArea]
## Development ## Development
First, clone the repo and install dependencies. You must be running Node 6 or newer. First, clone the repo and install dependencies. You must be running Node 6 or newer.
......
const path = require('path'); const path = require('path');
const merge = require('webpack-merge'); const merge = require('webpack-merge');
const MinifyPlugin = require('babel-minify-webpack-plugin'); const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const staticConfig = require('./webpack.static.config'); const staticConfig = require('./webpack.static.config');
const themeableConfig = require('./webpack.themeable.config'); const themeableConfig = require('./webpack.themeable.config');
const commonConfig = { const commonConfig = {
// 'source-map' raises errors (something about the combination) devtool: 'source-map',
// of MinifyPlugin and ExtractTextPlugin) -- see:
// https://github.com/webpack-contrib/babel-minify-webpack-plugin/issues/68
devtool: 'cheap-source-map',
entry: { entry: {
paragon: path.resolve('./src/index.js'), paragon: path.resolve('./src/index.js'),
}, },
...@@ -17,7 +14,9 @@ const commonConfig = { ...@@ -17,7 +14,9 @@ const commonConfig = {
extensions: ['.js', '.jsx'], extensions: ['.js', '.jsx'],
}, },
plugins: [ plugins: [
new MinifyPlugin(), new UglifyJsPlugin({
sourceMap: true,
}),
], ],
module: { module: {
rules: [ rules: [
...@@ -28,7 +27,7 @@ const commonConfig = { ...@@ -28,7 +27,7 @@ const commonConfig = {
{ {
loader: 'babel-loader', loader: 'babel-loader',
options: { options: {
presets: ['env', 'minify'], presets: ['env'],
}, },
}, },
{ loader: 'source-map-loader' }, { loader: 'source-map-loader' },
......
...@@ -22,6 +22,7 @@ module.exports = { ...@@ -22,6 +22,7 @@ module.exports = {
modules: true, modules: true,
localIdentName: 'paragon__[local]', localIdentName: 'paragon__[local]',
sourceMap: true, sourceMap: true,
minimize: true,
}, },
}, },
{ {
......
...@@ -21,6 +21,8 @@ module.exports = { ...@@ -21,6 +21,8 @@ module.exports = {
options: { options: {
modules: true, modules: true,
localIdentName: '[local]', localIdentName: '[local]',
sourceMap: true,
minimize: true,
}, },
}, },
{ {
......
This source diff could not be displayed because it is too large. You can view the blob instead.
...@@ -50,8 +50,6 @@ ...@@ -50,8 +50,6 @@
"babel-cli": "^6.24.1", "babel-cli": "^6.24.1",
"babel-jest": "^21.0.0", "babel-jest": "^21.0.0",
"babel-loader": "^7.0.0", "babel-loader": "^7.0.0",
"babel-minify": "^0.2.0",
"babel-minify-webpack-plugin": "^0.2.0",
"babel-plugin-transform-object-rest-spread": "^6.23.0", "babel-plugin-transform-object-rest-spread": "^6.23.0",
"babel-preset-env": "^1.4.0", "babel-preset-env": "^1.4.0",
"babel-preset-react": "^6.24.1", "babel-preset-react": "^6.24.1",
...@@ -78,6 +76,7 @@ ...@@ -78,6 +76,7 @@
"semantic-release": "^8.2.0", "semantic-release": "^8.2.0",
"source-map-loader": "^0.2.1", "source-map-loader": "^0.2.1",
"style-loader": "^0.19.0", "style-loader": "^0.19.0",
"uglifyjs-webpack-plugin": "^1.1.4",
"webpack": "^3.0.0", "webpack": "^3.0.0",
"webpack-build-notifier": "^0.1.16", "webpack-build-notifier": "^0.1.16",
"webpack-dev-server": "^2.4.4", "webpack-dev-server": "^2.4.4",
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment