@vue/compiler-sfc 3.2.36 → 3.2.37

package/dist/compiler-sfc.cjs.js

@@ -109,8 +109,6 @@ function sum (o) {
 var hashSum = sum;
 
 const CSS_VARS_HELPER = `useCssVars`;
-// match v-bind() with max 2-levels of nested parens.
-const cssVarRE = /v-bind\s*\(((?:[^)(]+|\((?:[^)(]+|\([^)(]*\))*\))*)\)/g;
 function genCssVarsFromList(vars, id, isProd, isSSR = false) {
     return `{\n  ${vars
         .map(key => `"${isSSR ? `--` : ``}${genVarName(id, key, isProd)}": (${key})`)
@@ -132,31 +130,89 @@ function normalizeExpression(exp) {
     }
     return exp;
 }
+const vBindRE = /v-bind\s*\(/g;
 function parseCssVars(sfc) {
     const vars = [];
     sfc.styles.forEach(style => {
         let match;
         // ignore v-bind() in comments /* ... */
         const content = style.content.replace(/\/\*([\s\S]*?)\*\//g, '');
-        while ((match = cssVarRE.exec(content))) {
-            const variable = normalizeExpression(match[1]);
-            if (!vars.includes(variable)) {
-                vars.push(variable);
+        while ((match = vBindRE.exec(content))) {
+            const start = match.index + match[0].length;
+            const end = lexBinding(content, start);
+            if (end !== null) {
+                const variable = normalizeExpression(content.slice(start, end));
+                if (!vars.includes(variable)) {
+                    vars.push(variable);
+                }
             }
         }
     });
     return vars;
 }
+function lexBinding(content, start) {
+    let state = 0 /* inParens */;
+    let parenDepth = 0;
+    for (let i = start; i < content.length; i++) {
+        const char = content.charAt(i);
+        switch (state) {
+            case 0 /* inParens */:
+                if (char === `'`) {
+                    state = 1 /* inSingleQuoteString */;
+                }
+                else if (char === `"`) {
+                    state = 2 /* inDoubleQuoteString */;
+                }
+                else if (char === `(`) {
+                    parenDepth++;
+                }
+                else if (char === `)`) {
+                    if (parenDepth > 0) {
+                        parenDepth--;
+                    }
+                    else {
+                        return i;
+                    }
+                }
+                break;
+            case 1 /* inSingleQuoteString */:
+                if (char === `'`) {
+                    state = 0 /* inParens */;
+                }
+                break;
+            case 2 /* inDoubleQuoteString */:
+                if (char === `"`) {
+                    state = 0 /* inParens */;
+                }
+                break;
+        }
+    }
+    return null;
+}
 const cssVarsPlugin = opts => {
     const { id, isProd } = opts;
     return {
         postcssPlugin: 'vue-sfc-vars',
         Declaration(decl) {
             // rewrite CSS variables
-            if (cssVarRE.test(decl.value)) {
-                decl.value = decl.value.replace(cssVarRE, (_, $1) => {
-                    return `var(--${genVarName(id, normalizeExpression($1), isProd)})`;
-                });
+            const value = decl.value;
+            if (vBindRE.test(value)) {
+                vBindRE.lastIndex = 0;
+                let transformed = '';
+                let lastIndex = 0;
+                let match;
+                while ((match = vBindRE.exec(value))) {
+                    const start = match.index + match[0].length;
+                    const end = lexBinding(value, start);
+                    if (end !== null) {
+                        const variable = normalizeExpression(value.slice(start, end));
+                        transformed +=
+                            value.slice(lastIndex, match.index) +
+                                `var(--${genVarName(id, variable, isProd)})`;
+                        lastIndex = end + 1;
+                    }
+                }
+                decl.value = transformed + value.slice(lastIndex);
             }
         }
     };
@@ -4365,7 +4421,7 @@ function compileScript(sfc, options) {
     if (!hasDefaultExportName && filename && filename !== DEFAULT_FILENAME) {
         const match = filename.match(/([^/\\]+)\.\w+$/);
         if (match) {
-            runtimeOptions += `\n  name: '${match[1]}',`;
+            runtimeOptions += `\n  __name: '${match[1]}',`;
         }
     }
     if (hasInlinedSsrRenderFn) {

package/dist/compiler-sfc.esm-browser.js

@@ -27716,8 +27716,6 @@ function sum (o) {
 var hashSum = sum;
 
 const CSS_VARS_HELPER = `useCssVars`;
-// match v-bind() with max 2-levels of nested parens.
-const cssVarRE = /v-bind\s*\(((?:[^)(]+|\((?:[^)(]+|\([^)(]*\))*\))*)\)/g;
 function genCssVarsFromList(vars, id, isProd, isSSR = false) {
     return `{\n  ${vars
         .map(key => `"${isSSR ? `--` : ``}${genVarName(id, key, isProd)}": (${key})`)
@@ -27739,31 +27737,89 @@ function normalizeExpression(exp) {
     }
     return exp;
 }
+const vBindRE = /v-bind\s*\(/g;
 function parseCssVars(sfc) {
     const vars = [];
     sfc.styles.forEach(style => {
         let match;
         // ignore v-bind() in comments /* ... */
         const content = style.content.replace(/\/\*([\s\S]*?)\*\//g, '');
-        while ((match = cssVarRE.exec(content))) {
-            const variable = normalizeExpression(match[1]);
-            if (!vars.includes(variable)) {
-                vars.push(variable);
+        while ((match = vBindRE.exec(content))) {
+            const start = match.index + match[0].length;
+            const end = lexBinding(content, start);
+            if (end !== null) {
+                const variable = normalizeExpression(content.slice(start, end));
+                if (!vars.includes(variable)) {
+                    vars.push(variable);
+                }
             }
         }
     });
     return vars;
 }
+function lexBinding(content, start) {
+    let state = 0 /* inParens */;
+    let parenDepth = 0;
+    for (let i = start; i < content.length; i++) {
+        const char = content.charAt(i);
+        switch (state) {
+            case 0 /* inParens */:
+                if (char === `'`) {
+                    state = 1 /* inSingleQuoteString */;
+                }
+                else if (char === `"`) {
+                    state = 2 /* inDoubleQuoteString */;
+                }
+                else if (char === `(`) {
+                    parenDepth++;
+                }
+                else if (char === `)`) {
+                    if (parenDepth > 0) {
+                        parenDepth--;
+                    }
+                    else {
+                        return i;
+                    }
+                }
+                break;
+            case 1 /* inSingleQuoteString */:
+                if (char === `'`) {
+                    state = 0 /* inParens */;
+                }
+                break;
+            case 2 /* inDoubleQuoteString */:
+                if (char === `"`) {
+                    state = 0 /* inParens */;
+                }
+                break;
+        }
+    }
+    return null;
+}
 const cssVarsPlugin = opts => {
     const { id, isProd } = opts;
     return {
         postcssPlugin: 'vue-sfc-vars',
         Declaration(decl) {
             // rewrite CSS variables
-            if (cssVarRE.test(decl.value)) {
-                decl.value = decl.value.replace(cssVarRE, (_, $1) => {
-                    return `var(--${genVarName(id, normalizeExpression($1), isProd)})`;
-                });
+            const value = decl.value;
+            if (vBindRE.test(value)) {
+                vBindRE.lastIndex = 0;
+                let transformed = '';
+                let lastIndex = 0;
+                let match;
+                while ((match = vBindRE.exec(value))) {
+                    const start = match.index + match[0].length;
+                    const end = lexBinding(value, start);
+                    if (end !== null) {
+                        const variable = normalizeExpression(value.slice(start, end));
+                        transformed +=
+                            value.slice(lastIndex, match.index) +
+                                `var(--${genVarName(id, variable, isProd)})`;
+                        lastIndex = end + 1;
+                    }
+                }
+                decl.value = transformed + value.slice(lastIndex);
             }
         }
     };
@@ -33484,6 +33540,10 @@ const ssrTransformSlotOutlet = (node, context) => {
             resolveComponentType(parent, context, true) === TRANSITION &&
             parent.children.filter(c => c.type === 1 /* ELEMENT */).length === 1) {
             method = SSR_RENDER_SLOT_INNER;
+            if (!(context.scopeId && context.slotted !== false)) {
+                args.push('null');
+            }
+            args.push('true');
         }
         node.ssrCodegenNode = createCallExpression(context.helper(method), args);
     }
@@ -36378,7 +36438,7 @@ function compileScript(sfc, options) {
     if (!hasDefaultExportName && filename && filename !== DEFAULT_FILENAME) {
         const match = filename.match(/([^/\\]+)\.\w+$/);
         if (match) {
-            runtimeOptions += `\n  name: '${match[1]}',`;
+            runtimeOptions += `\n  __name: '${match[1]}',`;
         }
     }
     if (hasInlinedSsrRenderFn) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vue/compiler-sfc",
-  "version": "3.2.36",
+  "version": "3.2.37",
   "description": "@vue/compiler-sfc",
   "main": "dist/compiler-sfc.cjs.js",
   "module": "dist/compiler-sfc.esm-browser.js",
@@ -33,11 +33,11 @@
   "homepage": "https://github.com/vuejs/core/tree/main/packages/compiler-sfc#readme",
   "dependencies": {
     "@babel/parser": "^7.16.4",
-    "@vue/compiler-core": "3.2.36",
-    "@vue/compiler-dom": "3.2.36",
-    "@vue/compiler-ssr": "3.2.36",
-    "@vue/reactivity-transform": "3.2.36",
-    "@vue/shared": "3.2.36",
+    "@vue/compiler-core": "3.2.37",
+    "@vue/compiler-dom": "3.2.37",
+    "@vue/compiler-ssr": "3.2.37",
+    "@vue/reactivity-transform": "3.2.37",
+    "@vue/shared": "3.2.37",
     "estree-walker": "^2.0.2",
     "magic-string": "^0.25.7",
     "source-map": "^0.6.1",