diff --git a/README.md b/README.md index e06c7ec03..47a435ae6 100644 --- a/README.md +++ b/README.md @@ -17,7 +17,7 @@ A set of independent components. Awesome library based on HTML and CSS using BEM convention with the JavaScript ReactJS implementation. Each components are autonomous and extensible. Pick and use only what you need! -**How *React-toolkit* does CSS isolation?** +**How _React-toolkit_ does CSS isolation?** Only by using [BEM (Block Element Modifier)](http://getbem.com) CSS convention. No need of the intricate technologies, just pragatism. @@ -25,7 +25,6 @@ Components are simple to use (just drag and drog it), simple to customize (by us You can easily build a new app from scratch or integrate some component into existing application. - [html+css documentation website](https://axaguildev.github.io?target=react_toolkit_storybook) [react storybook website](https://axaguildev.github.io?target=react_toolkit_design) @@ -110,7 +109,6 @@ Each component should be autonomous (HTML + CSS + JS) and extensible. - [HTML/CSS Documentation](https://axaguildev.github.io?target=react_toolkit_storybook) - React : - - Components are stateless by default - Some Higher Order Components (HOC) are stateful but feel free to use the stateless one if it fits your use case - [React documentation](https://axaguildev.github.io?target=react_toolkit_design) diff --git a/examples/demo/package-lock.json b/examples/demo/package-lock.json index 9d640c455..85d7c4ea4 100644 --- a/examples/demo/package-lock.json +++ b/examples/demo/package-lock.json @@ -7148,8 +7148,7 @@ }, "balanced-match": { "version": "1.0.0", - "bundled": true, - "optional": true + "bundled": true }, "brace-expansion": { "version": "1.1.11", @@ -7170,8 +7169,7 @@ }, "concat-map": { "version": "0.0.1", - "bundled": true, - "optional": true + "bundled": true }, "console-control-strings": { "version": "1.1.0", diff --git a/package-lock.json b/package-lock.json index 7fcfa6105..08ad99a40 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4779,7 +4779,7 @@ }, "util": { "version": "0.10.3", - "resolved": "https://registry.npmjs.org/util/-/util-0.10.3.tgz", + "resolved": "http://registry.npmjs.org/util/-/util-0.10.3.tgz", "integrity": "sha1-evsa/lCAUkZInj23/g7TeTNqwPk=", "dev": true, "requires": { @@ -5046,13 +5046,15 @@ "version": "1.0.0", "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz", "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA=", - "dev": true + "dev": true, + "optional": true }, "is-glob": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz", "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM=", "dev": true, + "optional": true, "requires": { "is-extglob": "^1.0.0" } @@ -8858,7 +8860,7 @@ }, "minimist": { "version": "1.2.0", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", + "resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=", "dev": true }, @@ -9012,7 +9014,7 @@ }, "minimist": { "version": "1.2.0", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", + "resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=", "dev": true }, @@ -9157,7 +9159,7 @@ }, "minimist": { "version": "1.2.0", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", + "resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=", "dev": true }, @@ -9916,7 +9918,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -12649,7 +12651,7 @@ "dependencies": { "fs-extra": { "version": "0.30.0", - "resolved": "http://registry.npmjs.org/fs-extra/-/fs-extra-0.30.0.tgz", + "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.30.0.tgz", "integrity": "sha1-8jP/zAjU2n1DLapEl3aYnbHfk/A=", "dev": true, "requires": { @@ -13327,7 +13329,8 @@ "ansi-regex": { "version": "2.1.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "aproba": { "version": "1.2.0", @@ -13729,7 +13732,8 @@ "safe-buffer": { "version": "5.1.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "safer-buffer": { "version": "2.1.2", @@ -13784,6 +13788,7 @@ "version": "3.0.1", "bundled": true, "dev": true, + "optional": true, "requires": { "ansi-regex": "^2.0.0" } @@ -13827,12 +13832,14 @@ "wrappy": { "version": "1.0.2", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "yallist": { "version": "3.0.2", "bundled": true, - "dev": true + "dev": true, + "optional": true } } }, @@ -14311,7 +14318,7 @@ }, "minimist": { "version": "1.2.0", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", + "resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=", "dev": true }, @@ -14385,7 +14392,7 @@ "dependencies": { "pify": { "version": "2.3.0", - "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz", + "resolved": "http://registry.npmjs.org/pify/-/pify-2.3.0.tgz", "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=", "dev": true } @@ -14468,7 +14475,7 @@ }, "minimist": { "version": "1.2.0", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", + "resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=", "dev": true }, @@ -16108,13 +16115,13 @@ }, "lodash": { "version": "3.10.1", - "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz", + "resolved": "http://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz", "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y=", "dev": true }, "readable-stream": { "version": "1.1.14", - "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz", + "resolved": "http://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz", "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk=", "dev": true, "requires": { @@ -16126,7 +16133,7 @@ }, "string_decoder": { "version": "0.10.31", - "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz", + "resolved": "http://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz", "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=", "dev": true } @@ -20849,7 +20856,7 @@ }, "media-typer": { "version": "0.3.0", - "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz", + "resolved": "http://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz", "integrity": "sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g=", "dev": true }, @@ -21484,7 +21491,7 @@ }, "multimatch": { "version": "2.1.0", - "resolved": "https://registry.npmjs.org/multimatch/-/multimatch-2.1.0.tgz", + "resolved": "http://registry.npmjs.org/multimatch/-/multimatch-2.1.0.tgz", "integrity": "sha1-nHkGoi+0wCkZ4vX3UWG0zb1LKis=", "dev": true, "requires": { @@ -21546,7 +21553,7 @@ }, "mute-stream": { "version": "0.0.7", - "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz", + "resolved": "http://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz", "integrity": "sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s=", "dev": true }, @@ -21955,7 +21962,7 @@ }, "readable-stream": { "version": "1.0.34", - "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz", + "resolved": "http://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz", "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=", "dev": true, "requires": { @@ -21967,7 +21974,7 @@ }, "string_decoder": { "version": "0.10.31", - "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz", + "resolved": "http://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz", "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=", "dev": true } @@ -22825,7 +22832,7 @@ }, "parse-asn1": { "version": "5.1.1", - "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.1.tgz", + "resolved": "http://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.1.tgz", "integrity": "sha512-KPx7flKXg775zZpnp9SxJlz00gTd4BmJ2yJufSc44gMCRrRQ7NSzAcSJQfifuOLgW6bEi+ftrALtsgALeB2Adw==", "dev": true, "requires": { @@ -22980,7 +22987,7 @@ }, "path-browserify": { "version": "0.0.0", - "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-0.0.0.tgz", + "resolved": "http://registry.npmjs.org/path-browserify/-/path-browserify-0.0.0.tgz", "integrity": "sha1-oLhwcpquIUAFt9UDLsLLuw+0RRo=", "dev": true }, @@ -23369,7 +23376,7 @@ }, "postcss-calc": { "version": "5.3.1", - "resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-5.3.1.tgz", + "resolved": "http://registry.npmjs.org/postcss-calc/-/postcss-calc-5.3.1.tgz", "integrity": "sha1-d7rnypKK2FcW4v2kLyYb98HWW14=", "dev": true, "requires": { @@ -23399,7 +23406,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -23466,7 +23473,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -23532,7 +23539,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -23569,7 +23576,7 @@ }, "postcss-discard-comments": { "version": "2.0.4", - "resolved": "https://registry.npmjs.org/postcss-discard-comments/-/postcss-discard-comments-2.0.4.tgz", + "resolved": "http://registry.npmjs.org/postcss-discard-comments/-/postcss-discard-comments-2.0.4.tgz", "integrity": "sha1-vv6J+v1bPazlzM5Rt2uBUUvgDj0=", "dev": true, "requires": { @@ -23597,7 +23604,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -23662,7 +23669,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -23699,7 +23706,7 @@ }, "postcss-discard-empty": { "version": "2.1.0", - "resolved": "https://registry.npmjs.org/postcss-discard-empty/-/postcss-discard-empty-2.1.0.tgz", + "resolved": "http://registry.npmjs.org/postcss-discard-empty/-/postcss-discard-empty-2.1.0.tgz", "integrity": "sha1-0rS9nVztXr2Nyt52QMfXzX9PkrU=", "dev": true, "requires": { @@ -23727,7 +23734,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -23764,7 +23771,7 @@ }, "postcss-discard-overridden": { "version": "0.1.1", - "resolved": "https://registry.npmjs.org/postcss-discard-overridden/-/postcss-discard-overridden-0.1.1.tgz", + "resolved": "http://registry.npmjs.org/postcss-discard-overridden/-/postcss-discard-overridden-0.1.1.tgz", "integrity": "sha1-ix6vVU9ob7KIzYdMVWZ7CqNmjVg=", "dev": true, "requires": { @@ -23792,7 +23799,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -23829,7 +23836,7 @@ }, "postcss-discard-unused": { "version": "2.2.3", - "resolved": "https://registry.npmjs.org/postcss-discard-unused/-/postcss-discard-unused-2.2.3.tgz", + "resolved": "http://registry.npmjs.org/postcss-discard-unused/-/postcss-discard-unused-2.2.3.tgz", "integrity": "sha1-vOMLLMWR/8Y0Mitfs0ZLbZNPRDM=", "dev": true, "requires": { @@ -23858,7 +23865,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -23923,7 +23930,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -24332,7 +24339,7 @@ }, "postcss-merge-idents": { "version": "2.1.7", - "resolved": "https://registry.npmjs.org/postcss-merge-idents/-/postcss-merge-idents-2.1.7.tgz", + "resolved": "http://registry.npmjs.org/postcss-merge-idents/-/postcss-merge-idents-2.1.7.tgz", "integrity": "sha1-TFUwMTwI4dWzu/PSu8dH4njuonA=", "dev": true, "requires": { @@ -24362,7 +24369,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -24427,7 +24434,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -24506,7 +24513,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -24549,7 +24556,7 @@ }, "postcss-minify-font-values": { "version": "1.0.5", - "resolved": "https://registry.npmjs.org/postcss-minify-font-values/-/postcss-minify-font-values-1.0.5.tgz", + "resolved": "http://registry.npmjs.org/postcss-minify-font-values/-/postcss-minify-font-values-1.0.5.tgz", "integrity": "sha1-S1jttWZB66fIR0qzUmyv17vey2k=", "dev": true, "requires": { @@ -24579,7 +24586,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -24616,7 +24623,7 @@ }, "postcss-minify-gradients": { "version": "1.0.5", - "resolved": "https://registry.npmjs.org/postcss-minify-gradients/-/postcss-minify-gradients-1.0.5.tgz", + "resolved": "http://registry.npmjs.org/postcss-minify-gradients/-/postcss-minify-gradients-1.0.5.tgz", "integrity": "sha1-Xb2hE3NwP4PPtKPqOIHY11/15uE=", "dev": true, "requires": { @@ -24645,7 +24652,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -24682,7 +24689,7 @@ }, "postcss-minify-params": { "version": "1.2.2", - "resolved": "https://registry.npmjs.org/postcss-minify-params/-/postcss-minify-params-1.2.2.tgz", + "resolved": "http://registry.npmjs.org/postcss-minify-params/-/postcss-minify-params-1.2.2.tgz", "integrity": "sha1-rSzgcTc7lDs9kwo/pZo1jCjW8fM=", "dev": true, "requires": { @@ -24713,7 +24720,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -24750,7 +24757,7 @@ }, "postcss-minify-selectors": { "version": "2.1.1", - "resolved": "https://registry.npmjs.org/postcss-minify-selectors/-/postcss-minify-selectors-2.1.1.tgz", + "resolved": "http://registry.npmjs.org/postcss-minify-selectors/-/postcss-minify-selectors-2.1.1.tgz", "integrity": "sha1-ssapjAByz5G5MtGkllCBFDEXNb8=", "dev": true, "requires": { @@ -24781,7 +24788,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -24933,7 +24940,7 @@ }, "postcss-normalize-charset": { "version": "1.1.1", - "resolved": "https://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-1.1.1.tgz", + "resolved": "http://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-1.1.1.tgz", "integrity": "sha1-757nEhLX/nWceO0WL2HtYrXLk/E=", "dev": true, "requires": { @@ -24961,7 +24968,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -24998,7 +25005,7 @@ }, "postcss-normalize-url": { "version": "3.0.8", - "resolved": "https://registry.npmjs.org/postcss-normalize-url/-/postcss-normalize-url-3.0.8.tgz", + "resolved": "http://registry.npmjs.org/postcss-normalize-url/-/postcss-normalize-url-3.0.8.tgz", "integrity": "sha1-EI90s/L82viRov+j6kWSJ5/HgiI=", "dev": true, "requires": { @@ -25029,7 +25036,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -25095,7 +25102,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -25132,7 +25139,7 @@ }, "postcss-reduce-idents": { "version": "2.4.0", - "resolved": "https://registry.npmjs.org/postcss-reduce-idents/-/postcss-reduce-idents-2.4.0.tgz", + "resolved": "http://registry.npmjs.org/postcss-reduce-idents/-/postcss-reduce-idents-2.4.0.tgz", "integrity": "sha1-wsbSDMlYKE9qv75j92Cb9AkFmtM=", "dev": true, "requires": { @@ -25161,7 +25168,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -25198,7 +25205,7 @@ }, "postcss-reduce-initial": { "version": "1.0.1", - "resolved": "https://registry.npmjs.org/postcss-reduce-initial/-/postcss-reduce-initial-1.0.1.tgz", + "resolved": "http://registry.npmjs.org/postcss-reduce-initial/-/postcss-reduce-initial-1.0.1.tgz", "integrity": "sha1-aPgGlfBF0IJjqHmtJA343WT2ROo=", "dev": true, "requires": { @@ -25226,7 +25233,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -25263,7 +25270,7 @@ }, "postcss-reduce-transforms": { "version": "1.0.4", - "resolved": "https://registry.npmjs.org/postcss-reduce-transforms/-/postcss-reduce-transforms-1.0.4.tgz", + "resolved": "http://registry.npmjs.org/postcss-reduce-transforms/-/postcss-reduce-transforms-1.0.4.tgz", "integrity": "sha1-/3b02CEkN7McKYpC0uFEQCV3GuE=", "dev": true, "requires": { @@ -25293,7 +25300,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -25444,7 +25451,7 @@ }, "postcss-svgo": { "version": "2.1.6", - "resolved": "https://registry.npmjs.org/postcss-svgo/-/postcss-svgo-2.1.6.tgz", + "resolved": "http://registry.npmjs.org/postcss-svgo/-/postcss-svgo-2.1.6.tgz", "integrity": "sha1-tt8YqmE7Zm4TPwittSGcJoSsEI0=", "dev": true, "requires": { @@ -25475,7 +25482,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -25562,7 +25569,7 @@ }, "postcss-unique-selectors": { "version": "2.0.2", - "resolved": "https://registry.npmjs.org/postcss-unique-selectors/-/postcss-unique-selectors-2.0.2.tgz", + "resolved": "http://registry.npmjs.org/postcss-unique-selectors/-/postcss-unique-selectors-2.0.2.tgz", "integrity": "sha1-mB1X0p3csz57Hf4f1DuGSfkzyh0=", "dev": true, "requires": { @@ -25592,7 +25599,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -25635,7 +25642,7 @@ }, "postcss-zindex": { "version": "2.2.0", - "resolved": "https://registry.npmjs.org/postcss-zindex/-/postcss-zindex-2.2.0.tgz", + "resolved": "http://registry.npmjs.org/postcss-zindex/-/postcss-zindex-2.2.0.tgz", "integrity": "sha1-0hCd3AVbka9n/EyzsCWUZjnSryI=", "dev": true, "requires": { @@ -25665,7 +25672,7 @@ "dependencies": { "supports-color": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", "dev": true } @@ -25757,7 +25764,7 @@ }, "pretty-bytes": { "version": "4.0.2", - "resolved": "https://registry.npmjs.org/pretty-bytes/-/pretty-bytes-4.0.2.tgz", + "resolved": "http://registry.npmjs.org/pretty-bytes/-/pretty-bytes-4.0.2.tgz", "integrity": "sha1-sr+C5zUNZcbDOqlaqlpPYyf2HNk=", "dev": true }, @@ -28042,7 +28049,7 @@ }, "load-json-file": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz", + "resolved": "http://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz", "integrity": "sha1-eUfkIUmvgNaWy/eXvKq8/h/inKg=", "dev": true, "requires": { @@ -28064,7 +28071,7 @@ }, "minimist": { "version": "1.2.0", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", + "resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=", "dev": true }, @@ -28133,7 +28140,7 @@ }, "pify": { "version": "2.3.0", - "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz", + "resolved": "http://registry.npmjs.org/pify/-/pify-2.3.0.tgz", "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=", "dev": true }, @@ -28320,7 +28327,7 @@ }, "resolve": { "version": "1.6.0", - "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.6.0.tgz", + "resolved": "http://registry.npmjs.org/resolve/-/resolve-1.6.0.tgz", "integrity": "sha512-mw7JQNu5ExIkcw4LPih0owX/TZXjD/ZUF/ZQ/pDnkw3ZKhDcZZw5klmBlj6gVMwjQ3Pz5Jgu7F3d0jcDVuEWdw==", "dev": true, "requires": { @@ -28713,7 +28720,7 @@ }, "load-json-file": { "version": "1.1.0", - "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz", + "resolved": "http://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz", "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=", "dev": true, "requires": { @@ -28773,7 +28780,7 @@ }, "string-width": { "version": "1.0.2", - "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz", + "resolved": "http://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz", "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=", "dev": true, "requires": { @@ -28793,7 +28800,7 @@ }, "yargs": { "version": "6.6.0", - "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz", + "resolved": "http://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz", "integrity": "sha1-eC7CHvQDNF+DCoCMo9UTr1YGUgg=", "dev": true, "requires": { @@ -28814,7 +28821,7 @@ }, "yargs-parser": { "version": "4.2.1", - "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz", + "resolved": "http://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz", "integrity": "sha1-KczqwNxPA8bIe0qfIX3RjJ90hxw=", "dev": true, "requires": { @@ -28901,7 +28908,7 @@ }, "load-json-file": { "version": "1.1.0", - "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz", + "resolved": "http://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz", "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=", "dev": true, "requires": { @@ -28955,7 +28962,7 @@ }, "string-width": { "version": "1.0.2", - "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz", + "resolved": "http://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz", "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=", "dev": true, "requires": { @@ -29593,7 +29600,7 @@ }, "reduce-css-calc": { "version": "1.3.0", - "resolved": "https://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-1.3.0.tgz", + "resolved": "http://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-1.3.0.tgz", "integrity": "sha1-dHyRTgSWFKTJz7umKYca0dKSdxY=", "dev": true, "requires": { @@ -30169,7 +30176,7 @@ }, "require-uncached": { "version": "1.0.3", - "resolved": "https://registry.npmjs.org/require-uncached/-/require-uncached-1.0.3.tgz", + "resolved": "http://registry.npmjs.org/require-uncached/-/require-uncached-1.0.3.tgz", "integrity": "sha1-Tg1W1slmL9MeQwEcS5WqSZVUIdM=", "dev": true, "requires": { @@ -31221,7 +31228,7 @@ }, "sha.js": { "version": "2.4.11", - "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.11.tgz", + "resolved": "http://registry.npmjs.org/sha.js/-/sha.js-2.4.11.tgz", "integrity": "sha512-QMEp5B7cftE7APOjk5Y6xgrbWu+WkLVQwk8JNjZ8nKRciZaByEW6MubieAiToS7+dwvrjGhH8jRXz3MVd0AYqQ==", "dev": true, "requires": { @@ -32111,7 +32118,7 @@ }, "stream-browserify": { "version": "2.0.1", - "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz", + "resolved": "http://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz", "integrity": "sha1-ZiZu5fm9uZQKTkUUyvtDu3Hlyds=", "dev": true, "requires": { @@ -33087,7 +33094,7 @@ }, "file-loader": { "version": "1.1.11", - "resolved": "http://registry.npmjs.org/file-loader/-/file-loader-1.1.11.tgz", + "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-1.1.11.tgz", "integrity": "sha512-TGR4HU7HUsGg6GCOPJnFk06RhWgEWFLAGWiT6rcD+GRC2keU3s9RGJ+b3Z6/U73jwwNb2gKLJ7YCrp+jvU4ALg==", "dev": true, "requires": { @@ -33298,7 +33305,7 @@ }, "pify": { "version": "2.3.0", - "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz", + "resolved": "http://registry.npmjs.org/pify/-/pify-2.3.0.tgz", "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=", "dev": true } @@ -34356,7 +34363,7 @@ }, "tty-browserify": { "version": "0.0.0", - "resolved": "https://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.0.tgz", + "resolved": "http://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.0.tgz", "integrity": "sha1-oVe6QC2iTpv5V/mqadUk7tQpAaY=", "dev": true }, @@ -35367,7 +35374,7 @@ }, "vm-browserify": { "version": "0.0.4", - "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz", + "resolved": "http://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz", "integrity": "sha1-XX6kW7755Kb/ZflUOOCofDV9WnM=", "dev": true, "requires": { @@ -36204,7 +36211,7 @@ }, "http-proxy-middleware": { "version": "0.18.0", - "resolved": "http://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-0.18.0.tgz", + "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-0.18.0.tgz", "integrity": "sha512-Fs25KVMPAIIcgjMZkVHJoKg9VcXcC1C8yb9JUgeDvVXY0S/zgVIhMb+qVswDIgtJe2DfckMSY2d6TuTEutlk6Q==", "dev": true, "requires": { diff --git a/packages/Layout/footer-client/src/footer-client.scss b/packages/Layout/footer-client/src/footer-client.scss index 547e8c252..5e7271868 100644 --- a/packages/Layout/footer-client/src/footer-client.scss +++ b/packages/Layout/footer-client/src/footer-client.scss @@ -1,9 +1,26 @@ @import '@axa-fr/react-toolkit-core/src/common/scss/core.scss'; -@import '_footer-client-item.scss'; -@import '_footer-client-list.scss'; -@import '_language-selection.scss'; -@import '_social-network.scss'; +@import '_footer-client-item'; +@import '_footer-client-list'; +@import '_language-selection'; + +.social-network__list { + list-style: none; + display: flex; + padding: 0; +} + +.social-network__item { + flex-grow: 1; +} + +.social-network__link { + color: $color-white; +} + +.social-network__icon { + font-size: 25px; +} .af-footer-client { border-top: none; diff --git a/packages/tabs/package.json b/packages/tabs/package.json index 0ac0c91f2..9829d8010 100644 --- a/packages/tabs/package.json +++ b/packages/tabs/package.json @@ -7,9 +7,6 @@ "scripts": { "prepare": "node ../../scripts/prepare.js" }, - "files": [ - "dist/" - ], "peerDependencies": { "react": "^16.4.1", "react-dom": "^16.4.1" diff --git a/packages/tabs/src/Pane.js b/packages/tabs/src/Pane.js deleted file mode 100644 index 59ae944db..000000000 --- a/packages/tabs/src/Pane.js +++ /dev/null @@ -1,23 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; - -import { Constants } from '@axa-fr/react-toolkit-core'; - -const propTypes = { - ...Constants.propTypes, - children: PropTypes.any.isRequired, -}; - -const defaultProps = { - ...Constants.defaultProps, - children: null, -}; - -const Pane = ({ children }) => ( -
 {children}
-); - -Pane.propTypes = propTypes; -Pane.defaultProps = defaultProps; - -export default Pane; diff --git a/packages/tabs/src/Pane.spec.tsx b/packages/tabs/src/Pane.spec.tsx new file mode 100644 index 000000000..c7498b4d8 --- /dev/null +++ b/packages/tabs/src/Pane.spec.tsx @@ -0,0 +1,15 @@ +import * as React from 'react'; +import Pane from './Pane'; +import { create } from 'react-test-renderer'; + +describe('', () => { + it('should render component', () => { + const component = create( + +
Content
+ + ); + const json = component.toJSON(); + expect(json).toMatchSnapshot(); + }); +}); diff --git a/packages/tabs/src/Pane.tsx b/packages/tabs/src/Pane.tsx new file mode 100644 index 000000000..8795854b4 --- /dev/null +++ b/packages/tabs/src/Pane.tsx @@ -0,0 +1,26 @@ +import * as React from 'react'; +import { withClassDefault } from '@axa-fr/react-toolkit-core'; +import { compose, branch, renderNothing } from 'recompose'; + +const DEFAULT_CLASSNAME = 'af-tabs__pane'; + +export type DivProps = React.DetailedHTMLProps< + React.HTMLAttributes, + HTMLDivElement +>; + +interface PaneComponentProps extends DivProps { + active: boolean; + className?: string; + children?: React.ReactNode; +} +const Pane: React.SFC = ({ children, className }) => ( +
{children}
+); + +const enchance = compose( + branch((props: PaneComponentProps) => props.active === false, renderNothing), + withClassDefault(DEFAULT_CLASSNAME) +)(Pane); + +export default enchance; diff --git a/packages/tabs/src/Tab.js b/packages/tabs/src/Tab.js deleted file mode 100644 index e9906bd6e..000000000 --- a/packages/tabs/src/Tab.js +++ /dev/null @@ -1,87 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import classNames from 'classnames'; - -import { Constants, ClassManager } from '@axa-fr/react-toolkit-core'; - -const propTypes = { - ...Constants.propTypes, - classModifier: PropTypes.string, - className: PropTypes.string, - children: PropTypes.any.isRequired, - title: PropTypes.any.isRequired, - active: PropTypes.bool.isRequired, - setActiveIndex: PropTypes.func, - index: PropTypes.number, - disabled: PropTypes.bool, -}; - -const defaultClassName = 'af-tabs__item'; - -const defaultProps = { - ...Constants.defaultProps, - className: defaultClassName, - children: null, - title: null, - active: false, - role: 'TITLE', - onChange: () => {}, - index: 0, - disabled: false, -}; - -class Tab extends React.Component { - /* eslint-disable no-unused-expressions */ - onChange = () => { - const { disabled, index, onChange } = this.props; - disabled - ? e => { - e.preventDefault(); - } - : onChange(index); - }; - - render() { - const { - role, - active, - disabled, - children, - title, - className, - classModifier, - } = this.props; - const componentClassName = ClassManager.getComponentClassName( - className, - classModifier, - defaultClassName - ); - switch (role) { - case 'TITLE': - return ( -
  • - -
    • - ); - case 'PANE': - return active ?
    {children}
    : null; - default: - return null; - } - } -} - -Tab.propTypes = propTypes; -Tab.defaultProps = defaultProps; -Tab.displayName = 'Tabs.Tab'; - -export default Tab; diff --git a/packages/tabs/src/Tab.tsx b/packages/tabs/src/Tab.tsx new file mode 100644 index 000000000..f077e584b --- /dev/null +++ b/packages/tabs/src/Tab.tsx @@ -0,0 +1,29 @@ +import * as React from 'react'; +import { + withClassDefault, + withClassModifier, + WithClassModifierOptions, +} from '@axa-fr/react-toolkit-core'; +import { compose } from 'recompose'; + +interface TabComponentProps { + className?: string; + title: string; + children?: React.ReactNode; + classModifier?: string; +} + +const Tab: React.SFC = () => ; + +const DEFAULT_CLASSNAME = 'af-tabs__pane'; + +export type TabProps = TabComponentProps & WithClassModifierOptions; + +const enhance = compose( + withClassDefault(DEFAULT_CLASSNAME), + withClassModifier +); + +const Enhanced = enhance(Tab); +Enhanced.displayName = 'TabCore'; +export default Enhanced; diff --git a/packages/tabs/src/Tabs.Title.js b/packages/tabs/src/Tabs.Title.js deleted file mode 100644 index 877b68599..000000000 --- a/packages/tabs/src/Tabs.Title.js +++ /dev/null @@ -1,47 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import classNames from 'classnames'; - -import { Constants, ClassManager } from '@axa-fr/react-toolkit-core'; - -const propTypes = { - ...Constants.propTypes, - children: PropTypes.any.isRequired, - active: PropTypes.bool.isRequired, - className: PropTypes.string, - classModifier: PropTypes.string, -}; - -const defaultClassName = 'af-tabs__item'; - -const defaultProps = { - ...Constants.defaultProps, - children: null, - active: false, - className: defaultClassName, -}; - -const Title = props => { - const { active, className, classModifier } = props; - const componentClassName = ClassManager.getComponentClassName( - className, - classModifier, - defaultClassName - ); - return ( -
  • - -
    • - ); -}; - -Title.propTypes = propTypes; -Title.defaultProps = defaultProps; -Title.displayName = 'Tabs.Title'; - -export default Title; diff --git a/packages/tabs/src/Tabs.js b/packages/tabs/src/Tabs.js deleted file mode 100644 index a688178e8..000000000 --- a/packages/tabs/src/Tabs.js +++ /dev/null @@ -1,47 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import TabsStateless from './TabsStateless'; -import Title from './Tabs.Title'; -import Tab from './Tab'; - -const propTypes = { - onChange: PropTypes.func, -}; - -const defaultProps = { - onChange: null, -}; - -class Tabs extends React.Component { - constructor(props) { - super(props); - this.state = { - activeIndex: 0, - }; - } - - onchange = index => { - this.setState({ activeIndex: index }); - const { onChange } = this.props; - if (onChange) { - onChange(index); - } - }; - - render() { - const { activeIndex } = this.state; - const { children } = this.props; - return ( - - {children.map(tab => tab)} - - ); - } -} - -Tabs.Tab = Tab; -Tabs.Title = Title; -Tabs.defaultProps = defaultProps; -Tabs.propTypes = propTypes; - -export default Tabs; diff --git a/packages/tabs/src/Tabs.spec.js b/packages/tabs/src/Tabs.spec.js deleted file mode 100644 index 5ec120aa9..000000000 --- a/packages/tabs/src/Tabs.spec.js +++ /dev/null @@ -1,17 +0,0 @@ -import React from 'react'; -import { mount } from 'enzyme'; - -import Tabs from './Tabs'; - -const wrapper = mount( - - Content of my first tab - Content of my second tab - -); - -describe(' With children', () => { - it('renders structure', () => { - expect(wrapper.find('.af-tabs').exists()).toBe(true); - }); -}); diff --git a/packages/tabs/src/Tabs.tsx b/packages/tabs/src/Tabs.tsx new file mode 100644 index 000000000..7b0434df1 --- /dev/null +++ b/packages/tabs/src/Tabs.tsx @@ -0,0 +1,14 @@ +import * as React from 'react'; + +import TabsCore, { TabsCoreProps } from './TabsCore'; +import Tab from './Tab'; + +class Tabs extends React.PureComponent { + public render() { + return ; + } + + public static readonly Tab = Tab; +} + +export default Tabs; diff --git a/packages/tabs/src/TabsCore.tsx b/packages/tabs/src/TabsCore.tsx new file mode 100644 index 000000000..15208ef4a --- /dev/null +++ b/packages/tabs/src/TabsCore.tsx @@ -0,0 +1,47 @@ +import TabsStateless, { + TabsStatelessHandlers, + TabsStatelessProps, +} from './TabsStateless'; + +import { + StateHandlerMap, + StateHandler, + StateUpdaters, + withStateHandlers, + compose, +} from 'recompose'; +import { TabProps } from './Tab'; + +export interface TabsContainerState { + activeIndex: string; +} + +export interface TabsCoreProps { + children: React.ReactElement[]; + onChange: React.MouseEventHandler; +} + +interface TabsUpdaters extends StateHandlerMap { + onChange: StateHandler; +} + +export const defaultState = { activeIndex: '0' }; + +export const stateUpdaters: StateUpdaters< + TabsCoreProps, + TabsContainerState, + TabsUpdaters +> = { + onChange: () => e => { + return { + activeIndex: e.id, + }; + }, +}; + +const enchancer = compose< + TabsStatelessHandlers & TabsStatelessProps, + TabsCoreProps +>(withStateHandlers(defaultState, stateUpdaters)); + +export default enchancer(TabsStateless); diff --git a/packages/tabs/src/TabsStateless.js b/packages/tabs/src/TabsStateless.js deleted file mode 100644 index f54ff8f92..000000000 --- a/packages/tabs/src/TabsStateless.js +++ /dev/null @@ -1,69 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; - -import { Constants, ClassManager } from '@axa-fr/react-toolkit-core'; - -const defaultClassName = 'af-tabs'; - -const noop = () => {}; - -const propTypes = { - ...Constants.propTypes, - className: PropTypes.string, - children: PropTypes.array.isRequired, - activeIndex: PropTypes.number.isRequired, - onChange: PropTypes.func.isRequired, -}; - -const defaultProps = { - ...Constants.defaultProps, - className: defaultClassName, - children: [], - activeIndex: 0, - onChange: noop, -}; - -const TabsStateless = ({ - activeIndex, - className, - classModifier, - children, - onChange, -}) => { - const componentClassName = ClassManager.getComponentClassName( - className, - classModifier, - defaultClassName - ); - return ( -
    -
      - {React.Children.map(children, (tab, index) => - React.cloneElement(tab, { - active: activeIndex === index, - onChange, - role: 'TITLE', - // index as a key is ok here, no better candidate - key: index, // eslint-disable-line - index, - }) - )} -
    -
    - {React.Children.map(children, (tab, index) => - React.cloneElement(tab, { - active: activeIndex === index, - role: 'PANE', - // index as a key is ok here, no better candidate - key: index, // eslint-disable-line - }) - )} -
    -
    - ); -}; - -TabsStateless.defaultProps = defaultProps; -TabsStateless.propTypes = propTypes; - -export default TabsStateless; diff --git a/packages/tabs/src/TabsStateless.spec.tsx b/packages/tabs/src/TabsStateless.spec.tsx new file mode 100644 index 000000000..105e51779 --- /dev/null +++ b/packages/tabs/src/TabsStateless.spec.tsx @@ -0,0 +1,29 @@ +import * as React from 'react'; +import TabStateless from './TabsStateless'; +import Tab from './Tab'; +import { create } from 'react-test-renderer'; + +const noop = () => {}; +describe('', () => { + it('should render component', () => { + const component = create( + + + Content + + + Content + + + Content + + + ); + const json = component.toJSON(); + expect(json).toMatchSnapshot(); + }); +}); diff --git a/packages/tabs/src/TabsStateless.tsx b/packages/tabs/src/TabsStateless.tsx new file mode 100644 index 000000000..04267f55a --- /dev/null +++ b/packages/tabs/src/TabsStateless.tsx @@ -0,0 +1,63 @@ +import * as React from 'react'; +import { Constants, ClassManager } from '@axa-fr/react-toolkit-core'; +import { TabProps } from './Tab'; +import Title from './Title'; +import Pane from './Pane'; + +const defaultClassName = 'af-tabs'; + +export interface TabsStatelessProps { + className: string; + children: React.ReactElement[]; + activeIndex: string; + classModifier?: string; +} + +export interface TabsStatelessHandlers { + onChange: React.MouseEventHandler; +} + +const defaultProps = { + ...Constants.defaultProps, + className: defaultClassName, +}; + +const TabsStateless: React.SFC = ({ + activeIndex, + className, + classModifier, + children, + onChange, +}) => { + const componentClassName = ClassManager.getComponentClassName( + className, + classModifier, + defaultClassName + ); + return ( +
    +
      + {children.map((item, index) => ( + + {item.props.title} + + ))} +
    +
    + {children.map((item, index) => ( + + {item.props.children} + + ))} +
    +
    + ); +}; + +TabsStateless.defaultProps = defaultProps; + +export default TabsStateless; diff --git a/packages/tabs/src/Title.spec.tsx b/packages/tabs/src/Title.spec.tsx new file mode 100644 index 000000000..184b2ce11 --- /dev/null +++ b/packages/tabs/src/Title.spec.tsx @@ -0,0 +1,28 @@ +import * as React from 'react'; +import Title from './Title'; +import { mount } from 'enzyme'; +import { create } from 'react-test-renderer'; + +const noop = () => {}; +describe('', () => { + it('should render component', () => { + const component = create( + + Title displayed + + ); + const json = component.toJSON(); + expect(json).toMatchSnapshot(); + }); + + it('should render id click onCancel', () => { + const onChange = jest.fn(); + const wrapper = mount( + + header + + ); + wrapper.find('button').simulate('click', {}); + expect(onChange).toHaveBeenCalledWith({ id: '' }); + }); +}); diff --git a/packages/tabs/src/Title.tsx b/packages/tabs/src/Title.tsx new file mode 100644 index 000000000..d8dee75ee --- /dev/null +++ b/packages/tabs/src/Title.tsx @@ -0,0 +1,59 @@ +import * as React from 'react'; +import { + withClassDefault, + withClickId, + WithClassModifierOptions, + withClassModifier +} from '@axa-fr/react-toolkit-core'; +import { compose, withProps } from 'recompose'; + +const onChangeEvent = 'onChange'; + +export interface TitleComponentProps { + enable?: boolean | null; + active: boolean; + className?: string; + classModifier?: string; + id?: string; +} + +export interface TitleHandlerProps { + onChange: React.MouseEventHandler; +} + +const Title: React.SFC = ({ + className, + onChange, + children, + id, +}) => ( +
  • + +
    • +); + +const DEFAULT_CLASSNAME = 'af-tabs__item'; + +export type TitleProps = TitleComponentProps & + TitleHandlerProps & + WithClassModifierOptions; + +const setWithProps = (props: TitleComponentProps) => ({ + ...props, + classModifier: (props.classModifier || '').concat( + (props.enable === false ? ' disabled' : '').concat( + props.active ? ' active' : '' + ) + ), +}); + +const enchance = compose( + withProps(setWithProps), + withClickId({ event: [onChangeEvent] }), + withClassDefault(DEFAULT_CLASSNAME), + withClassModifier +)(Title); + +export default enchance; diff --git a/packages/tabs/src/__snapshots__/Pane.spec.tsx.snap b/packages/tabs/src/__snapshots__/Pane.spec.tsx.snap new file mode 100644 index 000000000..b21747b57 --- /dev/null +++ b/packages/tabs/src/__snapshots__/Pane.spec.tsx.snap @@ -0,0 +1,11 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[` should render component 1`] = ` +
    +
    + Content +
    +
    +`; diff --git a/packages/tabs/src/__snapshots__/TabsStateless.spec.tsx.snap b/packages/tabs/src/__snapshots__/TabsStateless.spec.tsx.snap new file mode 100644 index 000000000..c4c867bbf --- /dev/null +++ b/packages/tabs/src/__snapshots__/TabsStateless.spec.tsx.snap @@ -0,0 +1,56 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[` should render component 1`] = ` +
    +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    +
    + + Content + +
    +
    +
    +`; diff --git a/packages/tabs/src/__snapshots__/Title.spec.tsx.snap b/packages/tabs/src/__snapshots__/Title.spec.tsx.snap new file mode 100644 index 000000000..b9a57a779 --- /dev/null +++ b/packages/tabs/src/__snapshots__/Title.spec.tsx.snap @@ -0,0 +1,14 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[` should render component 1`] = ` +
  • + +
    • +`; diff --git a/packages/tabs/src/index.js b/packages/tabs/src/index.ts similarity index 100% rename from packages/tabs/src/index.js rename to packages/tabs/src/index.ts diff --git a/packages/tabs/tsconfig.json b/packages/tabs/tsconfig.json new file mode 100644 index 000000000..9dfdd3ce8 --- /dev/null +++ b/packages/tabs/tsconfig.json @@ -0,0 +1,4 @@ +{ + "extends": "../../tsconfig.dev.json", + "include": ["./src/index.ts"], +}