diff --git a/.eslintignore b/.eslintignore index b94707787..8167354c9 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1,2 +1,3 @@ node_modules/ dist/ +src/polyfills/ diff --git a/.eslintrc b/.eslintrc index 33228629b..8c15b4b62 100644 --- a/.eslintrc +++ b/.eslintrc @@ -36,66 +36,127 @@ } }, "rules": { + "arrow-body-style": ["error", "as-needed"], "array-bracket-spacing": ["warn"], + "arrow-parens": ["error", "as-needed"], + "arrow-spacing": ["error"], "babel/new-cap": 0, "babel/no-invalid-this": 1, "babel/object-curly-spacing": ["warn", "always"], "babel/quotes": ["error", "double"], "babel/semi": ["error"], + "block-spacing": ["error", "always"], "block-scoped-var": ["warn"], + "brace-style": ["error", "1tbs", { "allowSingleLine": true }], "camelcase": ["warn"], "comma-dangle": ["warn", "never"], "comma-spacing": ["warn"], "comma-style": ["warn"], "computed-property-spacing": ["warn"], "constructor-super": ["error"], - "eol-last": ["warn"], - "eqeqeq": ["warn"], + "curly": ["error", "all"], + "default-case": ["error"], + "dot-notation": ["error"], + "eol-last": ["error"], + "eqeqeq": ["error"], "func-call-spacing": ["warn"], + "func-style": ["error", "expression"], + "implicit-arrow-linebreak": ["error", "beside"], "indent": ["error", 4, { "SwitchCase": 1 }], "jsx-quotes": ["error", "prefer-double"], "key-spacing": ["warn"], "keyword-spacing": ["warn"], "linebreak-style": 0, + "lines-between-class-members": ["error"], "new-cap": 0, + "new-parens": ["error"], + "newline-before-return": ["error"], "newline-per-chained-call": ["warn"], - "no-alert": ["warn"], - "no-console": ["warn", {"allow": ["warn", "error"]}], + "no-alert": ["error"], + "no-console": ["warn", { "allow": ["warn", "error"] }], "no-const-assign": ["error"], + "no-dupe-class-members": ["error"], + "no-duplicate-imports": ["error"], + "no-empty-function": ["error"], + "no-eval": ["error"], "no-extra-semi": ["error"], + "no-floating-decimal": ["error"], "no-inner-declarations": 0, "no-invalid-regexp": ["error"], "no-irregular-whitespace": ["error"], + "no-lonely-if": ["error"], "no-mixed-spaces-and-tabs": ["error"], "no-multi-spaces": ["warn"], - "no-multiple-empty-lines": ["error"], + "no-multiple-empty-lines": ["error", { "max": 1 }], "no-redeclare": ["warn"], "no-this-before-super": ["warn"], "no-trailing-spaces": ["error"], "no-undef": ["error"], - "no-unneeded-ternary": ["warn"], + "no-undef-init": ["error"], + "no-unneeded-ternary": ["error"], "no-unreachable": ["error"], "no-unused-vars": ["warn"], - "no-var": ["warn"], + "no-useless-constructor": ["error"], + "no-useless-rename": ["error"], + "no-useless-return": ["error"], + "no-var": ["error"], "no-whitespace-before-property": ["warn"], "node/exports-style": ["error", "module.exports"], "object-curly-newline": ["warn"], - "object-curly-spacing": 0, + "object-curly-spacing": ["warn", "always"], "object-property-newline": ["warn"], - "prefer-const": ["warn"], + "object-shorthand": ["error", "always", { "avoidExplicitReturnArrows": true }], + "one-var": ["error", "never"], + "padding-line-between-statements": ["error", + { + "blankLine": "always", + "prev": "*", + "next": ["class", "const", "block", "block-like", "break", "export", "expression", "do", "for", "function", "if", "import", "let", "return", "switch", "try", "while"] + }, + { + "blankLine": "always", + "prev": ["class", "const", "block", "block-like", "break", "export", "expression", "do", "for", "function", "if", "import", "let", "return", "switch", "try", "while"], + "next": "*" + }, + { + "blankLine": "any", + "prev": "expression", + "next": "expression" + }, + { + "blankLine": "any", + "prev": "import", + "next": "import" + }, + { + "blankLine": "any", + "prev": ["let", "const"], + "next": ["let", "const"] + } + ], + "prefer-arrow-callback": ["error"], + "prefer-const": ["error"], + "prefer-destructuring": ["error", { "array": false }], + "prefer-object-spread": ["error"], "prefer-spread": ["warn"], + "prefer-template": ["error"], + "quote-props": ["error", "as-needed"], "quotes": 0, "react/prop-types": 0, + "rest-spread-spacing": ["error", "never"], "security/detect-non-literal-regexp": 0, "security/detect-object-injection": 0, "security/detect-unsafe-regex": 0, "semi": 0, "semi-spacing": ["warn"], - "semi-style": ["warn"], - "space-before-function-paren": ["warn"], + "semi-style": ["error"], + "space-before-blocks": ["error"], + "space-before-function-paren": ["error"], "space-in-parens": ["warn"], "space-infix-ops": ["warn"], - "spaced-comment": ["warn"], + "spaced-comment": ["error"], + "switch-colon-spacing": ["error"], + "template-curly-spacing": ["error", "never"], "wrap-regex": ["error"] } } diff --git a/.gitignore b/.gitignore index 2ceb568c3..495bbdc41 100644 --- a/.gitignore +++ b/.gitignore @@ -3,6 +3,7 @@ dist # Local vs code settings .vscode/ +.vs/ # Logs logs diff --git a/.stylelintignore b/.stylelintignore index 020feae70..8a37aeb04 100644 --- a/.stylelintignore +++ b/.stylelintignore @@ -3,3 +3,4 @@ dist/styles *.md **/*.js **/*.snap.js +src/less/core/normalize.less diff --git a/.stylelintrc b/.stylelintrc index ffcf6e966..8389eefb3 100644 --- a/.stylelintrc +++ b/.stylelintrc @@ -1,14 +1,48 @@ { "extends": ["stylelint-config-standard"], "ignoreFiles": ["**/*.md", "**/*.js", "**/*.js.snap", "**/*.css"], + "plugins": [ + "stylelint-csstree-validator", + "stylelint-declaration-block-no-ignored-properties" + ], "rules": { - "indentation": 4, - "selector-pseudo-element-colon-notation": "single", - "no-descending-specificity": null, + "at-rule-name-space-after": "always", + "at-rule-no-unknown": null, + "color-hex-case": [ "lower", { + "message": "Lowercase letters are easier to distinguish from numbers" + }], + "color-named": "never", + "csstree/validator": true, + "declaration-block-semicolon-newline-after": "always-multi-line", + "declaration-block-semicolon-newline-before": "never-multi-line", + "declaration-block-semicolon-space-after": "always-single-line", + "declaration-no-important": true, "color-hex-length": "long", + "font-family-no-missing-generic-family-keyword": null, + "font-family-name-quotes": "always-where-recommended", + "indentation": 4, + "length-zero-no-unit": true, "max-empty-lines": [2, { "ignore": ["comments"] }], + "max-line-length": null, + "media-feature-name-no-vendor-prefix": true, + "media-feature-parentheses-space-inside": "never", + "media-feature-range-operator-space-after": "always", + "media-feature-range-operator-space-before": "never", + "no-descending-specificity": null, + "no-duplicate-selectors": true, + "number-max-precision": 4, + "plugin/declaration-block-no-ignored-properties": true, + "selector-attribute-quotes": "always", + "selector-list-comma-newline-after": "always", + "selector-list-comma-newline-before": "never-multi-line", + "selector-list-comma-space-after": "always-single-line", + "selector-list-comma-space-before": "never-single-line", + "selector-pseudo-element-colon-notation": "single", "string-quotes": "double", - "font-family-no-missing-generic-family-keyword": null, - "at-rule-no-unknown": null + "unit-whitelist": ["%", "px", "rem", "vh", "vw", "s", "deg", "ch"], + "value-keyword-case": "lower", + "value-list-comma-newline-after": "never-multi-line", + "value-list-comma-newline-before": "never-multi-line", + "value-list-comma-space-after": "always" } } diff --git a/CHANGELOG.md b/CHANGELOG.md index 6f2a782ee..92835b952 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,8 +1,33 @@ # Changelog -## [0.11.1] - 2018-09-26 +## [0.12.0] - 2018-10-10 + +### Added + +- Added class `.button-group`. +- Added Step Bar component. +- Added basic spacing utility classes with documentation section (spacing classes with breakpoints will be implemented later). + +### Changed + +- Updated readme with deploy/release procedure. +- Reworked tabs. +- Reworked form validation. +- Removed `margin-bottom: 3px` from button component. +- Adjusted spacing between status indicator and text in status component. ### Fixed -- Fixed issue with documentation page for toast crashing. -- Fixed bug with topbar script crashing when topbar button does not contain an icon. +- Fixed issue with item-list alignment. +- Fixed issue with action list icon being visible through topbar. +- Fixed an issue with topbar component where clicking anchor links does not close the open menu. +- Fixed an issue with datepicker not displaying properly, or at all, when clicking on label. +- Fixed an issue where alert close button got properties from the new `` styling (blue border bottom). +- Fixed a minor issue with toast not resetting its type, if called without a type after another toast with a type has already been called. +- Fixed an issue with open tabs not closing on screen resize. +- Fixed an issue with toast overlapping topbar. + +### Removed + +- Removed modal from designguide. +- Removed styling for table within panel footer. diff --git a/README.md b/README.md index 9c8042a7f..9bc955973 100644 --- a/README.md +++ b/README.md @@ -1,8 +1,8 @@ ![PayEx logo](./src/img/px-logo.svg) -# design.payex.com +# PayEx DesignGuide -[![Version](https://img.shields.io/badge/Version-0.11.1-blue.svg)](https://ci.appveyor.com/project/erikhallaraaker/design-payex-com/branch/master) +[![Version](https://img.shields.io/badge/Version-0.12.0-blue.svg)](https://ci.appveyor.com/project/erikhallaraaker/design-payex-com/branch/master) [![Build status](https://ci.appveyor.com/api/projects/status/1dii19sqw1m7xtsn/branch/master?svg=true)](https://ci.appveyor.com/project/PayEx/design-payex-com/branch/master) [![dependencies Status](https://david-dm.org/payex/design.payex.com/status.svg)](https://david-dm.org/payex/design.payex.com) [![devDependencies Status](https://david-dm.org/payex/design.payex.com/dev-status.svg)](https://david-dm.org/payex/design.payex.com?type=dev) @@ -18,12 +18,12 @@ DesignGuide requires [Node.js](https://nodejs.org/en/) (includes npm). ### Installing 1. Open a terminal and navigate to repo root -1. `npm install` -1. `npm start` +2. `npm install` +3. `npm start` * If encountering an error, you might need to install [webpack-dev-server](https://github.com/webpack/webpack-dev-server) globally. You can do this by running the command `npm i webpack-dev-server -g`. -1. Go to -1. Works? If not, contact us on Slack ([#design-guide-general](https://payex.slack.com/messages/C0L3W8B2S/)). -1. Get to work. +4. Go to +5. Works? If not, contact us on Slack ([#design-guide-general](https://payex.slack.com/messages/C0L3W8B2S/)). +6. Get to work. ## Developing @@ -34,7 +34,7 @@ DesignGuide requires [Node.js](https://nodejs.org/en/) (includes npm). ### Setting up Dev -* Running the command `npm start` starts the webpack dev server, (which is configured in `./webpack.config.js`). If any changes is made to this file, or any files directly influencing this file (i.e. any loaders or plugins) you need to restart the server. +* Running the command `npm start` starts the webpack dev server, (which is configured in `~/webpack.config.js`). If any changes is made to this file, or any files directly influencing this file (i.e. any loaders or plugins) you need to restart the server. * The script `npm start` will start the dev server in development mode. If you wish to run the dev server in production-like environment run the command `npm run start:prod`. #### Importing components @@ -42,32 +42,32 @@ DesignGuide requires [Node.js](https://nodejs.org/en/) (includes npm). When importing different components in the files you create, you can use shortcuts for common paths. The shortcuts are as following: * `~` - root of the project (example `import package from "~/package";`). -* `$` - `./src`-folder (example `import px from "$/px-script";`). -* `@` - `./src/App/components`-folder (example `import Alert from "@/Alert";`). -* `#` - `./src/App/Documentation/utils`-folder (example `import { DocToc } from "#";`). +* `$` - `~/src`-folder (example `import px from "$/px-script";`). +* `@` - `~/src/App/components`-folder (example `import Alert from "@/Alert";`). +* `#` - `~/src/App/Documentation/utils`-folder (example `import { DocToc } from "#";`). -The shortcuts are specified in the `./.babelrc`-file. Specifying the prefix-shortcuts in the `./jsconfig.json`-file enables path intellisense for the shortcuts (at least in VSCode). +The shortcuts are specified in the `~/.babelrc`-file. Specifying the prefix-shortcuts in the `~/jsconfig.json`-file enables path intellisense for the shortcuts (at least in VSCode). ### Building -To start building, run the command `npm run build` to start in dev-mode, or `npm run build:prod` for production-mode. This will make webpack start bundling everything and make static files in the `./dist/`-folder. It will also run through all files in `./src/` with eslint making sure all files are without errors before building. Also make sure all tests pass, or make changes to them accordingly. -> Note: Running the command `npm run build:prod` will delete all files already located in `./dist`. +To start building, run the command `npm run build` to start in dev-mode, or `npm run build:prod` for production-mode. This will make webpack start bundling everything and make static files in the `~/dist/`-folder. Also make sure all tests pass, or make changes to them accordingly. +> Note: Running the command `npm run build:prod` will delete all files already located in `~/dist`. ## Versioning -Design Guide uses [semantic versioning](http://semver.org/). This means that internally, Design Guide will use a `major.minor.patch` version number to signal what the changes in each release surmount to. Since `minor` and `patch` version increments means backwards compatibility will be upheld, only the `major` version number will be a part of the URL of CSS and JavaScript files. This also means both CSS and JavaScript files are versioned in lockstep, so whenever a new `major` version of the CSS is released, a new `major` version of the JavaScript will be as well. +DesignGuide uses [semantic versioning](http://semver.org/). This means that internally, DesignGuide will use a `major.minor.patch` version number to signal what the changes in each release surmount to. Since `minor` and `patch` version increments means backwards compatibility will be upheld, ~~only the `major` version number will be a part of the URL of CSS and JavaScript files~~. This also means both CSS and JavaScript files are versioned in lockstep, so whenever a new ~~`major`~~ version of the CSS is released, a new ~~`major`~~ version of the JavaScript will be as well. ## Tests 1. Open a terminal and navigate to repo root -1. Run the command `npm test` +2. Run the command `npm test` * Many of the tests are snapshot based, and runs against already created snapshots. If you need to update the snapshots due to changes run the command `npm run test:update`. - * A test coverage report is generated after running the tests. This can be found in `./coverage`. + * A test coverage report is generated after running the tests. This can be found in `~/coverage`. > Note: Snapshot testing is pretty unforgiving, so if you make __ANY__ changes to how a component, which already has a snapshot, is rendered, the tests __WILL__ crash! So make sure to run `npm run test:update` before committing. ## Code style -Coding style rules set in `./.eslintrc` & `./.stylelintrc`. +Coding style rules set in `~/.eslintrc` & `~/.stylelintrc`. __*Make sure to follow the syntax rules enforced by eslint & stylelint.*__ @@ -77,23 +77,48 @@ __*Make sure to follow the syntax rules enforced by eslint & stylelint.*__ * Feature suggestions: File as Github issue or discuss the feature on Slack ([#design-guide-general](https://payex.slack.com/messages/C0L3W8B2S/)). * Code contribtions: Code contribtions are highly encouraged, but discuss the feature/bugfix in an issue or on Slack before you start coding. +## Creating a release + +Before merging to master to create a release make sure you follow these steps: + +1. Update the version in `~/package.json` +2. Update snapshots with the new version number by running the command `npm run test:update` in the project root. +3. Make sure the changelog is correct (date and version) and only contains changes for the current release. +4. Update the version in the url to the shield image at the top of this `README.md`. +5. Commit the changes and push to `develop`. +6. Change branch to `master`. +7. Merge `master` with `develop` without fastforward (`--no-ff`). +8. Create a tag with the new commit. +9. Push the tagged commit to `master`. + +AppVeyor will now create and deploy a release on both github and [design.payex.com](https://design.payex.com). + +After pushing to master, complete the following steps: + +1. Change back to `develop`. +2. Remove the content of changelog (leave the heading). +3. Commit the file and push it. + ## Maintainers * [Erik Hallaraaker](https://github.com/erikhallaraaker) * [Håkon Mosvoll](https://github.com/hmosvoll) +* [Aksel Wiig](https://github.com/Akswii) ## Contents of this project -* `./coverage/` - Test coverage report for the project (not commited to repo). -* `./dist/` - Static files generated by [webpack](https://webpack.js.org/). -* `./src/` - All the source files. -* `./static/` - Static files to be included in the `./dist/` folder during the build. +* `~/coverage` - Test coverage report for the project (not commited to repo). +* `~/dist` - Static files generated by [webpack](https://webpack.js.org/) (not commited to repo). +* `~/src` - All the source files. +* `~/build` - Config files for [AppVeyor](https://www.appveyor.com/) ## Notable files * `.babelrc` - [Babel](https://babeljs.io/) configuration. * `.eslintignore` - List of files/directories eslint will ignore (similar to .gitignore). * `.eslintrc` - [Eslint](https://eslint.org/) configuration. +* `.sentryclirc` - [Sentry](https://sentry.io) configuration used by webpack to configure a new release on sentry. + * _Do __not__ change the line `token = `, as this placeholder is used by AppVeyor to insert the sentry api key._ * `.stylelintrc` - [Stylelint](https://stylelint.io/) configuration. * `CHANGELOG.md` - Collection of changes made to the project. Insert your changes here. * `jest.config.js` - [jest](https://facebook.github.io/jest/) configuration. diff --git a/__mocks__/rome.js b/__mocks__/rome.js new file mode 100644 index 000000000..ddca8c657 --- /dev/null +++ b/__mocks__/rome.js @@ -0,0 +1,3 @@ +const rome = jest.genMockFromModule("rome"); + +export default rome; diff --git a/build/README.md b/build/README.md index 1f153a9c9..ecf821682 100644 --- a/build/README.md +++ b/build/README.md @@ -1 +1,71 @@ # AppVeyor build/deploy + +This document is meant to explain the steps to take when recovering from a disaster and also to explain the content of `appveyor.yml` and associated files. + +## Disaster Recovery + +The deploy procedure is set up to run with AppVeyor. To use the config in the projects `appveyor.yml` you need to log onto an existing AppVeyor account, ours is in the 1Password vault. The only project settings you need to worry about on the [AppVeyor site](https://www.appveyor.com/) is the general settings. + +* __GitHub repository__ needs to be specified (`PayEx/design.payex.com`). +* __Default branch__ needs to be set to `master`. +* __Webhook URL__ needs to be generated through github by adding the new AppVeyor account to the repository/organization. +* __Custom configuration `.yml` file name__ needs to be specified as `build/appveyor.yml`. + +This should be enough manual configuration to make sure a commit pushed to `master` with a tag will deploy the project. + +## AppVeyor Config Explained + +### General configuration + +Set to build all branches except `gh-pages`. + +Setting the following encrypted environment variables: + +* `access_token` - Github token used to authenticate when pushing to `gh-pages`. Used by the powershell script ran in the `before_deply`step. +* `github_email` - Email account to the payex bot user that pushes new releases to `gh-pages`. Used by the powershell script ran in the `before_deply`step. +* `sentry_token` - API key to sentry. Used by the powershell script ran in the `before_build` step. + +#### Install step + +Installing and running `gitversion` to properly version the build. Also sets a lot of useful environment variables. +Running `npm install` to install all the projects dependencies. + +### Build configuration + +In the `before_build` step powershell runs the script `prepare-release-build.ps1` which checks if the current build is from `master` with a tag or not. If it is, it will replace `` in the `.sentryclirc` file with our Sentry API key to make sure webpack will be able to create a new release on [Sentry](http://sentry.io). It will also set the environment variable `release` to `"true"` (this variable will be injected to the npm script ran in the next step). If not it will not modify `.sentryclirc` and set the environment variable `release` to `"false"`. + +The `build_script` step runs the npm script `npm run build:prod` with the injected environment variable `release` (created in the last step) to let webpack know wether it should create a release bundle or not. + +### Tests configuration + +Simply runs the npm scripts `lint` and `test`. + +### Deployment configuration + +#### `before_deploy` + +Runs the powershell script `deploy-github-pages.ps1`. + +This script checks if the current build is coming from a commit on `master` with a tag. If it does not this script does nothing. If it does then it: + +* Creates an AppVeyor artifact from the designguide build zip file generated by webpack in the build step. +* Creates the environment variable `changelog` (later used to publish a release on GitHub), and sets that to the content of `CHANGELOG.md`. +* Makes sure it configures the git user settings to the payex bot user using the environment variables `github_email`, `USERPROFILE` and `access_token`. +* Checks out branch `gh-pages`. +* Copies the content of the `dist` folder to `root`. +* Adds the modified and new files to a commit and pushes it to the branch `gh-pages`. + +#### `deploy` + +Creates a release on [GitHub](https://github.com/PayEx/design.payex.com/releases). + +* `auth_token` is an encrypted environment variable containing a github access token for the payex bot user. +* `release` is specified with the environment variable `GitVersion_SemVer` (i.e. `1.1.3`) generated by GitVersion in the `install` step. +* `tag` is specifed as the environment variable `APPVEYOR_REPO_TAG_NAME` generated by AppVeyor when pushing a commit with a tag. +* `description` is set to the environment variable `changelog` created by the `deploy-github-pages.ps1` in the previous step. +* `artifact` specifies what artifact to publish with the release. It is set to the zip file generated by webpack in the build step and uploaded in the previous step. +* `prerelease` is set to false for now, as we have yet to reach version 1. + +### Notifications + +Configures slack notifications when building the project. Specifies which channel to report to, what to report and an encrypted webhook to slack. diff --git a/build/appveyor.yml b/build/appveyor.yml index c11babf40..6ae111312 100644 --- a/build/appveyor.yml +++ b/build/appveyor.yml @@ -59,7 +59,6 @@ before_deploy: - ps: ./build/deploy-github-pages.ps1 deploy: - # Deploy to GitHub Releases - provider: GitHub auth_token: diff --git a/jest.setup.js b/jest.setup.js index 51cd56ef6..c912c20e7 100644 --- a/jest.setup.js +++ b/jest.setup.js @@ -15,7 +15,7 @@ global.mount = mount; * https://github.com/facebook/jest/issues/4545 */ -global.requestAnimationFrame = (callback) => { +global.requestAnimationFrame = callback => { setTimeout(callback, 0); }; @@ -24,16 +24,20 @@ global.requestAnimationFrame = (callback) => { * https://developer.mozilla.org/en-US/docs/Web/API/Element/closest */ -if (!Element.prototype.matches) - Element.prototype.matches = Element.prototype.msMatchesSelector || Element.prototype.webkitMatchesSelector; +if (!Element.prototype.matches) { Element.prototype.matches = Element.prototype.msMatchesSelector || Element.prototype.webkitMatchesSelector; } -if (!Element.prototype.closest) +if (!Element.prototype.closest) { Element.prototype.closest = function (s) { let el = this; - if (!document.documentElement.contains(el)) return null; + + if (!document.documentElement.contains(el)) { return null; } + do { - if (el.matches(s)) return el; + if (el.matches(s)) { return el; } + el = el.parentElement || el.parentNode; } while (el !== null && el.nodeType === 1); + return null; }; +} diff --git a/package-lock.json b/package-lock.json index 54407bb51..794c61c06 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "design.payex.com", - "version": "0.10.20", + "version": "0.12.0", "lockfileVersion": 1, "requires": true, "dependencies": { @@ -352,13 +352,13 @@ } }, "@babel/helper-function-name": { - "version": "7.0.0", - "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.0.0.tgz", - "integrity": "sha512-Zo+LGvfYp4rMtz84BLF3bavFTdf8y4rJtMPTe2J+rxYmnDOIeH8le++VFI/pRJU+rQhjqiXxE4LMaIau28Tv1Q==", + "version": "7.1.0", + "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.1.0.tgz", + "integrity": "sha512-A95XEoCpb3TO+KZzJ4S/5uW5fNe26DjBGqf1o9ucyLyCmi1dXq/B3c8iaWTfBk3VvetUxl16e8tIrd5teOCfGw==", "dev": true, "requires": { "@babel/helper-get-function-arity": "^7.0.0", - "@babel/template": "^7.0.0", + "@babel/template": "^7.1.0", "@babel/types": "^7.0.0" } }, @@ -809,9 +809,9 @@ } }, "@babel/parser": { - "version": "7.0.0", - "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.0.0.tgz", - "integrity": "sha512-RgJhNdRinpO8zibnoHbzTTexNs4c8ROkXFBanNDZTLHjwbdLk8J5cJSKulx/bycWTLYmKVNCkxRtVCoJnqPk+g==", + "version": "7.1.0", + "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.1.0.tgz", + "integrity": "sha512-SmjnXCuPAlai75AFtzv+KCBcJ3sDDWbIn+WytKw1k+wAtEy6phqI2RqKh/zAnw53i1NR8su3Ep/UoqaKcimuLg==", "dev": true }, "@babel/plugin-proposal-async-generator-functions": { @@ -1374,81 +1374,33 @@ } }, "@babel/template": { - "version": "7.0.0", - "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.0.0.tgz", - "integrity": "sha512-VLQZik/G5mjYJ6u19U3W2u7eM+rA/NGzH+GtHDFFkLTKLW66OasFrxZ/yK7hkyQcswrmvugFyZpDFRW0DjcjCw==", + "version": "7.1.0", + "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.1.0.tgz", + "integrity": "sha512-yZ948B/pJrwWGY6VxG6XRFsVTee3IQ7bihq9zFpM00Vydu6z5Xwg0C3J644kxI9WOTzd+62xcIsQ+AT1MGhqhA==", "dev": true, "requires": { "@babel/code-frame": "^7.0.0", - "@babel/parser": "^7.0.0", + "@babel/parser": "^7.1.0", "@babel/types": "^7.0.0" - }, - "dependencies": { - "@babel/code-frame": { - "version": "7.0.0", - "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.0.0.tgz", - "integrity": "sha512-OfC2uemaknXr87bdLUkWog7nYuliM9Ij5HUcajsVcMCpQrcLmtxRbVFTIqmcSkSeYRBFBRxs2FiUqFJDLdiebA==", - "dev": true, - "requires": { - "@babel/highlight": "^7.0.0" - } - }, - "@babel/highlight": { - "version": "7.0.0", - "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.0.0.tgz", - "integrity": "sha512-UFMC4ZeFC48Tpvj7C8UgLvtkaUuovQX+5xNWrsIoMG8o2z+XFKjKaN9iVmS84dPwVN00W4wPmqvYoZF3EGAsfw==", - "dev": true, - "requires": { - "chalk": "^2.0.0", - "esutils": "^2.0.2", - "js-tokens": "^4.0.0" - } - }, - "js-tokens": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", - "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==", - "dev": true - } } }, "@babel/traverse": { - "version": "7.0.0", - "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.0.0.tgz", - "integrity": "sha512-ka/lwaonJZTlJyn97C4g5FYjPOx+Oxd3ab05hbDr1Mx9aP1FclJ+SUHyLx3Tx40sGmOVJApDxE6puJhd3ld2kw==", + "version": "7.1.0", + "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.1.0.tgz", + "integrity": "sha512-bwgln0FsMoxm3pLOgrrnGaXk18sSM9JNf1/nHC/FksmNGFbYnPWY4GYCfLxyP1KRmfsxqkRpfoa6xr6VuuSxdw==", "dev": true, "requires": { "@babel/code-frame": "^7.0.0", "@babel/generator": "^7.0.0", - "@babel/helper-function-name": "^7.0.0", + "@babel/helper-function-name": "^7.1.0", "@babel/helper-split-export-declaration": "^7.0.0", - "@babel/parser": "^7.0.0", + "@babel/parser": "^7.1.0", "@babel/types": "^7.0.0", "debug": "^3.1.0", "globals": "^11.1.0", "lodash": "^4.17.10" }, "dependencies": { - "@babel/code-frame": { - "version": "7.0.0", - "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.0.0.tgz", - "integrity": "sha512-OfC2uemaknXr87bdLUkWog7nYuliM9Ij5HUcajsVcMCpQrcLmtxRbVFTIqmcSkSeYRBFBRxs2FiUqFJDLdiebA==", - "dev": true, - "requires": { - "@babel/highlight": "^7.0.0" - } - }, - "@babel/highlight": { - "version": "7.0.0", - "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.0.0.tgz", - "integrity": "sha512-UFMC4ZeFC48Tpvj7C8UgLvtkaUuovQX+5xNWrsIoMG8o2z+XFKjKaN9iVmS84dPwVN00W4wPmqvYoZF3EGAsfw==", - "dev": true, - "requires": { - "chalk": "^2.0.0", - "esutils": "^2.0.2", - "js-tokens": "^4.0.0" - } - }, "debug": { "version": "3.2.5", "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.5.tgz", @@ -1458,12 +1410,6 @@ "ms": "^2.1.1" } }, - "js-tokens": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", - "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==", - "dev": true - }, "ms": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.1.tgz", @@ -2574,7 +2520,7 @@ }, "chalk": { "version": "1.1.3", - "resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz", "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=", "dev": true, "requires": { @@ -2600,9 +2546,9 @@ "dev": true }, "babel-eslint": { - "version": "9.0.0", - "resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-9.0.0.tgz", - "integrity": "sha512-itv1MwE3TMbY0QtNfeL7wzak1mV47Uy+n6HtSOO4Xd7rvmO+tsGQSgyOEEgo6Y2vHZKZphaoelNeSVj4vkLA1g==", + "version": "10.0.0", + "resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-10.0.0.tgz", + "integrity": "sha512-GDQOtoj8CFtEe1HlbuEb6rwdbxRr4Y5DWyddivdsriEj6ulDda+fS43Zfe/Ku0tuMNnxC9JK1bmIovsLq5+hUA==", "dev": true, "requires": { "@babel/code-frame": "^7.0.0", @@ -2611,34 +2557,6 @@ "@babel/types": "^7.0.0", "eslint-scope": "3.7.1", "eslint-visitor-keys": "^1.0.0" - }, - "dependencies": { - "@babel/code-frame": { - "version": "7.0.0", - "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.0.0.tgz", - "integrity": "sha512-OfC2uemaknXr87bdLUkWog7nYuliM9Ij5HUcajsVcMCpQrcLmtxRbVFTIqmcSkSeYRBFBRxs2FiUqFJDLdiebA==", - "dev": true, - "requires": { - "@babel/highlight": "^7.0.0" - } - }, - "@babel/highlight": { - "version": "7.0.0", - "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.0.0.tgz", - "integrity": "sha512-UFMC4ZeFC48Tpvj7C8UgLvtkaUuovQX+5xNWrsIoMG8o2z+XFKjKaN9iVmS84dPwVN00W4wPmqvYoZF3EGAsfw==", - "dev": true, - "requires": { - "chalk": "^2.0.0", - "esutils": "^2.0.2", - "js-tokens": "^4.0.0" - } - }, - "js-tokens": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", - "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==", - "dev": true - } } }, "babel-generator": { @@ -2894,49 +2812,49 @@ }, "babel-plugin-syntax-async-functions": { "version": "6.13.0", - "resolved": "http://registry.npmjs.org/babel-plugin-syntax-async-functions/-/babel-plugin-syntax-async-functions-6.13.0.tgz", + "resolved": "https://registry.npmjs.org/babel-plugin-syntax-async-functions/-/babel-plugin-syntax-async-functions-6.13.0.tgz", "integrity": "sha1-ytnK0RkbWtY0vzCuCHI5HgZHvpU=", "dev": true }, "babel-plugin-syntax-async-generators": { "version": "6.13.0", - "resolved": "http://registry.npmjs.org/babel-plugin-syntax-async-generators/-/babel-plugin-syntax-async-generators-6.13.0.tgz", + "resolved": "https://registry.npmjs.org/babel-plugin-syntax-async-generators/-/babel-plugin-syntax-async-generators-6.13.0.tgz", "integrity": "sha1-a8lj67FuzLrmuStZbrfzXDQqi5o=", "dev": true }, "babel-plugin-syntax-class-properties": { "version": "6.13.0", - "resolved": "http://registry.npmjs.org/babel-plugin-syntax-class-properties/-/babel-plugin-syntax-class-properties-6.13.0.tgz", + "resolved": "https://registry.npmjs.org/babel-plugin-syntax-class-properties/-/babel-plugin-syntax-class-properties-6.13.0.tgz", "integrity": "sha1-1+sjt5oxf4VDlixQW4J8fWysJ94=", "dev": true }, "babel-plugin-syntax-decorators": { "version": "6.13.0", - "resolved": "http://registry.npmjs.org/babel-plugin-syntax-decorators/-/babel-plugin-syntax-decorators-6.13.0.tgz", + "resolved": "https://registry.npmjs.org/babel-plugin-syntax-decorators/-/babel-plugin-syntax-decorators-6.13.0.tgz", "integrity": "sha1-MSVjtNvePMgGzuPkFszurd0RrAs=", "dev": true }, "babel-plugin-syntax-dynamic-import": { "version": "6.18.0", - "resolved": "http://registry.npmjs.org/babel-plugin-syntax-dynamic-import/-/babel-plugin-syntax-dynamic-import-6.18.0.tgz", + "resolved": "https://registry.npmjs.org/babel-plugin-syntax-dynamic-import/-/babel-plugin-syntax-dynamic-import-6.18.0.tgz", "integrity": "sha1-jWomIpyDdFqZgqRBBRVyyqF5sdo=", "dev": true }, "babel-plugin-syntax-exponentiation-operator": { "version": "6.13.0", - "resolved": "http://registry.npmjs.org/babel-plugin-syntax-exponentiation-operator/-/babel-plugin-syntax-exponentiation-operator-6.13.0.tgz", + "resolved": "https://registry.npmjs.org/babel-plugin-syntax-exponentiation-operator/-/babel-plugin-syntax-exponentiation-operator-6.13.0.tgz", "integrity": "sha1-nufoM3KQ2pUoggGmpX9BcDF4MN4=", "dev": true }, "babel-plugin-syntax-flow": { "version": "6.18.0", - "resolved": "http://registry.npmjs.org/babel-plugin-syntax-flow/-/babel-plugin-syntax-flow-6.18.0.tgz", + "resolved": "https://registry.npmjs.org/babel-plugin-syntax-flow/-/babel-plugin-syntax-flow-6.18.0.tgz", "integrity": "sha1-TDqyCiryaqIM0lmVw5jE63AxDI0=", "dev": true }, "babel-plugin-syntax-object-rest-spread": { "version": "6.13.0", - "resolved": "http://registry.npmjs.org/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz", + "resolved": "https://registry.npmjs.org/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz", "integrity": "sha1-/WU28rzhODb/o6VFjEkDpZe7O/U=", "dev": true }, @@ -3888,7 +3806,7 @@ }, "browserify-rsa": { "version": "4.0.1", - "resolved": "http://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz", + "resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz", "integrity": "sha1-IeCr+vbyApzy+vsTNWenAdQTVSQ=", "dev": true, "requires": { @@ -3941,7 +3859,7 @@ }, "buffer": { "version": "4.9.1", - "resolved": "http://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz", + "resolved": "https://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz", "integrity": "sha1-bRu2AbB6TvztlwlBMgkwJ8lbwpg=", "dev": true, "requires": { @@ -5027,7 +4945,7 @@ }, "create-hash": { "version": "1.2.0", - "resolved": "http://registry.npmjs.org/create-hash/-/create-hash-1.2.0.tgz", + "resolved": "https://registry.npmjs.org/create-hash/-/create-hash-1.2.0.tgz", "integrity": "sha512-z00bCGNHDG8mHAkP7CtT1qVu+bFQUPjYq/4Iv3C3kWjTFV10zIjfSoeqXo9Asws8gwSHDGj/hl2u4OGIjapeCg==", "dev": true, "requires": { @@ -5040,7 +4958,7 @@ }, "create-hmac": { "version": "1.1.7", - "resolved": "http://registry.npmjs.org/create-hmac/-/create-hmac-1.1.7.tgz", + "resolved": "https://registry.npmjs.org/create-hmac/-/create-hmac-1.1.7.tgz", "integrity": "sha512-MJG9liiZ+ogc4TzUwuvbER1JRdgvUFSB5+VR/g5h82fGaIRWMWddtKBHi7/sVhfjQZ6SehlyhvQYrcYkaUIpLg==", "dev": true, "requires": { @@ -5779,7 +5697,7 @@ }, "diffie-hellman": { "version": "5.0.3", - "resolved": "http://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz", + "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz", "integrity": "sha512-kqag/Nl+f3GwyK25fhUMYj81BUOrZ9IuJsjIcDE5icNM9FJHAVm3VcUDxdLPoQtTuUylWm6ZIknYJwwaPxsUzg==", "dev": true, "requires": { @@ -7562,14 +7480,12 @@ "balanced-match": { "version": "1.0.0", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "brace-expansion": { "version": "1.1.11", "bundled": true, "dev": true, - "optional": true, "requires": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -7589,8 +7505,7 @@ "concat-map": { "version": "0.0.1", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "console-control-strings": { "version": "1.1.0", @@ -7738,7 +7653,6 @@ "version": "3.0.4", "bundled": true, "dev": true, - "optional": true, "requires": { "brace-expansion": "^1.1.7" } @@ -8268,7 +8182,7 @@ "dependencies": { "minimist": { "version": "1.1.3", - "resolved": "http://registry.npmjs.org/minimist/-/minimist-1.1.3.tgz", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.1.3.tgz", "integrity": "sha1-O+39kaktOQFvz6ocaB6Pqhoe/ag=", "dev": true } @@ -11501,7 +11415,7 @@ "dependencies": { "lodash": { "version": "2.4.2", - "resolved": "http://registry.npmjs.org/lodash/-/lodash-2.4.2.tgz", + "resolved": "https://registry.npmjs.org/lodash/-/lodash-2.4.2.tgz", "integrity": "sha1-+t2DS5aDBz2hebPq5tnA0VBT9z4=", "dev": true } @@ -11678,7 +11592,7 @@ }, "minimist": { "version": "0.0.8", - "resolved": "http://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz", "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=" }, "minimist-options": { @@ -11732,7 +11646,7 @@ }, "mkdirp": { "version": "0.5.1", - "resolved": "http://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz", + "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz", "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=", "requires": { "minimist": "0.0.8" @@ -12362,7 +12276,7 @@ }, "os-locale": { "version": "1.4.0", - "resolved": "http://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz", + "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz", "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk=", "dev": true, "requires": { @@ -12470,7 +12384,7 @@ }, "parse-asn1": { "version": "5.1.1", - "resolved": "http://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.1.tgz", + "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.1.tgz", "integrity": "sha512-KPx7flKXg775zZpnp9SxJlz00gTd4BmJ2yJufSc44gMCRrRQ7NSzAcSJQfifuOLgW6bEi+ftrALtsgALeB2Adw==", "dev": true, "requires": { @@ -13012,7 +12926,7 @@ }, "chalk": { "version": "1.1.3", - "resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz", "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=", "dev": true, "requires": { @@ -13742,7 +13656,7 @@ }, "public-encrypt": { "version": "4.0.2", - "resolved": "http://registry.npmjs.org/public-encrypt/-/public-encrypt-4.0.2.tgz", + "resolved": "https://registry.npmjs.org/public-encrypt/-/public-encrypt-4.0.2.tgz", "integrity": "sha512-4kJ5Esocg8X3h8YgJsKAuoesBgB7mqH3eowiDzMUPKiRDDE7E/BqqZD1hnTByIaAFiwAw246YEltSq7tdrOH0Q==", "dev": true, "requires": { @@ -14738,7 +14652,7 @@ "dependencies": { "minimist": { "version": "1.2.0", - "resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=", "dev": true } @@ -15852,6 +15766,36 @@ "stylelint-config-recommended": "^2.1.0" } }, + "stylelint-csstree-validator": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/stylelint-csstree-validator/-/stylelint-csstree-validator-1.3.0.tgz", + "integrity": "sha512-NZ47iv3+8B7P5JFtrjmvKRztLm/LuVlFDIqZuF1bV4YWzixnUC2jqmSPIEQlI1ssWXx2CtStsQjZNRsg5Y9rmg==", + "dev": true, + "requires": { + "css-tree": "1.0.0-alpha.29" + }, + "dependencies": { + "css-tree": { + "version": "1.0.0-alpha.29", + "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-1.0.0-alpha.29.tgz", + "integrity": "sha512-sRNb1XydwkW9IOci6iB2xmy8IGCj6r/fr+JWitvJ2JxQRPzN3T4AGGVWCMlVmVwM1gtgALJRmGIlWv5ppnGGkg==", + "dev": true, + "requires": { + "mdn-data": "~1.1.0", + "source-map": "^0.5.3" + } + } + } + }, + "stylelint-declaration-block-no-ignored-properties": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/stylelint-declaration-block-no-ignored-properties/-/stylelint-declaration-block-no-ignored-properties-1.1.0.tgz", + "integrity": "sha512-92/SZbSLiO0/lcWFXFSFiJwEaWZlBNfrbbBNw3PLHurjjfk/B8oNtujhcxt+OYZbcnYLW2w5zZdQdvgV4ZTWKg==", + "dev": true, + "requires": { + "postcss": "^6.0.11" + } + }, "subarg": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/subarg/-/subarg-1.0.0.tgz", @@ -16184,7 +16128,7 @@ }, "chalk": { "version": "1.1.3", - "resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz", "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=", "dev": true, "requires": { @@ -16316,7 +16260,7 @@ }, "minimist": { "version": "1.2.0", - "resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=", "dev": true }, @@ -16414,7 +16358,7 @@ "dependencies": { "babel-runtime": { "version": "5.8.38", - "resolved": "http://registry.npmjs.org/babel-runtime/-/babel-runtime-5.8.38.tgz", + "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-5.8.38.tgz", "integrity": "sha1-HAsC62MxL18If/IEUIJ7QlydTBk=", "dev": true, "requires": { @@ -16536,7 +16480,7 @@ }, "babel-runtime": { "version": "5.8.38", - "resolved": "http://registry.npmjs.org/babel-runtime/-/babel-runtime-5.8.38.tgz", + "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-5.8.38.tgz", "integrity": "sha1-HAsC62MxL18If/IEUIJ7QlydTBk=", "dev": true, "requires": { @@ -17607,7 +17551,7 @@ "dependencies": { "minimist": { "version": "1.2.0", - "resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=", "dev": true } @@ -18550,7 +18494,7 @@ }, "wrap-ansi": { "version": "2.1.0", - "resolved": "http://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz", + "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz", "integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU=", "dev": true, "requires": { diff --git a/package.json b/package.json index 1a3f55d75..19f2fdd05 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "design.payex.com", - "version": "0.11.1", + "version": "0.12.0", "description": "PayEx DesignGuide", "main": "index.js", "scripts": { @@ -46,7 +46,7 @@ "app-manifest-webpack-plugin": "^1.1.3", "autoprefixer": "^9.1.5", "babel-core": "^7.0.0-bridge.0", - "babel-eslint": "^9.0.0", + "babel-eslint": "^10.0.0", "babel-jest": "^23.6.0", "babel-loader": "^8.0.2", "babel-plugin-root-import": "^6.1.0", @@ -77,6 +77,8 @@ "stylelint": "^9.5.0", "stylelint-config-recommended": "^2.1.0", "stylelint-config-standard": "^18.2.0", + "stylelint-csstree-validator": "^1.3.0", + "stylelint-declaration-block-no-ignored-properties": "^1.1.0", "testcafe": "^0.22.0", "uglifyjs-webpack-plugin": "^2.0.1", "webpack": "^4.19.1", diff --git a/src/App/AppHeader/HeaderIcons.test.js b/src/App/AppHeader/HeaderIcons.test.js index 10851f99c..d18aa3be8 100644 --- a/src/App/AppHeader/HeaderIcons.test.js +++ b/src/App/AppHeader/HeaderIcons.test.js @@ -10,9 +10,7 @@ describe("AppHeader: HeaderIcons", () => { }); it("renders as expected", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -24,9 +22,7 @@ describe("AppHeader: HeaderIcons", () => { }); it("renders as expected", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/SelectPanel.js b/src/App/Documentation/SelectPanel.js index 4e294d1f3..95808f251 100644 --- a/src/App/Documentation/SelectPanel.js +++ b/src/App/Documentation/SelectPanel.js @@ -11,6 +11,7 @@ const SearchBox = () => ( const NavLink = ({ childRoute, pathname }) => { const { title, path } = childRoute; + return (
  • {title} @@ -35,6 +36,7 @@ class NavGroup extends Component { render () { const { title, routes } = this.props.route; const { pathname } = this.props.location; + return (
    @@ -55,6 +57,7 @@ const SelectPanel = () => ( @@ -63,5 +66,5 @@ const SelectPanel = () => ( export default withRouter(SelectPanel); -/* for testing */ +/* For testing */ export { SearchBox }; diff --git a/src/App/Documentation/SelectPanel.test.js b/src/App/Documentation/SelectPanel.test.js index ebffb253a..c5e4edb3f 100644 --- a/src/App/Documentation/SelectPanel.test.js +++ b/src/App/Documentation/SelectPanel.test.js @@ -14,7 +14,7 @@ describe("Documentation: SelectPanel", () => { // // ); - // expect(wrapper).toMatchSnapshot(); + // Expect(wrapper).toMatchSnapshot(); // }); describe("SearchBox", () => { @@ -23,9 +23,7 @@ describe("Documentation: SelectPanel", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/__snapshots__/index.test.js.snap b/src/App/Documentation/__snapshots__/index.test.js.snap index d0697c813..655f867fa 100644 --- a/src/App/Documentation/__snapshots__/index.test.js.snap +++ b/src/App/Documentation/__snapshots__/index.test.js.snap @@ -229,6 +229,7 @@ exports[`Documentation: index renders 1`] = ` Object { "component": Object { "ActiveState": [Function], + "ButtonGroup": [Function], "ButtonLoader": [Function], "ButtonsText": [Function], "DisabledState": [Function], @@ -336,16 +337,6 @@ exports[`Documentation: index renders 1`] = ` "path": "/docs/components/media-object", "title": "Media Object", }, - Object { - "component": Object { - "Demo": [Function], - "ModalText": [Function], - "Usage": [Function], - "default": [Function], - }, - "path": "/docs/components/modal", - "title": "Modal (deprecated)", - }, Object { "component": Object { "DefaultPagination": [Function], @@ -378,7 +369,7 @@ exports[`Documentation: index renders 1`] = ` "default": [Function], }, "path": "/docs/components/progress-tracker", - "title": "Progress Tracker", + "title": "Progress Tracker (deprecated)", }, Object { "component": Object { @@ -401,9 +392,18 @@ exports[`Documentation: index renders 1`] = ` }, Object { "component": Object { + "BasicStepBar": [Function], + "HorizontalStepBar": [Function], + "StepBarText": [Function], + "default": [Function], + }, + "path": "/docs/components/step-bar", + "title": "Step Bar (experimental)", + }, + Object { + "component": Object { + "BasicUsage": [Function], "Collapsed": [Function], - "Overview": [Function], - "Stacked": [Function], "TabsText": [Function], "default": [Function], }, @@ -481,6 +481,17 @@ exports[`Documentation: index renders 1`] = ` "path": "/docs/utilities/display", "title": "Display", }, + Object { + "component": Object { + "Examples": [Function], + "HowItWorks": [Function], + "Notation": [Function], + "SpacingText": [Function], + "default": [Function], + }, + "path": "/docs/utilities/spacing", + "title": "Spacing", + }, Object { "component": Object { "Intro": [Function], diff --git a/src/App/Documentation/components/ActionList/index.js b/src/App/Documentation/components/ActionList/index.js index fdcf2972b..fdb19921c 100644 --- a/src/App/Documentation/components/ActionList/index.js +++ b/src/App/Documentation/components/ActionList/index.js @@ -80,6 +80,7 @@ class ActionList extends Component { componentDidMount () { actionList.init(); } + render () { return (
    @@ -94,5 +95,5 @@ class ActionList extends Component { export default ActionList; -/* for testing */ +/* For testing */ export { Overview, Anchorpoints, ActionListText }; diff --git a/src/App/Documentation/components/ActionList/index.test.js b/src/App/Documentation/components/ActionList/index.test.js index 2de8e8e49..77fd085cc 100644 --- a/src/App/Documentation/components/ActionList/index.test.js +++ b/src/App/Documentation/components/ActionList/index.test.js @@ -9,9 +9,7 @@ describe("Components: ActionList", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Components: ActionList", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Components: ActionList", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/components/Alerts/index.js b/src/App/Documentation/components/Alerts/index.js index ea409e0c2..bb308cc01 100644 --- a/src/App/Documentation/components/Alerts/index.js +++ b/src/App/Documentation/components/Alerts/index.js @@ -103,5 +103,5 @@ class Alerts extends Component { export default Alerts; -/* for testing */ +/* For testing */ export { BasicUsage, AlertWithIcon, ClosingTheAlert, ExtendedUsage, AlertsText }; diff --git a/src/App/Documentation/components/Alerts/index.test.js b/src/App/Documentation/components/Alerts/index.test.js index 00de9734d..57ef17610 100644 --- a/src/App/Documentation/components/Alerts/index.test.js +++ b/src/App/Documentation/components/Alerts/index.test.js @@ -9,9 +9,7 @@ describe("Documentation: Alerts", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Documentation: Alerts", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Documentation: Alerts", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -50,9 +44,7 @@ describe("Documentation: Alerts", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -64,9 +56,7 @@ describe("Documentation: Alerts", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -78,9 +68,7 @@ describe("Documentation: Alerts", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/components/Badge/index.js b/src/App/Documentation/components/Badge/index.js index f8cf2c9cc..dfb9c056d 100644 --- a/src/App/Documentation/components/Badge/index.js +++ b/src/App/Documentation/components/Badge/index.js @@ -51,5 +51,5 @@ const Badge = () => ( export default Badge; -/* for testing */ +/* For testing */ export { Overview, FurtherUsage, BadgeText }; diff --git a/src/App/Documentation/components/Badge/index.test.js b/src/App/Documentation/components/Badge/index.test.js index 50a1fd314..bac26bd90 100644 --- a/src/App/Documentation/components/Badge/index.test.js +++ b/src/App/Documentation/components/Badge/index.test.js @@ -9,9 +9,7 @@ describe("Components: Badge", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Components: Badge", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Components: Badge", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -50,9 +44,7 @@ describe("Components: Badge", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/components/Breadcrumb/index.js b/src/App/Documentation/components/Breadcrumb/index.js index e8e3cbf5d..0bac18fbf 100644 --- a/src/App/Documentation/components/Breadcrumb/index.js +++ b/src/App/Documentation/components/Breadcrumb/index.js @@ -76,5 +76,5 @@ const Breadcrumb = () => ( export default Breadcrumb; -/* for testing */ +/* For testing */ export { BasicBreadCrumb, DisabledBreadcrumb, BreadcrumbText }; diff --git a/src/App/Documentation/components/Breadcrumb/index.test.js b/src/App/Documentation/components/Breadcrumb/index.test.js index 055a8a818..90c4b7ad4 100644 --- a/src/App/Documentation/components/Breadcrumb/index.test.js +++ b/src/App/Documentation/components/Breadcrumb/index.test.js @@ -9,9 +9,7 @@ describe("Documentation: Breadcrumb", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Documentation: Breadcrumb", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Documentation: Breadcrumb", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -50,9 +44,7 @@ describe("Documentation: Breadcrumb", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/components/Buttons/__snapshots__/index.test.js.snap b/src/App/Documentation/components/Buttons/__snapshots__/index.test.js.snap index 926018099..38ab43fcd 100644 --- a/src/App/Documentation/components/Buttons/__snapshots__/index.test.js.snap +++ b/src/App/Documentation/components/Buttons/__snapshots__/index.test.js.snap @@ -19,29 +19,36 @@ exports[`Documentation: Buttons Active State renders 1`] = ` -
    `; @@ -70,65 +77,79 @@ exports[`Documentation: Buttons Button Loader renders 1`] = ` -
    -

    Adding the attribute @@ -208,6 +229,7 @@ exports[`Documentation: Buttons Buttons Text renders 1`] = ` + @@ -233,29 +255,36 @@ exports[`Documentation: Buttons Disabled State renders 1`] = ` - + + +

    + Feedback +

    +

    + To give users validation feedback on each input insert the message in the attributes + + and + + in the + + element. +

    + +
    - + +
    +

    + Dynamically disabled submit button +

    +

    + You can also dynamically disable the submit button by adding + + to the + + <button type="submit"> + + element. +

    +

    + + NOTE: + + For this to work you also need the + + attribute to be present in the + + <form> + + tag. +

    + +
    + +
    diff --git a/src/App/Documentation/components/Forms/index.js b/src/App/Documentation/components/Forms/index.js index 03835af80..812d3a045 100644 --- a/src/App/Documentation/components/Forms/index.js +++ b/src/App/Documentation/components/Forms/index.js @@ -1,6 +1,7 @@ import React, { Component } from "react"; +import PrismCode from "react-prism"; -import { ComponentPreview, DocToc } from "#"; +import { ComponentPreview, DocToc, Attribute } from "#"; import { rangeslider, validation } from "$/px-script"; import InputGroup from "@/InputGroup"; import Button from "@/Button"; @@ -86,36 +87,67 @@ const FormGrid = () => ( const Validation = () => ( <> -

    Validation

    -

    Forms validation...

    +

    Validation overview

    +

    To use our validation, start by adding the attribute to your {"

    "} element. If you wish to validate your entire form, add the attribute to the {""} tag, if not add it to the desired {""} tags.

    +

    Validates against and . Using overrides default patterns.

    - e.preventDefault()}> + - {"\n"} - + + + +

    Feedback

    +

    To give users validation feedback on each input insert the message in the attributes and in the element.

    + +
    + {"\n"} + + +
    + +

    Dynamically disabled submit button

    +

    You can also dynamically disable the submit button by adding to the {" @@ -323,5 +355,5 @@ class Forms extends Component { export default Forms; -/* for testing */ +/* For testing */ export { Overview, FormGrid, Validation, UsageWithFieldsets, StaticText, Checkboxes, DisabledCheckboxes, RadioButtons, DisabledRadioButtons, Toggleboxes, DisabledToggleboxes, RangeSlider, DisabledRangeSlider, FormsText }; diff --git a/src/App/Documentation/components/Forms/index.test.js b/src/App/Documentation/components/Forms/index.test.js index 084115a81..b9e41e9c0 100644 --- a/src/App/Documentation/components/Forms/index.test.js +++ b/src/App/Documentation/components/Forms/index.test.js @@ -9,9 +9,7 @@ describe("Documentation: Forms", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Documentation: Forms", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Documentation: Forms", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -50,9 +44,7 @@ describe("Documentation: Forms", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -64,9 +56,7 @@ describe("Documentation: Forms", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -78,9 +68,7 @@ describe("Documentation: Forms", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -92,9 +80,7 @@ describe("Documentation: Forms", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -106,9 +92,7 @@ describe("Documentation: Forms", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -120,9 +104,7 @@ describe("Documentation: Forms", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -134,9 +116,7 @@ describe("Documentation: Forms", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -148,9 +128,7 @@ describe("Documentation: Forms", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -162,9 +140,7 @@ describe("Documentation: Forms", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -176,9 +152,7 @@ describe("Documentation: Forms", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -190,9 +164,7 @@ describe("Documentation: Forms", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -204,9 +176,7 @@ describe("Documentation: Forms", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/components/InputGroup/index.js b/src/App/Documentation/components/InputGroup/index.js index e0738dd57..01f038b7a 100644 --- a/src/App/Documentation/components/InputGroup/index.js +++ b/src/App/Documentation/components/InputGroup/index.js @@ -213,5 +213,5 @@ class InputGroup extends Component { export default InputGroup; -/* for testing */ +/* For testing */ export { BasicExample, CheckboxesAndRadios, ButtonAddons, WithSelect, WithFeedbackIcon, ValidationStates, Disabled, InputGroupText }; diff --git a/src/App/Documentation/components/InputGroup/index.test.js b/src/App/Documentation/components/InputGroup/index.test.js index 871617594..a78ebb844 100644 --- a/src/App/Documentation/components/InputGroup/index.test.js +++ b/src/App/Documentation/components/InputGroup/index.test.js @@ -9,9 +9,7 @@ describe("Documentation: InputGroup", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Documentation: InputGroup", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Documentation: InputGroup", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -50,9 +44,7 @@ describe("Documentation: InputGroup", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -64,9 +56,7 @@ describe("Documentation: InputGroup", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -78,9 +68,7 @@ describe("Documentation: InputGroup", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -92,9 +80,7 @@ describe("Documentation: InputGroup", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -106,9 +92,7 @@ describe("Documentation: InputGroup", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -120,9 +104,7 @@ describe("Documentation: InputGroup", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/components/Loaders/index.js b/src/App/Documentation/components/Loaders/index.js index 38575b012..f0c2381fc 100644 --- a/src/App/Documentation/components/Loaders/index.js +++ b/src/App/Documentation/components/Loaders/index.js @@ -147,5 +147,5 @@ class Loaders extends Component { export default Loaders; -/* for testing */ +/* For testing */ export { BasicUsage, Sizes, MutedLoader, StaticHtml, UsageWithJavascript, LoadersText }; diff --git a/src/App/Documentation/components/Loaders/index.test.js b/src/App/Documentation/components/Loaders/index.test.js index c8cf28e55..ca53787d2 100644 --- a/src/App/Documentation/components/Loaders/index.test.js +++ b/src/App/Documentation/components/Loaders/index.test.js @@ -9,9 +9,7 @@ describe("Documentation: Loaders", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Documentation: Loaders", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Documentation: Loaders", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -50,9 +44,7 @@ describe("Documentation: Loaders", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -64,9 +56,7 @@ describe("Documentation: Loaders", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -78,9 +68,7 @@ describe("Documentation: Loaders", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -93,9 +81,7 @@ describe("Documentation: Loaders", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/components/MediaObject/index.js b/src/App/Documentation/components/MediaObject/index.js index dd7ac9d0f..5fd1bb6b3 100644 --- a/src/App/Documentation/components/MediaObject/index.js +++ b/src/App/Documentation/components/MediaObject/index.js @@ -64,5 +64,5 @@ const MediaObject = () => ( export default MediaObject; -/* for testing */ +/* For testing */ export { Overview, MediaPosition, MediaObjectText }; diff --git a/src/App/Documentation/components/MediaObject/index.test.js b/src/App/Documentation/components/MediaObject/index.test.js index 5a1f63927..77dee599e 100644 --- a/src/App/Documentation/components/MediaObject/index.test.js +++ b/src/App/Documentation/components/MediaObject/index.test.js @@ -9,9 +9,7 @@ describe("Documentation: MediaObject", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Documentation: MediaObject", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Documentation: MediaObject", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -50,9 +44,7 @@ describe("Documentation: MediaObject", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/components/Modal/__snapshots__/index.test.js.snap b/src/App/Documentation/components/Modal/__snapshots__/index.test.js.snap deleted file mode 100644 index 67cb47c93..000000000 --- a/src/App/Documentation/components/Modal/__snapshots__/index.test.js.snap +++ /dev/null @@ -1,99 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`Documentation: Modal Demo renders 1`] = ` - -

    - Demo -

    -

    - Live modal -

    - - -

    - Modal body text goes here. -

    -     -     - -`; - -exports[`Documentation: Modal ModalText renders 1`] = ` -
    - -

    - Modals... -

    - - -
    -`; - -exports[`Documentation: Modal Usage renders 1`] = ` - -

    - Usage -

    -

    - Static modal -

    - - -

    - Modal body text goes here. -

    -     -     -     -`; - -exports[`Documentation: Modal renders 1`] = ` -
    -
    - - -
    -
    -`; diff --git a/src/App/Documentation/components/Modal/index.js b/src/App/Documentation/components/Modal/index.js deleted file mode 100644 index 359c91d13..000000000 --- a/src/App/Documentation/components/Modal/index.js +++ /dev/null @@ -1,80 +0,0 @@ -import React, { Component } from "react"; - -import { ComponentPreview, DocToc, DeprecatedComponentAlert } from "#"; -import { modal } from "$/px-script"; -import ModalComponent from "@/Modal"; - -const Usage = () => ( - <> -

    Usage

    -

    Static modal

    - - -

    Modal body text goes here.

    -     -     - -); - -const Demo = () => ( - <> -

    Demo

    -

    Live modal

    - - -

    Modal body text goes here.

    -     -     - -); - -const ModalText = () => ( -
    - -

    Modals...

    - - -
    -); - -class Modal extends Component { - componentDidMount () { - modal.init(); - } - - render () { - return ( -
    -
    - - -
    -
    - ); - } -} - -export default Modal; - -/* for testing */ -export { Usage, Demo, ModalText }; diff --git a/src/App/Documentation/components/Modal/index.test.js b/src/App/Documentation/components/Modal/index.test.js deleted file mode 100644 index e63133740..000000000 --- a/src/App/Documentation/components/Modal/index.test.js +++ /dev/null @@ -1,60 +0,0 @@ -import React from "react"; -import { shallow } from "enzyme"; - -import Modal, { Usage, Demo, ModalText } from "./index"; - -describe("Documentation: Modal", () => { - it("is defined", () => { - expect(Modal).toBeDefined(); - }); - - it("renders", () => { - const wrapper = shallow( - - ); - - expect(wrapper).toMatchSnapshot(); - }); - - describe("Usage", () => { - it("is defined", () => { - expect(Usage).toBeDefined(); - }); - - it("renders", () => { - const wrapper = shallow( - - ); - - expect(wrapper).toMatchSnapshot(); - }); - }); - - describe("Demo", () => { - it("is defined", () => { - expect(Demo).toBeDefined(); - }); - - it("renders", () => { - const wrapper = shallow( - - ); - - expect(wrapper).toMatchSnapshot(); - }); - }); - - describe("ModalText", () => { - it("is defined", () => { - expect(ModalText).toBeDefined(); - }); - - it("renders", () => { - const wrapper = shallow( - - ); - - expect(wrapper).toMatchSnapshot(); - }); - }); -}); diff --git a/src/App/Documentation/components/Pagination/index.js b/src/App/Documentation/components/Pagination/index.js index 8a436f767..aa2984464 100644 --- a/src/App/Documentation/components/Pagination/index.js +++ b/src/App/Documentation/components/Pagination/index.js @@ -53,9 +53,6 @@ const PaginationText = () => ( ); class Pagination extends Component { - componentDidMount () { - } - render () { return (
    @@ -70,5 +67,5 @@ class Pagination extends Component { export default Pagination; -/* for testing */ +/* For testing */ export { DefaultPagination, SimplePagination, PaginationBullets, PaginationText }; diff --git a/src/App/Documentation/components/Pagination/index.test.js b/src/App/Documentation/components/Pagination/index.test.js index d4d02cd22..01c2b2c83 100644 --- a/src/App/Documentation/components/Pagination/index.test.js +++ b/src/App/Documentation/components/Pagination/index.test.js @@ -9,9 +9,7 @@ describe("Documentation: Pagination", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Documentation: Pagination", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Documentation: Pagination", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -50,9 +44,7 @@ describe("Documentation: Pagination", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -64,9 +56,7 @@ describe("Documentation: Pagination", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/components/Panel/index.js b/src/App/Documentation/components/Panel/index.js index f29d4df14..0779caea8 100644 --- a/src/App/Documentation/components/Panel/index.js +++ b/src/App/Documentation/components/Panel/index.js @@ -87,9 +87,6 @@ const PanelText = () => ( ); class Panel extends Component { - componentDidMount () { - } - render () { return (
    @@ -104,5 +101,5 @@ class Panel extends Component { export default Panel; -/* for testing */ +/* For testing */ export { Overview, PanelHeaders, PanelDark, PanelMuted, PanelText }; diff --git a/src/App/Documentation/components/Panel/index.test.js b/src/App/Documentation/components/Panel/index.test.js index 304cd6072..ae6d31273 100644 --- a/src/App/Documentation/components/Panel/index.test.js +++ b/src/App/Documentation/components/Panel/index.test.js @@ -1,8 +1,7 @@ import React from "react"; import { shallow } from "enzyme"; -import Panel from "./index"; -import { Overview, PanelHeaders, PanelDark, PanelMuted, PanelText } from "./index"; +import Panel, { Overview, PanelHeaders, PanelDark, PanelMuted, PanelText } from "./index"; describe("Documentation: Panel", () => { it("is defined", () => { @@ -10,9 +9,7 @@ describe("Documentation: Panel", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -23,9 +20,7 @@ describe("Documentation: Panel", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -37,9 +32,7 @@ describe("Documentation: Panel", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -51,9 +44,7 @@ describe("Documentation: Panel", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -65,9 +56,7 @@ describe("Documentation: Panel", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -79,9 +68,7 @@ describe("Documentation: Panel", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/components/ProgressTracker/__snapshots__/index.test.js.snap b/src/App/Documentation/components/ProgressTracker/__snapshots__/index.test.js.snap index de0afe645..d79990b9f 100644 --- a/src/App/Documentation/components/ProgressTracker/__snapshots__/index.test.js.snap +++ b/src/App/Documentation/components/ProgressTracker/__snapshots__/index.test.js.snap @@ -139,6 +139,7 @@ exports[`Documentation: ProgressTracker ProgressTracker Text renders 1`] = `
    +

    diff --git a/src/App/Documentation/components/ProgressTracker/index.js b/src/App/Documentation/components/ProgressTracker/index.js index 04b327fb2..95950f844 100644 --- a/src/App/Documentation/components/ProgressTracker/index.js +++ b/src/App/Documentation/components/ProgressTracker/index.js @@ -1,7 +1,7 @@ import React from "react"; import PrismCode from "react-prism"; -import { ComponentPreview, DocToc } from "#"; +import { ComponentPreview, DocToc, DeprecatedComponentAlert } from "#"; import ProgressTrackerComponent from "@/ProgressTracker"; const BasicProgressTracker = () => { @@ -96,6 +96,7 @@ const DisabledProgressTracker = () => { const ProgressTrackerText = () => (

    +

    Progress trackers are a good way to display the users current progress in a given path, while also showing the user the remaining steps. This is usually used when the user are expected to complete several steps in a process.

    @@ -114,5 +115,5 @@ const ProgressTracker = () => ( export default ProgressTracker; -/* for testing */ +/* For testing */ export { BasicProgressTracker, SmallProgressTracker, DisabledProgressTracker, ProgressTrackerText }; diff --git a/src/App/Documentation/components/ProgressTracker/index.test.js b/src/App/Documentation/components/ProgressTracker/index.test.js index 3e0db2013..2ee5e7af5 100644 --- a/src/App/Documentation/components/ProgressTracker/index.test.js +++ b/src/App/Documentation/components/ProgressTracker/index.test.js @@ -9,9 +9,7 @@ describe("Documentation: ProgressTracker", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Documentation: ProgressTracker", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Documentation: ProgressTracker", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -50,9 +44,7 @@ describe("Documentation: ProgressTracker", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -64,9 +56,7 @@ describe("Documentation: ProgressTracker", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/components/Sheet/index.js b/src/App/Documentation/components/Sheet/index.js index 893933c8f..08328ee63 100644 --- a/src/App/Documentation/components/Sheet/index.js +++ b/src/App/Documentation/components/Sheet/index.js @@ -79,5 +79,5 @@ class Sheet extends Component { export default Sheet; -/* for testing */ +/* For testing */ export { Example, SheetText }; diff --git a/src/App/Documentation/components/Sheet/index.test.js b/src/App/Documentation/components/Sheet/index.test.js index cc89df800..2f1398b5a 100644 --- a/src/App/Documentation/components/Sheet/index.test.js +++ b/src/App/Documentation/components/Sheet/index.test.js @@ -9,9 +9,7 @@ describe("Documentation: Sheet", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Documentation: Sheet", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Documentation: Sheet", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/components/Status/index.js b/src/App/Documentation/components/Status/index.js index 66350005b..ace913977 100644 --- a/src/App/Documentation/components/Status/index.js +++ b/src/App/Documentation/components/Status/index.js @@ -51,9 +51,6 @@ const StatusText = () => ( ); class Status extends Component { - componentDidMount () { - } - render () { return (
    @@ -68,5 +65,5 @@ class Status extends Component { export default Status; -/* for testing */ +/* For testing */ export { Overview, ExtendedUsage, StatusText }; diff --git a/src/App/Documentation/components/Status/index.test.js b/src/App/Documentation/components/Status/index.test.js index 34bcd39d8..84c752c84 100644 --- a/src/App/Documentation/components/Status/index.test.js +++ b/src/App/Documentation/components/Status/index.test.js @@ -9,9 +9,7 @@ describe("Documentation: Status", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Documentation: Status", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Documentation: Status", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -50,9 +44,7 @@ describe("Documentation: Status", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/components/StepBar/__snapshots__/index.test.js.snap b/src/App/Documentation/components/StepBar/__snapshots__/index.test.js.snap new file mode 100644 index 000000000..eecba11ab --- /dev/null +++ b/src/App/Documentation/components/StepBar/__snapshots__/index.test.js.snap @@ -0,0 +1,84 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Documentation: StepBar Basic StepBar renders 1`] = ` + +

    + Basic usage +

    +

    + Add class + + .step-bar + + to an + + <ol> + + element. +

    + + + +     +`; + +exports[`Documentation: StepBar StepBar Text renders 1`] = ` +
    + +

    + Step Bar. +

    + + +
    +`; + +exports[`Documentation: StepBar renders 1`] = ` +
    +
    + + +
    +
    +`; diff --git a/src/App/Documentation/components/StepBar/index.js b/src/App/Documentation/components/StepBar/index.js new file mode 100644 index 000000000..b86deea50 --- /dev/null +++ b/src/App/Documentation/components/StepBar/index.js @@ -0,0 +1,88 @@ +import React from "react"; +import PrismCode from "react-prism"; + +import { ComponentPreview, DocToc, ExperimentalComponentAlert } from "#"; +import StepBarComponent from "@/StepBar"; + +const BasicStepBar = () => { + const items = [ + { + title: "Step one", + subtitle: "24.12.17 12:10", + completed: true + + }, + { + title: "Step two", + active: true + }, + { + title: "Step three" + }, + { + title: "Step four" + } + ]; + + return ( + <> +

    Basic usage

    +

    Add class .step-bar to an {"

      "} element.

      + + + + + ); +}; + +const HorizontalStepBar = () => { + const items = [ + { + title: "Step one", + completed: true + }, + { + title: "Step two", + active: true + }, + { + title: "Step three" + }, + { + title: "Step four" + } + ]; + + return ( + <> +

      Horizontal step bar

      +

      In addition to class .step-bar, add the extension class .step-bar--horizontal to an {"

        "} element.

        + + + + + ); +}; + +const StepBarText = () => ( +
        + +

        Step Bar.

        + + +
        +); + +const StepBar = () => ( +
        +
        + + +
        +
        +); + +export default StepBar; + +/* for testing */ +export { BasicStepBar, HorizontalStepBar, StepBarText }; diff --git a/src/App/Documentation/components/StepBar/index.test.js b/src/App/Documentation/components/StepBar/index.test.js new file mode 100644 index 000000000..7bbc51b00 --- /dev/null +++ b/src/App/Documentation/components/StepBar/index.test.js @@ -0,0 +1,45 @@ +import React from "react"; +import { shallow } from "enzyme"; +import StepBar, { BasicStepBar, StepBarText } from "./index"; + +describe("Documentation: StepBar", () => { + it("is defined", () => { + expect(StepBar).toBeDefined(); + }); + + it("renders", () => { + const wrapper = shallow( + + ); + + expect(wrapper).toMatchSnapshot(); + }); + + describe("Basic StepBar", () => { + it("is defined", () => { + expect(BasicStepBar).toBeDefined(); + }); + + it("renders", () => { + const wrapper = shallow( + + ); + + expect(wrapper).toMatchSnapshot(); + }); + }); + + describe("StepBar Text", () => { + it("is defined", () => { + expect(StepBarText).toBeDefined(); + }); + + it("renders", () => { + const wrapper = shallow( + + ); + + expect(wrapper).toMatchSnapshot(); + }); + }); +}); diff --git a/src/App/Documentation/components/Tabs/__snapshots__/index.test.js.snap b/src/App/Documentation/components/Tabs/__snapshots__/index.test.js.snap index 088ec2e11..3a5237261 100644 --- a/src/App/Documentation/components/Tabs/__snapshots__/index.test.js.snap +++ b/src/App/Documentation/components/Tabs/__snapshots__/index.test.js.snap @@ -1,65 +1,53 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`Components: Tabs Collapsed renders 1`] = ` +exports[`Components: Tabs BasicUsage renders 1`] = `

        - Collapsed + Basic usage

        - Collapsed... + Add class .tabs - ... + with a - .tabs-collapsed + .tabs-horizontal-desired_size -

        - - - -         -`; - -exports[`Components: Tabs Overview renders 1`] = ` - -

        - Overview -

        -

        - Overview... - - .tabs - - ... + <ul> + + and nest + + <li> + + as needed. The - .tabs-auto + .tabs-horizontal-desired_size + class determines when your tabs will switch from horizontal to collapsed. The available sizes can be found in our + + breakpoints documentation + + .

        `; -exports[`Components: Tabs Stacked renders 1`] = ` +exports[`Components: Tabs Collapsed renders 1`] = `

        - Stacked + Collapsed

        - Stacked... - - .tabs - - ... + If no - .tabs-stacked + .tabs-horizontal-desired_size + is provided then the tabs will always be in collapsed mode.

        @@ -130,8 +118,7 @@ exports[`Components: Tabs TabsText renders 1`] = ` > Tabs...

        - - +
    `; diff --git a/src/App/Documentation/components/Tabs/index.js b/src/App/Documentation/components/Tabs/index.js index db0b790fd..a4e683784 100644 --- a/src/App/Documentation/components/Tabs/index.js +++ b/src/App/Documentation/components/Tabs/index.js @@ -1,26 +1,19 @@ -import React from "react"; +import React, { Component } from "react"; +import { Link } from "react-router-dom"; +import PrismCode from "react-prism"; import { ComponentPreview, DocToc, ExperimentalComponentAlert } from "#"; +import { tabs } from "$/px-script"; import TabsComponent from "@/Tabs"; -const tabItems = ["Tab #1", "Tab #2", "Tab #3"]; +const tabItems = ["Kort", "Rabatter", "Transaksjoner", "Faktura", "Instillinger", "Audit trail"]; -const Overview = () => ( +const BasicUsage = () => ( <> -

    Overview

    -

    Overview... .tabs....tabs-auto

    +

    Basic usage

    +

    Add class .tabs with a .tabs-horizontal-desired_size to a div containing an arrow icon along with {"

      "} and nest {"
    • "} as needed. The .tabs-horizontal-desired_size class determines when your tabs will switch from horizontal to collapsed. The available sizes can be found in our breakpoints documentation.

      - - - -); - -const Stacked = () => ( - <> -

      Stacked

      -

      Stacked... .tabs....tabs-stacked

      - - + ); @@ -28,9 +21,9 @@ const Stacked = () => ( const Collapsed = () => ( <>

      Collapsed

      -

      Collapsed... .tabs....tabs-collapsed

      +

      If no .tabs-horizontal-desired_size is provided then the tabs will always be in collapsed mode.

      - + ); @@ -39,22 +32,29 @@ const TabsText = () => (

      Tabs...

      - - +
      ); -const Tabs = () => ( -
      -
      - - -
      -
      -); +class Tabs extends Component { + componentDidMount () { + tabs.init(); + } + + render () { + return ( +
      +
      + + +
      +
      + ); + } +} export default Tabs; -/* for testing */ -export { Overview, Stacked, Collapsed, TabsText }; +/* For testing */ +export { BasicUsage, Collapsed, TabsText }; diff --git a/src/App/Documentation/components/Tabs/index.test.js b/src/App/Documentation/components/Tabs/index.test.js index 49715ad4f..111a837c6 100644 --- a/src/App/Documentation/components/Tabs/index.test.js +++ b/src/App/Documentation/components/Tabs/index.test.js @@ -1,7 +1,7 @@ import React from "react"; import { shallow } from "enzyme"; -import Tabs, { Overview, Stacked, Collapsed, TabsText } from "./index"; +import Tabs, { BasicUsage, Collapsed, TabsText } from "./index"; describe("Components: Tabs", () => { it("is defined", () => { @@ -9,36 +9,18 @@ describe("Components: Tabs", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); - describe("Overview", () => { + describe("BasicUsage", () => { it("is defined", () => { - expect(Overview).toBeDefined(); + expect(BasicUsage).toBeDefined(); }); it("renders", () => { - const wrapper = shallow( - - ); - - expect(wrapper).toMatchSnapshot(); - }); - }); - - describe("Stacked", () => { - it("is defined", () => { - expect(Stacked).toBeDefined(); - }); - - it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -50,9 +32,7 @@ describe("Components: Tabs", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -64,9 +44,7 @@ describe("Components: Tabs", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/components/Toast/__snapshots__/index.test.js.snap b/src/App/Documentation/components/Toast/__snapshots__/index.test.js.snap index 47ea87f45..b09fb1de8 100644 --- a/src/App/Documentation/components/Toast/__snapshots__/index.test.js.snap +++ b/src/App/Documentation/components/Toast/__snapshots__/index.test.js.snap @@ -35,7 +35,11 @@ exports[`Components: Toast Options renders 1`] = ` String - " " + + "" + The HTML content of the Toast. @@ -49,10 +53,38 @@ exports[`Components: Toast Options renders 1`] = ` String - " " + + "" + - Premade alert types; success, neutral, warning and danger are available. + Premade alert types; + + success + + , + + neutral + + , + + warning + + and + + danger + + are available. @@ -63,7 +95,11 @@ exports[`Components: Toast Options renders 1`] = ` Boolean - true + + true + Wether or not the alert should be dismissable by the user (close button). @@ -77,7 +113,11 @@ exports[`Components: Toast Options renders 1`] = ` String - " " + + "" + Custom icon for the toast. See @@ -98,7 +138,11 @@ exports[`Components: Toast Options renders 1`] = ` Number - 4000 + + 4000 + Length in ms the Toast stays before dismissal. @@ -112,7 +156,11 @@ exports[`Components: Toast Options renders 1`] = ` Array of strings - [ ] + + [] + Classes to be added to the toast element. @@ -126,7 +174,11 @@ exports[`Components: Toast Options renders 1`] = ` Function - null + + null + Callback function called when toast is dismissed. diff --git a/src/App/Documentation/components/Toast/index.js b/src/App/Documentation/components/Toast/index.js index cb9defa52..6876ab3e8 100644 --- a/src/App/Documentation/components/Toast/index.js +++ b/src/App/Documentation/components/Toast/index.js @@ -36,61 +36,61 @@ const Options = () => ( html String - {"\" \""} + {"\"\""} The HTML content of the Toast. type String - {"\" \""} - Premade alert types; success, neutral, warning and danger are available. + {"\"\""} + Premade alert types; {"success"}, {"neutral"}, {"warning"} and {"danger"} are available. dismissable Boolean - true + true Wether or not the alert should be dismissable by the user (close button). icon String - {"\" \""} + {"\"\""} Custom icon for the toast. See icons for more info. displayLength Number - 4000 + 4000 Length in ms the Toast stays before dismissal. {/* inDuration Number - 300 + 300 Transition in duration in milliseconds. outDuration Number - 375 + 375 Transition out duration in milliseconds. */} classes Array of strings - [ ] + [] Classes to be added to the toast element. completeCallback Function - null + null Callback function called when toast is dismissed. {/* activationPercent Number - 0.8 + 0.8 The percentage of the toast{"'"}s width it takes for a drag to dismiss a Toast. */} @@ -197,5 +197,5 @@ class Toast extends Component { export default Toast; -/* for testing */ +/* For testing */ export { Overview, Options, PremadeToasts, ToastText }; diff --git a/src/App/Documentation/components/Toast/index.test.js b/src/App/Documentation/components/Toast/index.test.js index b4f8ffb7d..14f26de83 100644 --- a/src/App/Documentation/components/Toast/index.test.js +++ b/src/App/Documentation/components/Toast/index.test.js @@ -9,9 +9,7 @@ describe("Components: Toast", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Components: Toast", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Components: Toast", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -50,9 +44,7 @@ describe("Components: Toast", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -64,9 +56,7 @@ describe("Components: Toast", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/components/Tooltips/__snapshots__/index.test.js.snap b/src/App/Documentation/components/Tooltips/__snapshots__/index.test.js.snap index a16589b95..8e02314aa 100644 --- a/src/App/Documentation/components/Tooltips/__snapshots__/index.test.js.snap +++ b/src/App/Documentation/components/Tooltips/__snapshots__/index.test.js.snap @@ -42,46 +42,55 @@ exports[`Components: Tooltip Overview renders 1`] = ` - - + - - + + - - + + - + + + + + + +
    `; diff --git a/src/App/Documentation/components/Tooltips/index.js b/src/App/Documentation/components/Tooltips/index.js index 688c39e94..fb023b9be 100644 --- a/src/App/Documentation/components/Tooltips/index.js +++ b/src/App/Documentation/components/Tooltips/index.js @@ -7,35 +7,37 @@ const Overview = () => (

    Overview

    Add the attribute to the desired element and add your content in its value to create a tooltip.

    You can use the attribute to position the tooltip relative to the containing element, use the values , , or . If the attribute is not provided, it will default to top.

    - - {"\n"} - {"\n"} - {"\n"} - + +
    {"\n"} + {"\n"} + {"\n"} + {"\n"} + {"\n"} +
    ); @@ -62,5 +64,5 @@ class Tooltip extends Component { export default Tooltip; -/* for testing */ +/* For testing */ export { Overview, TooltipText }; diff --git a/src/App/Documentation/components/Tooltips/index.test.js b/src/App/Documentation/components/Tooltips/index.test.js index 72cd3c833..97a383850 100644 --- a/src/App/Documentation/components/Tooltips/index.test.js +++ b/src/App/Documentation/components/Tooltips/index.test.js @@ -9,9 +9,7 @@ describe("Components: Tooltip", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Components: Tooltip", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Components: Tooltip", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/components/Topbar/index.js b/src/App/Documentation/components/Topbar/index.js index 07c9c89f7..8f59503d0 100644 --- a/src/App/Documentation/components/Topbar/index.js +++ b/src/App/Documentation/components/Topbar/index.js @@ -104,8 +104,15 @@ const smallMenu = { ] }; -const leftMenu = Object.assign({ id: "topbar-nav-left" }, menu); -const rightMenu = Object.assign({ id: "topbar-nav-right" }, smallMenu); +const leftMenu = { + id: "topbar-nav-left", + ...menu +}; + +const rightMenu = { + id: "topbar-nav-right", + ...smallMenu +}; const Overview = () => ( <> @@ -128,6 +135,7 @@ class Topbar extends Component { componentDidMount () { topbar.init(1); } + render () { return (
    @@ -142,5 +150,5 @@ class Topbar extends Component { export default Topbar; -/* for testing */ +/* For testing */ export { Overview, TopbarText }; diff --git a/src/App/Documentation/components/Topbar/index.test.js b/src/App/Documentation/components/Topbar/index.test.js index 3fcce7d4f..5db514c7a 100644 --- a/src/App/Documentation/components/Topbar/index.test.js +++ b/src/App/Documentation/components/Topbar/index.test.js @@ -9,9 +9,7 @@ describe("Components: Topbar", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Components: Topbar", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Components: Topbar", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/components/Well/index.js b/src/App/Documentation/components/Well/index.js index 1d9aeef6d..e20f539f3 100644 --- a/src/App/Documentation/components/Well/index.js +++ b/src/App/Documentation/components/Well/index.js @@ -51,5 +51,5 @@ const Well = () => ( export default Well; -/* for testing */ +/* For testing */ export { DefaultWell, WellSizes, WellText }; diff --git a/src/App/Documentation/components/Well/index.test.js b/src/App/Documentation/components/Well/index.test.js index 7c860efb9..6300a874e 100644 --- a/src/App/Documentation/components/Well/index.test.js +++ b/src/App/Documentation/components/Well/index.test.js @@ -9,9 +9,7 @@ describe("Components: Well", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Components: Well", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Components: Well", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -50,9 +44,7 @@ describe("Components: Well", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/core/Breakpoints/index.js b/src/App/Documentation/core/Breakpoints/index.js index 96be0f983..fd5dfc383 100644 --- a/src/App/Documentation/core/Breakpoints/index.js +++ b/src/App/Documentation/core/Breakpoints/index.js @@ -119,5 +119,5 @@ const Breakpoints = () => ( export default Breakpoints; -/* for testing */ +/* For testing */ export { Overview, BreakpointsText }; diff --git a/src/App/Documentation/core/Breakpoints/index.test.js b/src/App/Documentation/core/Breakpoints/index.test.js index 63c8efcb8..3137bfecb 100644 --- a/src/App/Documentation/core/Breakpoints/index.test.js +++ b/src/App/Documentation/core/Breakpoints/index.test.js @@ -9,9 +9,7 @@ describe("Core: Breakpoints", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Core: Breakpoints", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Core: Breakpoints", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/core/Color/ColorPreview.js b/src/App/Documentation/core/Color/ColorPreview.js index 5f9e54c13..2be553a22 100644 --- a/src/App/Documentation/core/Color/ColorPreview.js +++ b/src/App/Documentation/core/Color/ColorPreview.js @@ -1,14 +1,12 @@ import React from "react"; import PropTypes from "prop-types"; -const ColorPreview = ({ name, hex }) => { - return ( -
    -

    {name}

    -

    {hex}

    -
    - ); -}; +const ColorPreview = ({ name, hex }) => ( +
    +

    {name}

    +

    {hex}

    +
    +); ColorPreview.propTypes = { name: PropTypes.string.isRequired, diff --git a/src/App/Documentation/core/Color/ColorPreview.test.js b/src/App/Documentation/core/Color/ColorPreview.test.js index 732e57731..828deb2e4 100644 --- a/src/App/Documentation/core/Color/ColorPreview.test.js +++ b/src/App/Documentation/core/Color/ColorPreview.test.js @@ -9,9 +9,7 @@ describe("Core: Color", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); expect(wrapper.contains(

    test

    )).toBeTruthy(); diff --git a/src/App/Documentation/core/Color/index.js b/src/App/Documentation/core/Color/index.js index 98038da1a..a6f615e3f 100644 --- a/src/App/Documentation/core/Color/index.js +++ b/src/App/Documentation/core/Color/index.js @@ -39,18 +39,16 @@ const ColorText = () => (
    ); -const Color = () => { - return ( -
    -
    - - -
    +const Color = () => ( +
    +
    + +
    - ); -}; +
    +); export default Color; -/* for testing */ +/* For testing */ export { ColorPalette, ColorText }; diff --git a/src/App/Documentation/core/Color/index.test.js b/src/App/Documentation/core/Color/index.test.js index 6c2f2c6f1..22336e4e6 100644 --- a/src/App/Documentation/core/Color/index.test.js +++ b/src/App/Documentation/core/Color/index.test.js @@ -9,25 +9,19 @@ describe("Core: Color", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); it("ColorPalette renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); it("ColorText renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/core/Favicons/index.js b/src/App/Documentation/core/Favicons/index.js index 17b054de2..fb0c6fb8c 100644 --- a/src/App/Documentation/core/Favicons/index.js +++ b/src/App/Documentation/core/Favicons/index.js @@ -66,18 +66,16 @@ const FaviconsText = () => (
    ); -const Favicons = () => { - return ( -
    -
    - - -
    +const Favicons = () => ( +
    +
    + +
    - ); -}; +
    +); export default Favicons; -/* for testing */ +/* For testing */ export { OurFavicon, Usage, FaviconsText }; diff --git a/src/App/Documentation/core/Favicons/index.test.js b/src/App/Documentation/core/Favicons/index.test.js index c31a08d9f..11abadc70 100644 --- a/src/App/Documentation/core/Favicons/index.test.js +++ b/src/App/Documentation/core/Favicons/index.test.js @@ -9,33 +9,25 @@ describe("Core: Favicons", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); it("OurFavicon renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); it("Usage renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); it("FaviconsText renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/core/Grid/index.js b/src/App/Documentation/core/Grid/index.js index abdb4afb6..2f6335c37 100644 --- a/src/App/Documentation/core/Grid/index.js +++ b/src/App/Documentation/core/Grid/index.js @@ -255,18 +255,16 @@ const GridText = () => (
    ); -const Grid = () => { - return ( -
    -
    - - -
    +const Grid = () => ( +
    +
    + +
    - ); -}; +
    +); export default Grid; -/* for testing */ +/* For testing */ export { HowItWorks, GridOptions, AutoLayoutColumns, Alignment, GridText }; diff --git a/src/App/Documentation/core/Grid/index.test.js b/src/App/Documentation/core/Grid/index.test.js index 1cb5d70b3..a23957195 100644 --- a/src/App/Documentation/core/Grid/index.test.js +++ b/src/App/Documentation/core/Grid/index.test.js @@ -9,9 +9,7 @@ describe("Core: Grid", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Core: Grid", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Core: Grid", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -50,9 +44,7 @@ describe("Core: Grid", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -64,9 +56,7 @@ describe("Core: Grid", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/core/Icons/index.js b/src/App/Documentation/core/Icons/index.js index e447f677f..6bd708ba4 100644 --- a/src/App/Documentation/core/Icons/index.js +++ b/src/App/Documentation/core/Icons/index.js @@ -33,18 +33,16 @@ const IconsText = () => (
    ); -const Icons = () => { - return ( -
    -
    - - -
    +const Icons = () => ( +
    +
    + +
    - ); -}; +
    +); export default Icons; -/* for testing */ +/* For testing */ export { Usage, IconsText }; diff --git a/src/App/Documentation/core/Icons/index.test.js b/src/App/Documentation/core/Icons/index.test.js index 8dbd556f6..eb281e2a2 100644 --- a/src/App/Documentation/core/Icons/index.test.js +++ b/src/App/Documentation/core/Icons/index.test.js @@ -9,9 +9,7 @@ describe("Core: Icons", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Core: Icons", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Core: Icons", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/core/Lists/index.js b/src/App/Documentation/core/Lists/index.js index ad3040b3e..7219b1b66 100644 --- a/src/App/Documentation/core/Lists/index.js +++ b/src/App/Documentation/core/Lists/index.js @@ -3,7 +3,6 @@ import React, { Component } from "react"; import { ComponentPreview, DocToc, Icon } from "#"; import actionList from "$/px-script/action-list"; - const BasicList = () => ( <>

    Basic list

    @@ -33,7 +32,6 @@ const BasicList = () => ( ); - const InlineList = () => ( <>

    Inline list

    @@ -186,7 +184,8 @@ class Lists extends Component { componentDidMount () { actionList.init(); } - render (){ + + render () { return (
    @@ -197,7 +196,8 @@ class Lists extends Component { ); } } + export default Lists; -/* for testing */ +/* For testing */ export { BasicList, InlineList, DescriptionList, SettingsList, ItemList, StatusItemList, StripedItemList, ListsText }; diff --git a/src/App/Documentation/core/Lists/index.test.js b/src/App/Documentation/core/Lists/index.test.js index 0f35d6c15..22411de89 100644 --- a/src/App/Documentation/core/Lists/index.test.js +++ b/src/App/Documentation/core/Lists/index.test.js @@ -9,9 +9,7 @@ describe("Documentation: Lists", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Documentation: Lists", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Documentation: Lists", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -50,9 +44,7 @@ describe("Documentation: Lists", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -64,9 +56,7 @@ describe("Documentation: Lists", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -78,9 +68,7 @@ describe("Documentation: Lists", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/core/Tables/index.js b/src/App/Documentation/core/Tables/index.js index df9847b3c..2bfe0d364 100644 --- a/src/App/Documentation/core/Tables/index.js +++ b/src/App/Documentation/core/Tables/index.js @@ -248,18 +248,16 @@ const TablesText = () => (
    ); -const Tables = () => { - return ( -
    -
    - - -
    +const Tables = () => ( +
    +
    + +
    - ); -}; +
    +); export default Tables; -/* for testing */ +/* For testing */ export { BasicTable, StripedTable, HoverTable, HoverStripedTable, DescriptionTable, TablesText }; diff --git a/src/App/Documentation/core/Tables/index.test.js b/src/App/Documentation/core/Tables/index.test.js index 720d6146b..ffa787722 100644 --- a/src/App/Documentation/core/Tables/index.test.js +++ b/src/App/Documentation/core/Tables/index.test.js @@ -9,9 +9,7 @@ describe("Documentation: Table", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(
    ); expect(wrapper).toMatchSnapshot(); }); @@ -22,9 +20,7 @@ describe("Documentation: Table", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -36,9 +32,7 @@ describe("Documentation: Table", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -50,9 +44,7 @@ describe("Documentation: Table", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -64,9 +56,7 @@ describe("Documentation: Table", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -78,9 +68,7 @@ describe("Documentation: Table", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -92,9 +80,7 @@ describe("Documentation: Table", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/core/Typography/index.js b/src/App/Documentation/core/Typography/index.js index 2e9b2ffd1..a2e1ecef6 100644 --- a/src/App/Documentation/core/Typography/index.js +++ b/src/App/Documentation/core/Typography/index.js @@ -66,7 +66,6 @@ const Lead = () => ( ); - const Inline = () => ( <>

    Inline text elements

    @@ -155,7 +154,6 @@ const Blockquotes = () => { ); - return ( <> @@ -190,5 +188,5 @@ const Typography = () => ( export default Typography; -/* for testing */ +/* For testing */ export { Fonts, Headings, Small, Lead, Inline, TextUtilities, Abbreviations, Blockquotes, TypographyText }; diff --git a/src/App/Documentation/core/Typography/index.test.js b/src/App/Documentation/core/Typography/index.test.js index 9d3180466..f0f239ecb 100644 --- a/src/App/Documentation/core/Typography/index.test.js +++ b/src/App/Documentation/core/Typography/index.test.js @@ -10,9 +10,7 @@ describe("Core: Typography", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -23,9 +21,7 @@ describe("Core: Typography", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -37,9 +33,7 @@ describe("Core: Typography", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -51,9 +45,7 @@ describe("Core: Typography", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -65,9 +57,7 @@ describe("Core: Typography", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -79,9 +69,7 @@ describe("Core: Typography", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -93,9 +81,7 @@ describe("Core: Typography", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -107,9 +93,7 @@ describe("Core: Typography", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -121,15 +105,11 @@ describe("Core: Typography", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); if (Blockquotes().props.children) { Blockquotes().props.children.map(Child => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -145,9 +125,7 @@ describe("Core: Typography", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/getting-started/BrowserSupport/BrowserIcons.test.js b/src/App/Documentation/getting-started/BrowserSupport/BrowserIcons.test.js index 278f9f7f5..70bb0ea10 100644 --- a/src/App/Documentation/getting-started/BrowserSupport/BrowserIcons.test.js +++ b/src/App/Documentation/getting-started/BrowserSupport/BrowserIcons.test.js @@ -10,9 +10,7 @@ describe("BrowserSupport: BrowserIcons", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -24,9 +22,7 @@ describe("BrowserSupport: BrowserIcons", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -38,9 +34,7 @@ describe("BrowserSupport: BrowserIcons", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -52,9 +46,7 @@ describe("BrowserSupport: BrowserIcons", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -66,9 +58,7 @@ describe("BrowserSupport: BrowserIcons", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -80,9 +70,7 @@ describe("BrowserSupport: BrowserIcons", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/getting-started/BrowserSupport/index.test.js b/src/App/Documentation/getting-started/BrowserSupport/index.test.js index 3ef6cb0b4..44e591653 100644 --- a/src/App/Documentation/getting-started/BrowserSupport/index.test.js +++ b/src/App/Documentation/getting-started/BrowserSupport/index.test.js @@ -9,9 +9,7 @@ describe("GettingStarted: BrowserSupport", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/getting-started/Contributing/index.js b/src/App/Documentation/getting-started/Contributing/index.js index 631637532..ef634c288 100644 --- a/src/App/Documentation/getting-started/Contributing/index.js +++ b/src/App/Documentation/getting-started/Contributing/index.js @@ -128,7 +128,6 @@ const AddingStyles = () => { ); - return (

    Adding styles

    @@ -220,7 +219,8 @@ const AddingJavaScript = () => {
    - );}; + ); +}; const ContributingText = () => (
    @@ -244,5 +244,5 @@ const Contributing = () => ( export default Contributing; -/* for testing */ +/* For testing */ export { CreatingYourComponent, CreateADocumentationPage, AddComponentToRoutes, AddingStyles, AddingJavaScript, ContributingText }; diff --git a/src/App/Documentation/getting-started/Contributing/index.test.js b/src/App/Documentation/getting-started/Contributing/index.test.js index d188db6ff..96169ed37 100644 --- a/src/App/Documentation/getting-started/Contributing/index.test.js +++ b/src/App/Documentation/getting-started/Contributing/index.test.js @@ -10,9 +10,7 @@ describe("GettingStarted: Contributing", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -23,9 +21,7 @@ describe("GettingStarted: Contributing", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -37,9 +33,7 @@ describe("GettingStarted: Contributing", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -51,9 +45,7 @@ describe("GettingStarted: Contributing", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -65,15 +57,11 @@ describe("GettingStarted: Contributing", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); if (AddingStyles().props.children) { AddingStyles().props.children.map(Child => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -89,15 +77,11 @@ describe("GettingStarted: Contributing", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); if (AddingJavaScript().props.children) { AddingJavaScript().props.children.map(Child => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); @@ -113,9 +97,7 @@ describe("GettingStarted: Contributing", () => { }); it("renders", () => { - const wrapper = shallow( - - ); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/App/Documentation/getting-started/Introduction/__snapshots__/index.test.js.snap b/src/App/Documentation/getting-started/Introduction/__snapshots__/index.test.js.snap index 61b3d8759..d2e6b41d4 100644 --- a/src/App/Documentation/getting-started/Introduction/__snapshots__/index.test.js.snap +++ b/src/App/Documentation/getting-started/Introduction/__snapshots__/index.test.js.snap @@ -29,7 +29,7 @@ exports[`GettingStarted: Introduction Css renders 1`] = ` language="html" > @@ -80,7 +80,7 @@ exports[`GettingStarted: Introduction JavaScript renders 1`] = ` language="html" >