{"_id":"@arizzitano/paragon","_rev":"6-ac9620be8dd6e041aebf481a332037ec","name":"@arizzitano/paragon","description":"Accessible, responsive UI component library based on Bootstrap.","dist-tags":{"latest":"0.0.1-development-4"},"versions":{"0.0.1-development":{"name":"@arizzitano/paragon","version":"0.0.1-development","description":"Accessible, responsive UI component library based on Bootstrap.","main":"src/index.js","license":"MIT","repository":{"type":"git","url":"git+https://github.com/edx/paragon.git"},"scripts":{"build":"NODE_ENV=production webpack --config config/webpack.config.js","build-storybook":"build-storybook","coveralls":"cat ./coverage/lcov.info | coveralls","deploy-storybook":"storybook-to-ghpages","gc":"commit","lint":"eslint --ext .js --ext .jsx .","precommit":"npm run lint","commitmsg":"commitlint -e $GIT_PARAMS","semantic-release":"semantic-release pre && npm publish && semantic-release post","snapshot":"jest --updateSnapshot","start":"start-storybook -p 6006","test":"jest --coverage"},"dependencies":{"@edx/edx-bootstrap":"^0.4.2","babel-polyfill":"^6.26.0","classnames":"^2.2.5","font-awesome":"^4.7.0","prop-types":"^15.5.8","react":"^16.1.0","react-dom":"^16.1.0","react-element-proptypes":"^1.0.0","react-proptype-conditional-require":"^1.0.4"},"devDependencies":{"@commitlint/cli":"^5.2.3","@commitlint/config-angular":"^4.3.0","@commitlint/prompt":"^5.0.1","@commitlint/prompt-cli":"^5.0.1","@storybook/addon-actions":"^3.2.12","@storybook/addon-console":"^1.0.0","@storybook/addon-options":"^3.2.6","@storybook/addon-storyshots":"^3.2.8","@storybook/channels":"^3.2.16","@storybook/react":"^3.2.16","@storybook/storybook-deployer":"^2.0.0","babel-cli":"^6.24.1","babel-jest":"^21.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-preset-env":"^1.4.0","babel-preset-react":"^6.24.1","coveralls":"^3.0.0","css-loader":"^0.28.4","enzyme":"^3.1.1","enzyme-adapter-react-16":"^1.0.4","eslint":"^4.5.0","eslint-config-airbnb":"^16.0.0","eslint-config-edx":"^4.0.1","eslint-import-resolver-webpack":"^0.8.1","eslint-plugin-jsx-a11y":"^5.1.0","eslint-plugin-react":"^7.1.0","extract-text-webpack-plugin":"^3.0.1","file-loader":"^1.1.4","greenkeeper-lockfile":"^1.7.1","husky":"^0.14.1","identity-obj-proxy":"^3.0.0","jest":"^21.0.1","node-sass":"^4.5.3","postcss-scss":"^1.0.1","react-router-dom":"^4.1.1","react-test-renderer":"^16.1.0","sass-loader":"^6.0.5","semantic-release":"^8.2.0","source-map-loader":"^0.2.1","style-loader":"^0.19.0","webpack":"^3.0.0","webpack-build-notifier":"^0.1.16","webpack-dev-server":"^2.4.4","webpack-merge":"^4.1.0"},"jest":{"setupFiles":["./src/setupTest.js"],"moduleNameMapper":{"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$":"<rootDir>/__mocks__/fileMock.js","\\.(css|scss)$":"identity-obj-proxy"},"coveragePathIgnorePatterns":["/node_modules/","(.stories)\\.(jsx)$"]},"gitHead":"46ec263ddcc60ad657f7769e34df9119610ed4f1","bugs":{"url":"https://github.com/edx/paragon/issues"},"homepage":"https://github.com/edx/paragon#readme","_id":"@arizzitano/paragon@0.0.1-development","_shasum":"1f17925d5b24d17324d70d530115d27923f69b21","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.10.3","_npmUser":{"name":"arizzitano","email":"arizzitano@gmail.com"},"dist":{"shasum":"1f17925d5b24d17324d70d530115d27923f69b21","tarball":"https://registry.npmjs.org/@arizzitano/paragon/-/paragon-0.0.1-development.tgz","integrity":"sha512-jZ1PhrYIl/RAv9LCoKoSxwwVHnMapOdWkQMDatVURv81Qqxbm8w+EtgOmv4tHvegpCbKyap+O6qS8TgrPiSiWQ==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBWWGdWz6deDgn3qLNQcI+MgnNLaJJnxv/w74zc81VUNAiEAtbvSr+G/M2IyQFU2GdqcJQ6fh/6J613auxIauxQcbtE="}]},"maintainers":[{"name":"arizzitano","email":"arizzitano@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/paragon-0.0.1-development.tgz_1512920849983_0.6240602706093341"}},"0.0.1-development-2":{"name":"@arizzitano/paragon","version":"0.0.1-development-2","description":"Accessible, responsive UI component library based on Bootstrap.","main":"dist/paragon.min.js","license":"MIT","repository":{"type":"git","url":"git+https://github.com/edx/paragon.git"},"scripts":{"build":"NODE_ENV=production webpack --config config/webpack.config.js","build-storybook":"build-storybook","coveralls":"cat ./coverage/lcov.info | coveralls","deploy-storybook":"storybook-to-ghpages","gc":"commit","lint":"eslint --ext .js --ext .jsx .","precommit":"npm run lint","commitmsg":"commitlint -e $GIT_PARAMS","semantic-release":"semantic-release pre && npm publish && semantic-release post","snapshot":"jest --updateSnapshot","start":"start-storybook -p 6006","test":"jest --coverage"},"dependencies":{"@edx/edx-bootstrap":"^0.4.2","babel-polyfill":"^6.26.0","classnames":"^2.2.5","font-awesome":"^4.7.0","prop-types":"^15.5.8","react":"^16.1.0","react-dom":"^16.1.0","react-element-proptypes":"^1.0.0","react-proptype-conditional-require":"^1.0.4"},"devDependencies":{"@commitlint/cli":"^5.2.3","@commitlint/config-angular":"^4.3.0","@commitlint/prompt":"^5.0.1","@commitlint/prompt-cli":"^5.0.1","@storybook/addon-actions":"^3.2.12","@storybook/addon-console":"^1.0.0","@storybook/addon-options":"^3.2.6","@storybook/addon-storyshots":"^3.2.8","@storybook/channels":"^3.2.16","@storybook/react":"^3.2.16","@storybook/storybook-deployer":"^2.0.0","babel-cli":"^6.24.1","babel-jest":"^21.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-preset-env":"^1.4.0","babel-preset-react":"^6.24.1","coveralls":"^3.0.0","css-loader":"^0.28.4","enzyme":"^3.1.1","enzyme-adapter-react-16":"^1.0.4","eslint":"^4.5.0","eslint-config-airbnb":"^16.0.0","eslint-config-edx":"^4.0.1","eslint-import-resolver-webpack":"^0.8.1","eslint-plugin-jsx-a11y":"^5.1.0","eslint-plugin-react":"^7.1.0","extract-text-webpack-plugin":"^3.0.1","file-loader":"^1.1.4","greenkeeper-lockfile":"^1.7.1","husky":"^0.14.1","identity-obj-proxy":"^3.0.0","jest":"^21.0.1","node-sass":"^4.5.3","postcss-scss":"^1.0.1","react-router-dom":"^4.1.1","react-test-renderer":"^16.1.0","sass-loader":"^6.0.5","semantic-release":"^8.2.0","source-map-loader":"^0.2.1","style-loader":"^0.19.0","webpack":"^3.0.0","webpack-build-notifier":"^0.1.16","webpack-dev-server":"^2.4.4","webpack-merge":"^4.1.0"},"jest":{"setupFiles":["./src/setupTest.js"],"moduleNameMapper":{"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$":"<rootDir>/__mocks__/fileMock.js","\\.(css|scss)$":"identity-obj-proxy"},"coveragePathIgnorePatterns":["/node_modules/","(.stories)\\.(jsx)$"]},"gitHead":"46ec263ddcc60ad657f7769e34df9119610ed4f1","bugs":{"url":"https://github.com/edx/paragon/issues"},"homepage":"https://github.com/edx/paragon#readme","_id":"@arizzitano/paragon@0.0.1-development-2","_shasum":"610106a797f505fe7d367eaf8585ab7e38a7967d","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.10.3","_npmUser":{"name":"arizzitano","email":"arizzitano@gmail.com"},"dist":{"shasum":"610106a797f505fe7d367eaf8585ab7e38a7967d","tarball":"https://registry.npmjs.org/@arizzitano/paragon/-/paragon-0.0.1-development-2.tgz","integrity":"sha512-72xIDtUKs8W2e4ZfKFB40rkLM0Tye0hcO37Za09dOi3hPZJNI8eEnrbRdpVWlZyakdbz4OXoUtYnG5hbzL3Qfg==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBerso/Wx0bzeFRzWFjV8vEo9my3zaRrZuc08UHmrt2WAiEAzMQDJu2eUeaLNM77QlwXD2ptBDfBOJ0Fec0t5X7cBCc="}]},"maintainers":[{"name":"arizzitano","email":"arizzitano@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/paragon-0.0.1-development-2.tgz_1512930677057_0.09924803278408945"}},"0.0.1-development-3":{"name":"@arizzitano/paragon","version":"0.0.1-development-3","description":"Accessible, responsive UI component library based on Bootstrap.","main":"themeable/paragon.min.js","license":"MIT","repository":{"type":"git","url":"git+https://github.com/edx/paragon.git"},"scripts":{"build":"NODE_ENV=production webpack --config config/webpack.config.js","build-storybook":"build-storybook","commitmsg":"commitlint -e $GIT_PARAMS","coveralls":"cat ./coverage/lcov.info | coveralls","deploy-storybook":"storybook-to-ghpages","gc":"commit","lint":"eslint --ext .js --ext .jsx .","precommit":"npm run lint","prepublishOnly":"npm run build","semantic-release":"semantic-release pre && npm publish && semantic-release post","snapshot":"jest --updateSnapshot","start":"start-storybook -p 6006","test":"jest --coverage"},"dependencies":{"@edx/edx-bootstrap":"^0.4.2","babel-polyfill":"^6.26.0","classnames":"^2.2.5","font-awesome":"^4.7.0","prop-types":"^15.5.8","react":"^16.1.0","react-dom":"^16.1.0","react-element-proptypes":"^1.0.0","react-proptype-conditional-require":"^1.0.4"},"devDependencies":{"@commitlint/cli":"^5.2.3","@commitlint/config-angular":"^4.3.0","@commitlint/prompt":"^5.0.1","@commitlint/prompt-cli":"^5.0.1","@storybook/addon-actions":"^3.2.12","@storybook/addon-console":"^1.0.0","@storybook/addon-options":"^3.2.6","@storybook/addon-storyshots":"^3.2.8","@storybook/channels":"^3.2.16","@storybook/react":"^3.2.16","@storybook/storybook-deployer":"^2.0.0","babel-cli":"^6.24.1","babel-jest":"^21.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-preset-env":"^1.4.0","babel-preset-react":"^6.24.1","coveralls":"^3.0.0","css-loader":"^0.28.4","enzyme":"^3.1.1","enzyme-adapter-react-16":"^1.0.4","eslint":"^4.5.0","eslint-config-airbnb":"^16.0.0","eslint-config-edx":"^4.0.1","eslint-import-resolver-webpack":"^0.8.1","eslint-plugin-jsx-a11y":"^5.1.0","eslint-plugin-react":"^7.1.0","extract-text-webpack-plugin":"^3.0.1","file-loader":"^1.1.4","greenkeeper-lockfile":"^1.7.1","husky":"^0.14.1","identity-obj-proxy":"^3.0.0","jest":"^21.0.1","node-sass":"^4.5.3","postcss-scss":"^1.0.1","react-router-dom":"^4.1.1","react-test-renderer":"^16.1.0","sass-loader":"^6.0.5","semantic-release":"^8.2.0","source-map-loader":"^0.2.1","style-loader":"^0.19.0","webpack":"^3.0.0","webpack-build-notifier":"^0.1.16","webpack-dev-server":"^2.4.4","webpack-merge":"^4.1.0"},"jest":{"setupFiles":["./src/setupTest.js"],"moduleNameMapper":{"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$":"<rootDir>/__mocks__/fileMock.js","\\.(css|scss)$":"identity-obj-proxy"},"coveragePathIgnorePatterns":["/node_modules/","(.stories)\\.(jsx)$"]},"gitHead":"1f1eb224930b3021a358d27c99956c9fc992378f","bugs":{"url":"https://github.com/edx/paragon/issues"},"homepage":"https://github.com/edx/paragon#readme","_id":"@arizzitano/paragon@0.0.1-development-3","_shasum":"2fc46e94dbcb11f8e8d6a0449c695cc17d53eb11","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.10.3","_npmUser":{"name":"arizzitano","email":"arizzitano@gmail.com"},"dist":{"shasum":"2fc46e94dbcb11f8e8d6a0449c695cc17d53eb11","tarball":"https://registry.npmjs.org/@arizzitano/paragon/-/paragon-0.0.1-development-3.tgz","integrity":"sha512-9vDZwwiq6OgPcP1Yb2r8lYmBaWYqg2l3Zw63XnsfPNBwjpiuZU8Ae4hVRKY7wlcpTRBLW5S7XBzrac0b/7r4kg==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCwXYuWCsl+i0/e5+YxVvfkkSHSBf22RbBFdX2CgARppAIgA07v7gIYnff40RB44kaje/6AGL+K0R4hnzK5ifEDEmc="}]},"maintainers":[{"name":"arizzitano","email":"arizzitano@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/paragon-0.0.1-development-3.tgz_1513094204745_0.3143115707207471"}},"0.0.1-development-4":{"name":"@arizzitano/paragon","version":"0.0.1-development-4","description":"Accessible, responsive UI component library based on Bootstrap.","main":"themeable/paragon.min.js","license":"MIT","repository":{"type":"git","url":"git+https://github.com/edx/paragon.git"},"scripts":{"build":"NODE_ENV=production webpack --config config/webpack.config.js","build-storybook":"build-storybook","commitmsg":"commitlint -e $GIT_PARAMS","coveralls":"cat ./coverage/lcov.info | coveralls","deploy-storybook":"storybook-to-ghpages","gc":"commit","lint":"eslint --ext .js --ext .jsx .","precommit":"npm run lint","prepublishOnly":"npm run build","semantic-release":"semantic-release pre && npm publish && semantic-release post","snapshot":"jest --updateSnapshot","start":"start-storybook -p 6006","test":"jest --coverage"},"dependencies":{"@edx/edx-bootstrap":"^0.4.2","babel-polyfill":"^6.26.0","classnames":"^2.2.5","font-awesome":"^4.7.0","prop-types":"^15.5.8","react":"^16.1.0","react-dom":"^16.1.0","react-element-proptypes":"^1.0.0","react-proptype-conditional-require":"^1.0.4"},"devDependencies":{"@commitlint/cli":"^5.2.3","@commitlint/config-angular":"^4.3.0","@commitlint/prompt":"^5.0.1","@commitlint/prompt-cli":"^5.0.1","@storybook/addon-actions":"^3.2.12","@storybook/addon-console":"^1.0.0","@storybook/addon-options":"^3.2.6","@storybook/addon-storyshots":"^3.2.8","@storybook/channels":"^3.2.16","@storybook/react":"^3.2.16","@storybook/storybook-deployer":"^2.0.0","babel-cli":"^6.24.1","babel-jest":"^21.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-preset-env":"^1.4.0","babel-preset-react":"^6.24.1","coveralls":"^3.0.0","css-loader":"^0.28.4","enzyme":"^3.1.1","enzyme-adapter-react-16":"^1.0.4","eslint":"^4.5.0","eslint-config-edx":"^4.0.1","eslint-import-resolver-webpack":"^0.8.1","eslint-plugin-react":"^7.1.0","extract-text-webpack-plugin":"^3.0.1","file-loader":"^1.1.4","greenkeeper-lockfile":"^1.7.1","husky":"^0.14.1","identity-obj-proxy":"^3.0.0","jest":"^21.0.1","node-sass":"^4.5.3","postcss-scss":"^1.0.1","react-router-dom":"^4.1.1","react-test-renderer":"^16.1.0","sass-loader":"^6.0.5","semantic-release":"^8.2.0","source-map-loader":"^0.2.1","style-loader":"^0.19.0","webpack":"^3.0.0","webpack-build-notifier":"^0.1.16","webpack-dev-server":"^2.4.4","webpack-merge":"^4.1.0"},"jest":{"setupFiles":["./src/setupTest.js"],"moduleNameMapper":{"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$":"<rootDir>/__mocks__/fileMock.js","\\.(css|scss)$":"identity-obj-proxy"},"coveragePathIgnorePatterns":["/node_modules/","(.stories)\\.(jsx)$"]},"gitHead":"59fdffba092dd80a4357e5806e6415e50ad2d676","bugs":{"url":"https://github.com/edx/paragon/issues"},"homepage":"https://github.com/edx/paragon#readme","_id":"@arizzitano/paragon@0.0.1-development-4","_npmVersion":"5.5.1","_nodeVersion":"8.9.3","_npmUser":{"name":"arizzitano","email":"arizzitano@gmail.com"},"dist":{"integrity":"sha512-HYOkR64oU/uLjX+Qskd76IOxDP3eL0SglqFKqZmWTclKWOVWsLzSo4hBhGULFDi5kPqgo8OnNM7EeANAgBl8bw==","shasum":"50bb65ff4b01ca1e283109682c864789237a2f6f","tarball":"https://registry.npmjs.org/@arizzitano/paragon/-/paragon-0.0.1-development-4.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCID1FD8vmCCbZaVe97j7k616XyCu+RBw7tIn5+QC0F2kGAiEAvtHMI1TvQ1s3B9TaKZ0j77NswunBwmyt55UvtCo0I5k="}]},"maintainers":[{"name":"arizzitano","email":"arizzitano@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/paragon-0.0.1-development-4.tgz_1513111504524_0.3681349530816078"}}},"readme":"# Paragon\n\n[![Build Status](https://travis-ci.org/edx/paragon.svg?branch=master)](https://travis-ci.org/edx/paragon) [![Coveralls](https://img.shields.io/coveralls/edx/paragon.svg?branch=master)](https://coveralls.io/github/edx/paragon) [![Greenkeeper badge](https://badges.greenkeeper.io/edx/paragon.svg)](https://greenkeeper.io/)\n[![npm_version](https://img.shields.io/npm/v/@edx/paragon.svg)](@edx/paragon)\n[![npm_downloads](https://img.shields.io/npm/dt/@edx/paragon.svg)](@edx/paragon)\n[![license](https://img.shields.io/npm/l/@edx/paragon.svg)](@edx/paragon)\n[![semantic-release](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg)](https://github.com/semantic-release/semantic-release)\n\n\nParagon provides accessible React components for use within the Open edX platform and beyond.\n\n<img src=\"http://i.imgur.com/uxTl3L3.gif\" width=\"200\" alt=\"sparkly 8-bit diamond\" />\n\nComponents' 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.\n\n## Development\n\nFirst, clone the repo and install dependencies. You must be running Node 6 or newer.\n\n```\n$ git clone git@github.com:edx/paragon.git\n$ cd paragon\n$ npm install\n```\n\n### Storybook\n\nParagon uses [Storybook](https://storybook.js.org/) to generate and serve its documentation/demo site. Storybook also serves as an excellent sandbox space to develop new components or modify existing ones. For each component, developers write React code \"stories\" demonstrating different ways to invoke it in order to show off its functionality. Storybook renders all the stories within its own runtime as interactive chunks of UI.\n\nTo start the Storybook server locally, run the following:\n\n```\n$ npm run start\n```\n\nStorybook will serve at http://localhost:6006. It's important to note that the Storybook server uses its own [webpack config file](https://github.com/edx/paragon/blob/master/.storybook/webpack.config.js) which is separate from the project root config.\n\n### Adding a Component\n\nTo add a new component, create a directory within /src named `<ComponentName>` (use UpperCamelCase, per [Airbnb's React best practices](https://github.com/airbnb/javascript/tree/master/react)). Define your component (using the same `<ComponentName>` as the class name) within a file in this directory named `index.jsx`.\n\nTo see your component in action, you will need to create a new Storybook story for it. Create a file within your component's directory named `<ComponentName>.stories.js`. Check out [InputSelect.stories.jsx](https://github.com/edx/paragon/blob/master/src/InputSelect/InputSelect.stories.jsx) for an example of some good stories. Storybook will automatically pick up this file and serve its stories -- you should be able to see them linked from the left-hand menu.\n\nMake sure to define PropTypes and DefaultProps on your components, using the [prop-types package](https://github.com/facebook/prop-types). PropTypes provide a clear API for your component and help consumers invoke it properly within their own code. In terms of functionality, ship an MVP component up-front. Don't make it do any more than is necessary. It's easy to add new functionality later on as needed, but it's much harder to remove functionality once we've released a component.\n\n### ESLint\n\nParagon runs ESLint as a pre-commit hook. If your code fails linting, you will not be able to commit. To avoid hitting a giant-wall-of-linter-failures when you try to commit, we recommend [configuring your editor to run ESLint](http://eslint.org/docs/user-guide/integrations). To run ESLint in the console at any time, run the following:\n\n```\n$ npm run lint\n```\n\nParagon's ESLint config is based off [eslint-config-edx](https://github.com/edx/eslint-config-edx/tree/master/packages/eslint-config-edx), which itself is based off [eslint-config-airbnb](https://www.npmjs.com/package/eslint-config-airbnb). Paragon uses ESLint 3 (and will upgrade to v4 as soon as eslint-config-airbnb releases a supported version), which itself comes with a number of built-in rules. This configuration is highly opinionated and may contain some rules with which you aren't yet familiar, like [comma-dangle](http://eslint.org/docs/rules/comma-dangle), but rest assured, you're writing modern, best-practice JS 💅\n\nOne of the most powerful features of this ESLint config is its inclusion of [eslint-plugin-jsx-a11y](https://github.com/evcohen/eslint-plugin-jsx-a11y). This plugin actually enforces accessibility best practices at the _linter_ level. It will catch things reviewers might not notice, like [event handlers bound to noninteractive elements](https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-noninteractive-element-interactions.md). Of course, it won't catch *all* accessibility violations, but it's a pretty good low-pass filter.\n\n## Testing\n\nParagon uses [Jest](https://facebook.github.io/jest/) with [Enzyme](https://github.com/airbnb/enzyme) for tests and coverage. Both libraries are full-featured and very well supported.\n\n### Unit Testing\n\n[Jest](https://facebook.github.io/jest/) is an all-in-one test runner and assertion library created for use with React components. Jest's [API](https://facebook.github.io/jest/docs/en/api.html) is similar to Jasmine's and comes with functionality for mocking and spying as well. Check out [the docs](https://facebook.github.io/jest/docs/en/getting-started.html) for more details -- they are very comprehensive.\n\nParagon also uses Airbnb's [Enzyme](http://airbnb.io/enzyme/) library to help render our components within unit tests. Enzyme comes with a number of utilities for shallow rendering, mounting components, querying the DOM, simulating DOM events, and querying React components themselves. Read [the docs](http://airbnb.io/enzyme/docs/api/index.html) for more details.\n\nTo run the unit tests, run:\n\n```\nnpm run test\n```\n\nTo add unit tests for a component, create a file in your component's directory named `<ComponentName>.test.js`. Jest will automatically pick up this file and run the tests as part of the suite. Take a look at [Dropdown.test.jsx](https://github.com/edx/paragon/blob/master/src/Dropdown/Dropdown.test.jsx) or [CheckBox.test.jsx](https://github.com/edx/paragon/blob/master/src/CheckBox/CheckBox.test.jsx) for examples of good component unit tests.\n\n### Snapshot Testing\n\nJest has built-in [snapshot testing](http://facebook.github.io/jest/docs/en/snapshot-testing.html#snapshot-testing-with-jest) functionality which serves as a good means of smoketesting components to ensure they render in a predictable way. Paragon's Jest snapshots are automatically generated from components' Storybook stories using the [Storyshots addon](https://github.com/storybooks/storybook/blob/4b6a93acfbaf044d85dd8ee7a7671239ea1ba01d/addons/storyshots/README.md) -- pretty cool, huh?\n\nWhen you modify components or stories (or add new components or stories), make sure to update the snapshots or else the snapshot tests will fail. It's easy to do -- just run:\n\n```\n$ npm run snapshot\n```\n\nIf the snapshot tests fail, it's generally pretty easy to tell whether it's happening because of a bug or because the snapshots need to be updated. Don't be afraid to inspect the test output for clues!\n\n### Coverage\n\nParagon measures code coverage using Jest's built-in `--coverage` flag (which I believe uses istanbul under the hood) and report it via [Coveralls](https://coveralls.io/github/edx/paragon). Shoot for 100% test coverage on your PRs, but use your best judgment if you're really struggling to cover those last few lines. At the very least, don't *reduce* total coverage. Coveralls will fail your build if your PR reduces coverage.\n","maintainers":[{"name":"arizzitano","email":"arizzitano@gmail.com"}],"time":{"modified":"2022-06-12T14:47:53.487Z","created":"2017-12-10T15:47:31.789Z","0.0.1-development":"2017-12-10T15:47:31.789Z","0.0.1-development-2":"2017-12-10T18:31:17.218Z","0.0.1-development-3":"2017-12-12T15:56:46.445Z","0.0.1-development-4":"2017-12-12T20:45:06.247Z"},"homepage":"https://github.com/edx/paragon#readme","repository":{"type":"git","url":"git+https://github.com/edx/paragon.git"},"bugs":{"url":"https://github.com/edx/paragon/issues"},"license":"MIT","readmeFilename":"README.md"}