[fixes #2] more complex transitive values allowed

Author: geelen

lib/index.js

@@ -39,9 +39,8 @@ exports['default'] = function (css) {
       var /*match*/key = _matches2[1];
       var value = _matches2[2];
 
-      // Values can refer to each other
-      if (definitions[value]) value = definitions[value];
-      definitions[key] = value;
+      // Add to the definitions, knowing that values can refer to each other
+      definitions[key] = (0, _icssReplaceSymbols.replaceAll)(definitions, value);
       atRule.remove();
     }
   };

package.json

@@ -34,7 +34,7 @@
     "standard": "^5.3.1"
   },
   "dependencies": {
-    "icss-replace-symbols": "^1.0.1",
+    "icss-replace-symbols": "^1.0.2",
     "postcss": "^5.0.10"
   }
 }

src/index.js

@@ -1,5 +1,5 @@
 import postcss from 'postcss'
-import replaceSymbols from 'icss-replace-symbols'
+import replaceSymbols, { replaceAll } from 'icss-replace-symbols'
 
 const matchImports = /^(.+?)\s+from\s+("[^"]*"|'[^']*'|[\w-]+)$/
 const matchLet = /(?:,\s+|^)([\w-]+):?\s+("[^"]*"|'[^']*'|[^,]+)\s?/g
@@ -16,9 +16,8 @@ export default css => {
     let matches
     while (matches = matchLet.exec(atRule.params)) {
       let [/*match*/, key, value] = matches
-      // Values can refer to each other
-      if (definitions[value]) value = definitions[value]
-      definitions[key] = value
+      // Add to the definitions, knowing that values can refer to each other
+      definitions[key] = replaceAll(definitions, value)
       atRule.remove()
     }
   }

test/index.js

@@ -78,5 +78,12 @@ describe('constants', () => {
       ':export {\n  aaa: red;\n  bbb: red;\n}\n.a { color: red; }'
     )
   })
+
+  it('should allow transitive values within calc', () => {
+    test(
+      '@value base: 10px;\n@value large: calc(base * 2);\n.a { margin: large; }',
+      ':export {\n  base: 10px;\n  large: calc(10px * 2);\n}\n.a { margin: calc(10px * 2); }'
+    )
+  })
 })