postcss-focus-visible - npm Package Compare versions

Comparing version 2.0.0 to 3.0.0

CHANGELOG.md

 # Changes to PostCSS Focus Visible
 
+### 3.0.0 (April 7, 2018)
+
+- Changed: default functionality to preserve the original rule
+- Added: `preserve` option to preserve the original rule using `:focus-visible`
+
 ### 2.0.0 (February 17, 2018)
@@ -4,0 +9,0 @@

package.json

 {
   "name": "postcss-focus-visible",
-  "version": "2.0.0",
+  "version": "3.0.0",
   "description": "Use the :focus-visible pseudo-selector in CSS",
@@ -10,7 +10,7 @@ "author": "Jonathan Neal <[e-mail]>",
   "bugs": "https://github.com/jonathantneal/postcss-focus-visible/issues",
-  "main": "index.bundle.js",
-  "module": "index.js",
+  "main": "index.cjs.js",
+  "module": "index.es.js",
   "files": [
-    "index.js",
-    "index.bundle.js"
+    "index.cjs.js",
+    "index.es.js"
   ],
@@ -20,4 +20,3 @@ "scripts": {
     "pretest": "rollup -c .rollup.js --silent",
-    "test": "echo 'Running tests...'; npm run test:ec && npm run test:js && npm run test:tape",
-    "test:ec": "echint --ignore index.bundle.js test",
+    "test": "echo 'Running tests...'; npm run test:js && npm run test:tape",
     "test:js": "eslint *.js --cache --ignore-path .gitignore --quiet",
@@ -36,8 +35,7 @@ "test:tape": "postcss-tape"
     "babel-preset-env": "^1.6",
-    "echint": "^4.0",
-    "eslint": "^4.18",
+    "eslint": "^4.19",
     "eslint-config-dev": "2.0",
     "postcss-tape": "2.2",
     "pre-commit": "^1.2",
-    "rollup": "^0.56",
+    "rollup": "^0.57",
     "rollup-plugin-babel": "^3.0"
@@ -44,0 +42,0 @@ },

README.md

@@ -8,5 +8,7 @@ # PostCSS Focus Visible [<img src="https://postcss.github.io/postcss/logo.svg" alt="PostCSS Logo" width="90" height="90" align="right">][postcss]
 
-[PostCSS Focus Visible] lets you use the `:focus-visible` pseudo-selector in
+[PostCSS Focus Visible] lets you use the `:focus-visible` pseudo-class in
 CSS, following the [Selectors Level 4 specification].
 
+It is the companion to the [focus-visible polyfill].
+
 ```css
@@ -22,8 +24,13 @@ :focus:not(:focus-visible) {
 }
+
+:focus:not(:focus-visible) {
+  outline: none;
+}
 ```
 
-[PostCSS Focus Visible] replaces the `:focus-visible` pseudo-selector with a
-`.focus-visible` class selector, the same selector used by the
-[focus-visible polyfill]. The replacement selector can be changed using the
-`replaceWith` option.
+[PostCSS Focus Visible] duplicates rules using the `:focus-visible` pseudo-class
+with a `.focus-visible` class selector, the same selector used by the
+[focus-visible polyfill]. This replacement selector can be changed using the
+`replaceWith` option. Also, the preservation of the original `:focus-visible`
+rule can be disabled using the `preserve` option.
 
@@ -153,2 +160,23 @@ ## Usage
 
+### preserve
+
+The `preserve` option defines whether the original selector should remain. By
+default, the original selector is preserved.
+
+```js
+focusVisible({ preserve: false });
+```
+
+```css
+:focus:not(:focus-visible) {
+  outline: none;
+}
+
+/* becomes */
+
+:focus:not(.focus-visible) {
+  outline: none;
+}
+```
+
 ### replaceWith
@@ -160,3 +188,3 @@
 ```js
-focusVisible({ replaceWith: '[data-focus-visible-added]' });
+focusVisible({ replaceWith: '[focus-visible]' });
 ```
@@ -171,5 +199,9 @@
 
-:focus:not([data-focus-visible-added]) {
+:focus:not([focus-visible]) {
   outline: none;
 }
+
+:focus:not(:focus-visible) {
+  outline: none;
+}
 ```
@@ -184,3 +216,3 @@
 [git-url]: https://gitter.im/postcss/postcss
-[git-img]: https://img.shields.io/badge/chat-gitter-blue.svg
+[git-img]: https://img.shields.io/badge/support-chat-blue.svg
 
@@ -187,0 +219,0 @@ [focus-visible polyfill]: https://github.com/WICG/focus-visible

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

14917

increased by7.32%

Dev dependency count

9

decreased by-10%

Lines of code

42

increased by55.56%

Number of lines in readme file

220

increased by17.02%

No dependency changes