Support css-loader inheritance and local imports

Author: markdalgleish

CHANGELOG.md

@@ -3,8 +3,8 @@ All notable changes to this project will be documented in this file.
 This project adheres to [Semantic Versioning](http://semver.org/).
 
 ## [Unreleased][unreleased]
-### Changed
-- Nothing yet.
+### Added
+- Support for css-loader [inheritance](https://github.com/webpack/css-loader#inheriting) and [local imports](https://github.com/webpack/css-loader#importing-local-class-names).
 
 ## [0.0.4] - 2015-05-22
 ### Changed

index.js

@@ -28,6 +28,7 @@ function transformSelector(options, rule, selector) {
   return selector
     .replace(/\:global\((.*?)\)/g, escapeDots)
     .replace(/\:global (.*)/g, escapeDots)
+    .replace(/(\:extends\((.*?)\))/g, escapeDots)
     .replace(/\.local\[(-?[_a-zA-Z]+[_a-zA-Z0-9-]*)\]/g, '.$1') // source: http://stackoverflow.com/questions/448981/what-characters-are-valid-in-css-class-names-selectors
     .replace(/\:local\(\.(-?[_a-zA-Z]+[_a-zA-Z0-9-]*)\)/g, '.$1')
     .replace(/\.(-?[_a-zA-Z]+[_a-zA-Z0-9-]*)/g, ':local(.$1)')

test.js

@@ -114,6 +114,16 @@ var tests = [
     input: 'input {}',
     expected: 'input {}'
   },
+  {
+    should: 'support :extends',
+    input: '.foo:extends(.className) {}',
+    expected: ':local(.foo):extends(.className) {}'
+  },
+  {
+    should: 'support imported :extends',
+    input: '.foo:extends(.button from "library/button.css") {}',
+    expected: ':local(.foo):extends(.button from "library/button.css") {}'
+  }
 ];
 
 function process (css, options) {