Merge pull request erasmo-marin#4 from RusinovAnton/fix-placeholders-for-dynamic-styles

Fix dynamic styles placeholder replacement

Author: erasmo-marin

index.js

@@ -4,12 +4,12 @@ const loopWhile = require("deasync").loopWhile;
 module.exports = (css, settings) => {
     const cssWithPlaceholders = css
         .replace(
-            /\:\s*%%styled-jsx-expression-(\d+)%%/g,
-            (_, id) => `: styled-jsx-expression-${id}()`
+            /\:\s*%%styled-jsx-placeholder-(\d+)%%/g,
+            (_, id) => `: styled-jsx-placeholder-${id}()`
         )
         .replace(
-            /%%styled-jsx-expression-(\d+)%%/g,
-            (_, id) => `/*%%styled-jsx-expression-${id}%%*/`
+            /%%styled-jsx-placeholder-(\d+)%%/g,
+            (_, id) => `/*%%styled-jsx-placeholder-${id}%%*/`
         );
 
     let wait = true;
@@ -31,11 +31,11 @@ module.exports = (css, settings) => {
 
     return preprocessed
         .replace(
-            /\:\s*styled-jsx-expression-(\d+)\(\)/g,
-            (_, id) => `: %%styled-jsx-expression-${id}%%`
+            /\:\s*styled-jsx-placeholder-(\d+)\(\)/g,
+            (_, id) => `: %%styled-jsx-placeholder-${id}%%`
         )
         .replace(
-            /\/\*%%styled-jsx-expression-(\d+)%%\*\//g,
-            (_, id) => `%%styled-jsx-expression-${id}%%`
+            /\/\*%%styled-jsx-placeholder-(\d+)%%\*\//g,
+            (_, id) => `%%styled-jsx-placeholder-${id}%%`
         );
 };

test.js

@@ -21,15 +21,15 @@ describe('styled-jsx-plugin-less', () => {
 
   it('works with expressions placeholders', () => {
     assert.equal(
-      plugin('p { img { display: block } color: %%styled-jsx-expression-1%%; } %%styled-jsx-expression-1%%').trim(),
+      plugin('p { img { display: block } color: %%styled-jsx-placeholder-1%%; } %%styled-jsx-placeholder-1%%').trim(),
       cleanup(`
         p {
-          color: %%styled-jsx-expression-1%%;
+          color: %%styled-jsx-placeholder-1%%;
         }
         p img {
           display: block;
         }
-        %%styled-jsx-expression-1%%
+        %%styled-jsx-placeholder-1%%
       `)
     )
   })