replacing import with value as well

Author: geelen

lib/index.js

@@ -26,9 +26,10 @@ var createImportedName = options && options.createImportedName || function (impo
 };
 
 exports['default'] = function (css) {
-  /* Find any local let rules and store them*/
+  /* Find any @value statements that define locals */
   var translations = {};
-  css.walkAtRules(/^value$/, function (atRule) {
+  css.walkAtRules('value', function (atRule) {
+    if (matchImports.exec(atRule.params)) return;
     var matches = undefined;
     while (matches = matchLet.exec(atRule.params)) {
       var _matches = matches;
@@ -54,9 +55,9 @@ exports['default'] = function (css) {
     });
   });
 
-  /* Find imports and insert ICSS tmp vars */
+  /* Treat @value statements that import them as defining ICSS tmp vars */
   var importAliases = [];
-  css.walkAtRules(/^import(-value)?$/, function (atRule) {
+  css.walkAtRules('value', function (atRule) {
     var matches = matchImports.exec(atRule.params);
     if (matches) {
       var _matches3 = _slicedToArray(matches, 3);

src/index.js

@@ -9,9 +9,10 @@ let importIndex = 0
 let createImportedName = options && options.createImportedName || ((importName/*, path*/) => `i__const_${importName.replace(/\W/g, '_')}_${importIndex++}`)
 
 export default css => {
-  /* Find any local let rules and store them*/
+  /* Find any @value statements that define locals */
   let translations = {}
-  css.walkAtRules(/^value$/, atRule => {
+  css.walkAtRules('value', atRule => {
+    if (matchImports.exec(atRule.params)) return
     let matches
     while (matches = matchLet.exec(atRule.params)) {
       let [/*match*/, key, value] = matches
@@ -29,9 +30,9 @@ export default css => {
     _autoprefixerDisabled: true
   }))
 
-  /* Find imports and insert ICSS tmp vars */
+  /* Treat @value statements that import them as defining ICSS tmp vars */
   let importAliases = []
-  css.walkAtRules(/^import(-value)?$/, atRule => {
+  css.walkAtRules('value', atRule => {
     let matches = matchImports.exec(atRule.params)
     if (matches) {
       let [/*match*/, aliases, path] = matches

test/index.js

@@ -28,20 +28,20 @@ describe('constants', () => {
   })
 
   it('should import a simple constant', () => {
-    test('@import red from "./colors.css";', ':import("./colors.css") {\n  i__const_red_0: red\n}')
+    test('@value red from "./colors.css";', ':import("./colors.css") {\n  i__const_red_0: red\n}')
   })
 
   it('should import a simple constant and replace usages', () => {
-    test('@import red from "./colors.css"; .foo { color: red; }', ':import("./colors.css") {\n  i__const_red_1: red;\n}\n.foo { color: i__const_red_1; }')
+    test('@value red from "./colors.css"; .foo { color: red; }', ':import("./colors.css") {\n  i__const_red_1: red;\n}\n.foo { color: i__const_red_1; }')
   })
 
   it('should import and alias a constant and replace usages', () => {
-    test('@import blue as red from "./colors.css"; .foo { color: red; }', ':import("./colors.css") {\n  i__const_red_2: blue;\n}\n.foo { color: i__const_red_2; }')
+    test('@value blue as red from "./colors.css"; .foo { color: red; }', ':import("./colors.css") {\n  i__const_red_2: blue;\n}\n.foo { color: i__const_red_2; }')
   })
 
   it('should import multiple from a single file', () => {
     test(
-      `@import blue, red from "./colors.css";
+      `@value blue, red from "./colors.css";
 .foo { color: red; }
 .bar { color: blue }`,
       `:import("./colors.css") {
@@ -54,14 +54,14 @@ describe('constants', () => {
 
   it('should import from a definition', () => {
     test(
-      '@value colors: "./colors.css"; @import red from colors;',
+      '@value colors: "./colors.css"; @value red from colors;',
       ':export {\n  colors: "./colors.css"\n}\n' +
       ':import("./colors.css") {\n  i__const_red_5: red\n}'
     )
   })
 
   it('should import a simple constant with import-value', () => {
-    test('@import-value red from "./colors.css";', ':import("./colors.css") {\n  i__const_red_6: red\n}')
+    test('@value red from "./colors.css";', ':import("./colors.css") {\n  i__const_red_6: red\n}')
   })
 })