fix: placeholder failures

Co-Authored-By: James Talmage <[email protected]>

Author: martonlederer

index.js

@@ -3,9 +3,15 @@ const stripIndent = require('strip-indent')
 module.exports = (css, settings) => {
   const sass = getSassImplementation()
   const cssWithPlaceholders = css
+    .replace(/%%styled-jsx-placeholder-(\d+)%%%(\w*\s*[),;!{])/g, (_, id, p1) =>
+      `styled-jsx-percent-placeholder-${id}-${p1}`
+    )
     .replace(/%%styled-jsx-placeholder-(\d+)%%(\w*\s*[),;!{])/g, (_, id, p1) =>
       `styled-jsx-placeholder-${id}-${p1}`
     )
+    .replace(/%%styled-jsx-placeholder-(\d+)%%%/g, (_, id) =>
+      `/*%%styled-jsx-percent-placeholder-${id}%%*/`
+    )
     .replace(/%%styled-jsx-placeholder-(\d+)%%/g, (_, id) =>
       `/*%%styled-jsx-placeholder-${id}%%*/`
     )
@@ -20,9 +26,15 @@ module.exports = (css, settings) => {
     .css.toString()
 
   return preprocessed
+    .replace(/styled-jsx-percent-placeholder-(\d+)-(\w*\s*[),;!{])/g, (_, id, p1) =>
+      `%%styled-jsx-placeholder-${id}%%%${p1}`
+    )
     .replace(/styled-jsx-placeholder-(\d+)-(\w*\s*[),;!{])/g, (_, id, p1) =>
       `%%styled-jsx-placeholder-${id}%%${p1}`
     )
+    .replace(/\/\*%%styled-jsx-percent-placeholder-(\d+)%%\*\//g, (_, id) =>
+      `%%styled-jsx-placeholder-${id}%%%`
+    )
     .replace(/\/\*%%styled-jsx-placeholder-(\d+)%%\*\//g, (_, id) =>
       `%%styled-jsx-placeholder-${id}%%`
     )