fix(attributify-jsx): support Template Strings (#3015)

unocss · Aug 25, 2023 · c2d3859 · c2d3859
1 parent eeb59ee
commit c2d3859
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/packages/transformer-attributify-jsx/src/index.ts b/packages/transformer-attributify-jsx/src/index.ts
@@ -37,7 +37,7 @@ export interface TransformerAttributifyJsxOptions {
   exclude?: FilterPattern
 }
 
-const elementRE = /(<\w[\w:\.$-]*\s)((?:'[^>]*?'|"[^>]*?"|`(?:[^>]|[\S])*?`|\{(?:[^>]|[\S])*?\}|[^>]*?)*)/g
+const elementRE = /(<\w[\w:\.$-]*\s)((?:'[^>]*?'|"[^>]*?"|[\{`]([^>]|[\S])*?[\}`]|[^>]*?)*)/g
 const attributeRE = /([a-zA-Z()#][\[?a-zA-Z0-9-_:()#%\]?]*)(?:\s*=\s*((?:'[^']*')|(?:"[^"]*")|\S+))?/g
 const valuedAttributeRE = /((?!\d|-{2}|-\d)[a-zA-Z0-9\u00A0-\uFFFF-_:!%-.~<]+)=(?:["]([^"]*)["]|[']([^']*)[']|[{]((?:[`(](?:[^`)]*)[`)]|[^}])+)[}])/gms
 

diff --git a/test/transformer-attributify-jsx.test.ts b/test/transformer-attributify-jsx.test.ts
@@ -23,6 +23,7 @@ const originalCode = `
         href="https://github.com/unocss/unocss"
         target="_blank"
       ></a>
+      <router-link to={\`/path/\${1}\`}/>
     </div>
   </div>
   <section 
@@ -71,6 +72,7 @@ describe('transformerAttributifyJsx', () => {
               href=\\"https://github.com/unocss/unocss\\"
               target=\\"_blank\\"
             ></a>
+            <router-link to={\`/path/\${1}\`}/>
           </div>
         </div>
         <section 
@@ -116,6 +118,7 @@ describe('transformerAttributifyJsx', () => {
               href=\\"https://github.com/unocss/unocss\\"
               target=\\"_blank\\"
             ></a>
+            <router-link to={\`/path/\${1}\`}/>
           </div>
         </div>
         <section 
@@ -171,6 +174,7 @@ describe('transformerAttributifyJsxBabel', () => {
           </div>
           <div m2=\\"\\" flex=\\"\\" justify-center=\\"\\" text-2xl=\\"\\" op30=\\"\\" hover:op80=\\"\\" hover:text-2xl=\\"\\">
             <a i-carbon-logo-github text-inherit=\\"\\" href=\\"https://github.com/unocss/unocss\\" target=\\"_blank\\"></a>
+            <router-link to={\`/path/\${1}\`} />
           </div>
         </div>
         <section className={cn({
@@ -209,6 +213,7 @@ describe('transformerAttributifyJsxBabel', () => {
           </div>
           <div m2=\\"\\" flex justify-center=\\"\\" text-2xl=\\"\\" op30=\\"\\" hover:op80=\\"\\" hover:text-2xl=\\"\\">
             <a i-carbon-logo-github text-inherit=\\"\\" href=\\"https://github.com/unocss/unocss\\" target=\\"_blank\\"></a>
+            <router-link to={\`/path/\${1}\`} />
           </div>
         </div>
         <section className={cn({