Add support for custom selectors

Pedro Valentim · Pedro Valentim · commit 6024c6379302 · 2015-03-25T13:32:27.000Z
diff --git a/examples/example.css b/examples/example.css
@@ -32,4 +32,22 @@ button
 
   button
     border-radius: 0
-    width: 100%
+    width: 100%
+
+@custom-selector --heading h1, h2
+@custom-selector :--link :hover, :active
+
+@custom-selector --heading h1, h2
+@custom-selector :--any-link :link, :visited
+
+a:hover
+  color: red
+
+a:--any-link
+  color: blue
+
+--heading
+  color: #fff
+
+article --heading
+  color: #000
diff --git a/examples/index.js b/examples/index.js
@@ -9,4 +9,4 @@ var fs = require('fs')
 
 var str = read('examples/example.css', 'utf8');
 var css = compile(str);
-console.log(css);
+console.log(css);
diff --git a/lib/lexer.js b/lib/lexer.js
@@ -34,7 +34,8 @@ var pseudos = [
   '-o',
   '-ms',
   '-moz',
-  '-webkit'
+  '-webkit',
+  '--'
 ]
 
 /**
@@ -196,7 +197,7 @@ module.exports = function(str) {
     var m = str.match(/^([^\n,]+, *\n|[^\n]+)+/);
     if (!m) return;
     str = str.slice(m[0].length);
-    m = m[0].split(/\s*,\s*/);
+    m = (m[0].indexOf('@custom-selector') > -1) ? [m[0]] : m[0].split(/\s*,\s*/);
     return ['rule', m];
   }
 }
diff --git a/test/cases/custom-selectors.css b/test/cases/custom-selectors.css
@@ -0,0 +1,11 @@
+@custom-selector --heading h1, h2
+@custom-selector :--any-link :link, :visited
+
+a:--any-link
+  color: blue
+
+--heading
+  color: #fff
+
+article --heading
+  color: #000
diff --git a/test/cases/custom-selectors.out.css b/test/cases/custom-selectors.out.css
@@ -0,0 +1,15 @@
+@custom-selector --heading h1, h2;
+
+@custom-selector :--any-link :link, :visited;
+
+a:--any-link {
+  color: blue;
+}
+
+--heading {
+  color: #fff;
+}
+
+article --heading {
+  color: #000;
+}

Original file line number	Diff line number	Diff line change
`@@ -34,7 +34,8 @@ var pseudos = [`
`34`	`34`	`'-o',`
`35`	`35`	`'-ms',`
`36`	`36`	`'-moz',`
`37`		`- '-webkit'`
	`37`	`+ '-webkit',`
	`38`	`+ '--'`
`38`	`39`	`]`
`39`	`40`
`40`	`41`	`/**`
`@@ -196,7 +197,7 @@ module.exports = function(str) {`
`196`	`197`	`var m = str.match(/^([^\n,]+, *\n\|[^\n]+)+/);`
`197`	`198`	`if (!m) return;`
`198`	`199`	`str = str.slice(m[0].length);`
`199`		`- m = m[0].split(/\s,\s/);`
	`200`	`+ m = (m[0].indexOf('@custom-selector') > -1) ? [m[0]] : m[0].split(/\s,\s/);`
`200`	`201`	`return ['rule', m];`
`201`	`202`	`}`
`202`	`203`	`}`