postcss-pseudo-class-enter - npm Package Compare versions

Comparing version 0.2.1 to 0.3.0

.eslintrc

@@ -7,3 +7,3 @@ {
 		"no-multi-spaces":       [0],
-		"no-extra-parens":       [2],
+		"no-extra-parens":       [0],
 		"no-unused-vars":        [2],
@@ -10,0 +10,0 @@ "no-loop-func":          [0],

CHANGELOG.md

@@ -0,1 +1,7 @@
+## 0.3.0 (2015-06-16)
+
+- Added: Support for complex uses
+- Added: Code documentation
+- Changed: Coding conventions
+
 ## 0.2.1 (2015-06-16)
@@ -2,0 +8,0 @@

index.js

@@ -5,32 +5,48 @@ var postcss = require('postcss');
 module.exports = postcss.plugin('postcss-pseudo-class-enter', function (opts) {
-	var pseudoValue = ':' + (opts && opts.prefix ? '-' + opts.prefix + '-' : '') + 'enter';
-	var pseudoFallbackValues = [':focus', ':hover'];
+	// cache the enter value
+	var valueEnter = ':' + (opts && opts.prefix ? '-' + opts.prefix + '-' : '') + 'enter';
 
-	function eachRule(rule) {
-		rule.selector = postcssSelectorParser(function (selectors) {
-			selectors.each(function (selector, index) {
-				var originalIndex = index;
+	return function (css) {
+		// for each rule
+		css.eachRule(function (rule) {
+			// update the selector
+			rule.selector = postcssSelectorParser(function (selectors) {
+				// cache variables
+				var node;
+				var nodeIndex;
+				var selector;
+				var selectorFocus;
+				var selectorHover;
 
-				pseudoFallbackValues.forEach(function (pseudoFallbackValue) {
-					var clone = selector.clone();
+				// cache the selector index
+				var selectorIndex = -1;
 
-					clone.eachPseudo(function (pseudo) {
-						if (pseudo.value === pseudoValue) {
-							pseudo.value = pseudoFallbackValue;
+				// for each selector
+				while ((selector = selectors.nodes[++selectorIndex])) {
+					// reset the node index
+					nodeIndex = -1;
 
-							selectors.nodes.splice(++index, 0, clone);
+					// for each node
+					while ((node = selector.nodes[++nodeIndex])) {
+						// if the node value matches the enter value
+						if (node.value === valueEnter) {
+							// clone the selector
+							selectorFocus = selector.clone();
+							selectorHover = selector.clone();
+
+							// update the matching clone values
+							selectorFocus.nodes[nodeIndex].value = ':focus';
+							selectorHover.nodes[nodeIndex].value = ':hover';
+
+							// replace the selector with the clones and roll back the selector index
+							selectors.nodes.splice(selectorIndex--, 1, selectorFocus, selectorHover);
+
+							// stop updating the selector
+							break;
 						}
-					});
-				});
-
-				if (originalIndex !== index) {
-					selector.removeSelf();
+					}
 				}
-			});
-		}).process(rule.selector).result;
-	}
-
-	return function (css) {
-		css.eachRule(eachRule);
+			}).process(rule.selector).result;
+		});
 	};
 });

package.json

 {
 	"name": "postcss-pseudo-class-enter",
-	"version": "0.2.1",
+	"version": "0.3.0",
 	"description": "Use the proposed :enter pseudo-class in CSS",
@@ -5,0 +5,0 @@ "keywords": ["postcss", "css", "postcss-plugin", "hover", "focus", "pseudo", "keyboard", "mouse", "touch", "pointer"],

No alert changes

Improved metrics

Total package byte prevSize

7546

9.31%

Lines of code

43

53.57%

No dependency changes