@vue/compiler-sfc 3.3.9 → 3.3.11

package/dist/compiler-sfc.cjs.js

@@ -94,8 +94,11 @@ function getEscapedPropName(key) {
   return propNameEscapeSymbolsRE.test(key) ? JSON.stringify(key) : key;
 }
 const cssVarNameEscapeSymbolsRE = /[ !"#$%&'()*+,./:;<=>?@[\\\]^`{|}~]/g;
-function getEscapedCssVarName(key) {
-  return key.replace(cssVarNameEscapeSymbolsRE, (s) => `\\${s}`);
+function getEscapedCssVarName(key, doubleEscape) {
+  return key.replace(
+    cssVarNameEscapeSymbolsRE,
+    (s) => doubleEscape ? `\\\\${s}` : `\\${s}`
+  );
 }
 
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
@@ -178,15 +181,15 @@ const CSS_VARS_HELPER = `useCssVars`;
 function genCssVarsFromList(vars, id, isProd, isSSR = false) {
   return `{
   ${vars.map(
-    (key) => `"${isSSR ? `--` : ``}${genVarName(id, key, isProd)}": (${key})`
+    (key) => `"${isSSR ? `--` : ``}${genVarName(id, key, isProd, isSSR)}": (${key})`
   ).join(",\n  ")}
 }`;
 }
-function genVarName(id, raw, isProd) {
+function genVarName(id, raw, isProd, isSSR = false) {
   if (isProd) {
     return hash$1(id + raw);
   } else {
-    return `${id}-${getEscapedCssVarName(raw)}`;
+    return `${id}-${getEscapedCssVarName(raw, isSSR)}`;
   }
 }
 function normalizeExpression(exp) {
@@ -1041,6 +1044,37 @@ class LRUCache {
         }
         return deleted;
     }
+    /**
+     * Get the extended info about a given entry, to get its value, size, and
+     * TTL info simultaneously. Like {@link LRUCache#dump}, but just for a
+     * single key. Always returns stale values, if their info is found in the
+     * cache, so be sure to check for expired TTLs if relevant.
+     */
+    info(key) {
+        const i = this.#keyMap.get(key);
+        if (i === undefined)
+            return undefined;
+        const v = this.#valList[i];
+        const value = this.#isBackgroundFetch(v)
+            ? v.__staleWhileFetching
+            : v;
+        if (value === undefined)
+            return undefined;
+        const entry = { value };
+        if (this.#ttls && this.#starts) {
+            const ttl = this.#ttls[i];
+            const start = this.#starts[i];
+            if (ttl && start) {
+                const remain = ttl - (perf.now() - start);
+                entry.ttl = remain;
+                entry.start = Date.now();
+            }
+        }
+        if (this.#sizes) {
+            entry.size = this.#sizes[i];
+        }
+        return entry;
+    }
     /**
      * Return an array of [key, {@link LRUCache.Entry}] tuples which can be
      * passed to cache.load()
@@ -1935,22 +1969,29 @@ function parse$2(source, {
       descriptor.script = null;
     }
   }
+  let templateColumnOffset = 0;
+  if (descriptor.template && (descriptor.template.lang === "pug" || descriptor.template.lang === "jade")) {
+    [descriptor.template.content, templateColumnOffset] = dedent(
+      descriptor.template.content
+    );
+  }
   if (sourceMap) {
-    const genMap = (block) => {
+    const genMap = (block, columnOffset = 0) => {
       if (block && !block.src) {
         block.map = generateSourceMap(
           filename,
           source,
           block.content,
           sourceRoot,
-          !pad || block.type === "template" ? block.loc.start.line - 1 : 0
+          !pad || block.type === "template" ? block.loc.start.line - 1 : 0,
+          columnOffset
         );
       }
     };
-    genMap(descriptor.template);
+    genMap(descriptor.template, templateColumnOffset);
     genMap(descriptor.script);
-    descriptor.styles.forEach(genMap);
-    descriptor.customBlocks.forEach(genMap);
+    descriptor.styles.forEach((s) => genMap(s));
+    descriptor.customBlocks.forEach((s) => genMap(s));
   }
   descriptor.cssVars = parseCssVars(descriptor);
   const slottedRE = /(?:::v-|:)slotted\(/;
@@ -2028,7 +2069,7 @@ function createBlock(node, source, pad) {
 const splitRE = /\r?\n/g;
 const emptyRE = /^(?:\/\/)?\s*$/;
 const replaceRE = /./g;
-function generateSourceMap(filename, source, generated, sourceRoot, lineOffset) {
+function generateSourceMap(filename, source, generated, sourceRoot, lineOffset, columnOffset) {
   const map = new sourceMapJs.SourceMapGenerator({
     file: filename.replace(/\\/g, "/"),
     sourceRoot: sourceRoot.replace(/\\/g, "/")
@@ -2044,7 +2085,7 @@ function generateSourceMap(filename, source, generated, sourceRoot, lineOffset)
             source: filename,
             original: {
               line: originalLine,
-              column: i
+              column: i + columnOffset
             },
             generated: {
               line: generatedLine,
@@ -2095,6 +2136,26 @@ function hmrShouldReload(prevImports, next) {
   }
   return false;
 }
+function dedent(s) {
+  const lines = s.split("\n");
+  const minIndent = lines.reduce(function(minIndent2, line) {
+    var _a, _b;
+    if (line.trim() === "") {
+      return minIndent2;
+    }
+    const indent = ((_b = (_a = line.match(/^\s*/)) == null ? void 0 : _a[0]) == null ? void 0 : _b.length) || 0;
+    return Math.min(indent, minIndent2);
+  }, Infinity);
+  if (minIndent === 0) {
+    return [s, minIndent];
+  }
+  return [
+    lines.map(function(line) {
+      return line.slice(minIndent);
+    }).join("\n"),
+    minIndent
+  ];
+}
 
 function isRelativeUrl(url) {
   const firstChar = url.charAt(0);
@@ -7909,14 +7970,19 @@ function rewriteSelector(id, selector, selectorRoot, slotted = false) {
         return false;
       }
     }
-    if (n.type !== "pseudo" && n.type !== "combinator") {
+    if (n.type !== "pseudo" && n.type !== "combinator" || n.type === "pseudo" && (n.value === ":is" || n.value === ":where")) {
       node = n;
     }
-    if (n.type === "pseudo" && (n.value === ":is" || n.value === ":where")) {
-      rewriteSelector(id, n.nodes[0], selectorRoot, slotted);
+  });
+  if (node) {
+    const { type, value } = node;
+    if (type === "pseudo" && (value === ":is" || value === ":where")) {
+      node.nodes.forEach(
+        (value2) => rewriteSelector(id, value2, selectorRoot, slotted)
+      );
       shouldInject = false;
     }
-  });
+  }
   if (node) {
     node.spaces.after = "";
   } else {
@@ -15606,6 +15672,7 @@ class ScriptCompileContext {
   constructor(descriptor, options) {
     this.descriptor = descriptor;
     this.options = options;
+    this.isCE = false;
     this.source = this.descriptor.source;
     this.filename = this.descriptor.filename;
     this.s = new MagicString(this.source);
@@ -15632,6 +15699,11 @@ class ScriptCompileContext {
     const scriptSetupLang = scriptSetup && scriptSetup.lang;
     this.isJS = scriptLang === "js" || scriptLang === "jsx" || scriptSetupLang === "js" || scriptSetupLang === "jsx";
     this.isTS = scriptLang === "ts" || scriptLang === "tsx" || scriptSetupLang === "ts" || scriptSetupLang === "tsx";
+    const customElement = options.customElement;
+    const filename = this.descriptor.filename;
+    if (customElement) {
+      this.isCE = typeof customElement === "boolean" ? customElement : customElement(filename);
+    }
     const plugins = resolveParserPlugins(
       scriptLang || scriptSetupLang,
       options.babelParserPlugins
@@ -17743,33 +17815,39 @@ class TypeScope {
     this.exportedDeclares = /* @__PURE__ */ Object.create(null);
   }
 }
-function resolveTypeElements(ctx, node, scope) {
+function resolveTypeElements(ctx, node, scope, typeParameters) {
   if (node._resolvedElements) {
     return node._resolvedElements;
   }
   return node._resolvedElements = innerResolveTypeElements(
     ctx,
     node,
-    node._ownerScope || scope || ctxToScope(ctx)
+    node._ownerScope || scope || ctxToScope(ctx),
+    typeParameters
   );
 }
-function innerResolveTypeElements(ctx, node, scope) {
+function innerResolveTypeElements(ctx, node, scope, typeParameters) {
   var _a, _b;
   switch (node.type) {
     case "TSTypeLiteral":
-      return typeElementsToMap(ctx, node.members, scope);
+      return typeElementsToMap(ctx, node.members, scope, typeParameters);
     case "TSInterfaceDeclaration":
-      return resolveInterfaceMembers(ctx, node, scope);
+      return resolveInterfaceMembers(ctx, node, scope, typeParameters);
     case "TSTypeAliasDeclaration":
     case "TSParenthesizedType":
-      return resolveTypeElements(ctx, node.typeAnnotation, scope);
+      return resolveTypeElements(
+        ctx,
+        node.typeAnnotation,
+        scope,
+        typeParameters
+      );
     case "TSFunctionType": {
       return { props: {}, calls: [node] };
     }
     case "TSUnionType":
     case "TSIntersectionType":
       return mergeElements(
-        node.types.map((t) => resolveTypeElements(ctx, t, scope)),
+        node.types.map((t) => resolveTypeElements(ctx, t, scope, typeParameters)),
         node.type
       );
     case "TSMappedType":
@@ -17786,20 +17864,53 @@ function innerResolveTypeElements(ctx, node, scope) {
       const typeName = getReferenceName(node);
       if ((typeName === "ExtractPropTypes" || typeName === "ExtractPublicPropTypes") && node.typeParameters && ((_a = scope.imports[typeName]) == null ? void 0 : _a.source) === "vue") {
         return resolveExtractPropTypes(
-          resolveTypeElements(ctx, node.typeParameters.params[0], scope),
+          resolveTypeElements(
+            ctx,
+            node.typeParameters.params[0],
+            scope,
+            typeParameters
+          ),
           scope
         );
       }
       const resolved = resolveTypeReference(ctx, node, scope);
       if (resolved) {
-        return resolveTypeElements(ctx, resolved, resolved._ownerScope);
+        const typeParams = /* @__PURE__ */ Object.create(null);
+        if ((resolved.type === "TSTypeAliasDeclaration" || resolved.type === "TSInterfaceDeclaration") && resolved.typeParameters && node.typeParameters) {
+          resolved.typeParameters.params.forEach((p, i) => {
+            let param = typeParameters && typeParameters[p.name];
+            if (!param)
+              param = node.typeParameters.params[i];
+            typeParams[p.name] = param;
+          });
+        }
+        return resolveTypeElements(
+          ctx,
+          resolved,
+          resolved._ownerScope,
+          typeParams
+        );
       } else {
         if (typeof typeName === "string") {
+          if (typeParameters && typeParameters[typeName]) {
+            return resolveTypeElements(
+              ctx,
+              typeParameters[typeName],
+              scope,
+              typeParameters
+            );
+          }
           if (
             // @ts-ignore
             SupportedBuiltinsSet.has(typeName)
           ) {
-            return resolveBuiltin(ctx, node, typeName, scope);
+            return resolveBuiltin(
+              ctx,
+              node,
+              typeName,
+              scope,
+              typeParameters
+            );
           } else if (typeName === "ReturnType" && node.typeParameters) {
             const ret = resolveReturnType(
               ctx,
@@ -17848,10 +17959,14 @@ function innerResolveTypeElements(ctx, node, scope) {
   }
   return ctx.error(`Unresolvable type: ${node.type}`, node, scope);
 }
-function typeElementsToMap(ctx, elements, scope = ctxToScope(ctx)) {
+function typeElementsToMap(ctx, elements, scope = ctxToScope(ctx), typeParameters) {
   const res = { props: {} };
   for (const e of elements) {
     if (e.type === "TSPropertySignature" || e.type === "TSMethodSignature") {
+      if (typeParameters) {
+        scope = createChildScope(scope);
+        Object.assign(scope.types, typeParameters);
+      }
       e._ownerScope = scope;
       const name = getId(e.key);
       if (name && !e.computed) {
@@ -17914,8 +18029,13 @@ function createProperty(key, typeAnnotation, scope, optional) {
     _ownerScope: scope
   };
 }
-function resolveInterfaceMembers(ctx, node, scope) {
-  const base = typeElementsToMap(ctx, node.body.body, node._ownerScope);
+function resolveInterfaceMembers(ctx, node, scope, typeParameters) {
+  const base = typeElementsToMap(
+    ctx,
+    node.body.body,
+    node._ownerScope,
+    typeParameters
+  );
   if (node.extends) {
     for (const ext of node.extends) {
       if (ext.leadingComments && ext.leadingComments.some((c) => c.value.includes("@vue-ignore"))) {
@@ -18090,8 +18210,13 @@ const SupportedBuiltinsSet = /* @__PURE__ */ new Set([
   "Pick",
   "Omit"
 ]);
-function resolveBuiltin(ctx, node, name, scope) {
-  const t = resolveTypeElements(ctx, node.typeParameters.params[0], scope);
+function resolveBuiltin(ctx, node, name, scope, typeParameters) {
+  const t = resolveTypeElements(
+    ctx,
+    node.typeParameters.params[0],
+    scope,
+    typeParameters
+  );
   switch (name) {
     case "Partial": {
       const res2 = { props: {}, calls: t.calls };
@@ -18219,7 +18344,21 @@ function resolveGlobalScope(ctx) {
 let ts;
 let loadTS;
 function registerTS(_loadTS) {
-  loadTS = _loadTS;
+  loadTS = () => {
+    try {
+      return _loadTS();
+    } catch (err) {
+      if (typeof err.message === "string" && err.message.includes("Cannot find module")) {
+        throw new Error(
+          'Failed to load TypeScript, which is required for resolving imported types. Please make sure "typescript" is installed as a project dependency.'
+        );
+      } else {
+        throw new Error(
+          "Failed to load TypeScript for resolving imported types."
+        );
+      }
+    }
+  };
 }
 function resolveFS(ctx) {
   if (ctx.fs) {
@@ -18253,7 +18392,12 @@ function resolveTypeFromImport(ctx, node, name, scope) {
   return resolveTypeReference(ctx, node, sourceScope, imported, true);
 }
 function importSourceToScope(ctx, node, scope, source) {
-  const fs = resolveFS(ctx);
+  let fs;
+  try {
+    fs = resolveFS(ctx);
+  } catch (err) {
+    return ctx.error(err.message, node, scope);
+  }
   if (!fs) {
     return ctx.error(
       `No fs option provided to \`compileScript\` in non-Node environment. File system access is required for resolving imported types.`,
@@ -18462,14 +18606,7 @@ function moduleDeclToScope(ctx, node, parentScope) {
   if (node._resolvedChildScope) {
     return node._resolvedChildScope;
   }
-  const scope = new TypeScope(
-    parentScope.filename,
-    parentScope.source,
-    parentScope.offset,
-    Object.create(parentScope.imports),
-    Object.create(parentScope.types),
-    Object.create(parentScope.declares)
-  );
+  const scope = createChildScope(parentScope);
   if (node.body.type === "TSModuleDeclaration") {
     const decl = node.body;
     decl._ownerScope = scope;
@@ -18480,6 +18617,16 @@ function moduleDeclToScope(ctx, node, parentScope) {
   }
   return node._resolvedChildScope = scope;
 }
+function createChildScope(parentScope) {
+  return new TypeScope(
+    parentScope.filename,
+    parentScope.source,
+    parentScope.offset,
+    Object.create(parentScope.imports),
+    Object.create(parentScope.types),
+    Object.create(parentScope.declares)
+  );
+}
 const importExportRE = /^Import|^Export/;
 function recordTypes(ctx, body, scope, asGlobal = false) {
   const { types, declares, exportedTypes, exportedDeclares, imports } = scope;
@@ -18601,7 +18748,7 @@ function recordType(node, types, declares, overwriteId) {
         types[overwriteId || getId(node.id)] = node;
       break;
     case "TSTypeAliasDeclaration":
-      types[node.id.name] = node.typeAnnotation;
+      types[node.id.name] = node.typeParameters ? node : node.typeAnnotation;
       break;
     case "TSDeclareFunction":
       if (node.id)
@@ -19141,7 +19288,7 @@ function genRuntimeProps(ctx) {
           );
       }
       if (defaults.length) {
-        propsDecls = `${ctx.helper(
+        propsDecls = `/*#__PURE__*/${ctx.helper(
           `mergeDefaults`
         )}(${propsDecls}, {
   ${defaults.join(",\n  ")}
@@ -19153,7 +19300,9 @@ function genRuntimeProps(ctx) {
   }
   const modelsDecls = genModelProps(ctx);
   if (propsDecls && modelsDecls) {
-    return `${ctx.helper("mergeModels")}(${propsDecls}, ${modelsDecls})`;
+    return `/*#__PURE__*/${ctx.helper(
+      "mergeModels"
+    )}(${propsDecls}, ${modelsDecls})`;
   } else {
     return modelsDecls || propsDecls;
   }
@@ -19175,9 +19324,9 @@ function genRuntimePropsFromTypes(ctx) {
     ${propStrings.join(",\n    ")}
   }`;
   if (ctx.propsRuntimeDefaults && !hasStaticDefaults) {
-    propsDecls = `${ctx.helper("mergeDefaults")}(${propsDecls}, ${ctx.getString(
-      ctx.propsRuntimeDefaults
-    )})`;
+    propsDecls = `/*#__PURE__*/${ctx.helper(
+      "mergeDefaults"
+    )}(${propsDecls}, ${ctx.getString(ctx.propsRuntimeDefaults)})`;
   }
   return propsDecls;
 }
@@ -19242,6 +19391,15 @@ function genRuntimePropFromType(ctx, { key, required, type, skipCheck }, hasStat
       defaultString
     ])} }`;
   } else {
+    if (ctx.isCE) {
+      if (defaultString) {
+        return `${finalKey}: ${`{ ${defaultString}, type: ${toRuntimeTypeString(
+          type
+        )} }`}`;
+      } else {
+        return `${finalKey}: {type: ${toRuntimeTypeString(type)}}`;
+      }
+    }
     return `${finalKey}: ${defaultString ? `{ ${defaultString} }` : `{}`}`;
   }
 }
@@ -19514,7 +19672,9 @@ function genRuntimeEmits(ctx) {
   }
   if (ctx.hasDefineModelCall) {
     let modelEmitsDecl = `[${Object.keys(ctx.modelDecls).map((n) => JSON.stringify(`update:${n}`)).join(", ")}]`;
-    emitsDecl = emitsDecl ? `${ctx.helper("mergeModels")}(${emitsDecl}, ${modelEmitsDecl})` : modelEmitsDecl;
+    emitsDecl = emitsDecl ? `/*#__PURE__*/${ctx.helper(
+      "mergeModels"
+    )}(${emitsDecl}, ${modelEmitsDecl})` : modelEmitsDecl;
   }
   return emitsDecl;
 }
@@ -20484,7 +20644,7 @@ function isStaticNode(node) {
   return false;
 }
 
-const version = "3.3.9";
+const version = "3.3.11";
 const parseCache = parseCache$1;
 const walk = estreeWalker.walk;
 

package/dist/compiler-sfc.d.ts

@@ -144,6 +144,10 @@ export interface SFCScriptCompileOptions {
      * using it, disable this and switch to the [Vue Macros implementation](https://vue-macros.sxzz.moe/features/reactivity-transform.html).
      */
     reactivityTransform?: boolean;
+    /**
+     * Transform Vue SFCs into custom elements.
+     */
+    customElement?: boolean | ((filename: string) => boolean);
 }
 interface ImportBinding {
     isType: boolean;
@@ -355,6 +359,7 @@ export declare class ScriptCompileContext {
     options: Partial<SFCScriptCompileOptions>;
     isJS: boolean;
     isTS: boolean;
+    isCE: boolean;
     scriptAst: Program | null;
     scriptSetupAst: Program | null;
     source: string;
@@ -455,7 +460,7 @@ interface ResolvedElements {
  */
 export declare function resolveTypeElements(ctx: TypeResolveContext, node: Node & MaybeWithScope & {
     _resolvedElements?: ResolvedElements;
-}, scope?: TypeScope): ResolvedElements;
+}, scope?: TypeScope, typeParameters?: Record<string, Node>): ResolvedElements;
 /**
  * @private
  */

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

@@ -11,8 +11,8 @@ const EMPTY_OBJ = Object.freeze({}) ;
 const NOOP = () => {
 };
 const NO = () => false;
-const onRE = /^on[^a-z]/;
-const isOn = (key) => onRE.test(key);
+const isOn = (key) => key.charCodeAt(0) === 111 && key.charCodeAt(1) === 110 && // uppercase letter
+(key.charCodeAt(2) > 122 || key.charCodeAt(2) < 97);
 const extend = Object.assign;
 const hasOwnProperty$3 = Object.prototype.hasOwnProperty;
 const hasOwn = (val, key) => hasOwnProperty$3.call(val, key);
@@ -275,20 +275,29 @@ const replacer = (_key, val) => {
     return replacer(_key, val.value);
   } else if (isMap(val)) {
     return {
-      [`Map(${val.size})`]: [...val.entries()].reduce((entries, [key, val2]) => {
-        entries[`${key} =>`] = val2;
-        return entries;
-      }, {})
+      [`Map(${val.size})`]: [...val.entries()].reduce(
+        (entries, [key, val2], i) => {
+          entries[stringifySymbol(key, i) + " =>"] = val2;
+          return entries;
+        },
+        {}
+      )
     };
   } else if (isSet(val)) {
     return {
-      [`Set(${val.size})`]: [...val.values()]
+      [`Set(${val.size})`]: [...val.values()].map((v) => stringifySymbol(v))
     };
+  } else if (isSymbol$1(val)) {
+    return stringifySymbol(val);
   } else if (isObject$2(val) && !isArray$3(val) && !isPlainObject(val)) {
     return String(val);
   }
   return val;
 };
+const stringifySymbol = (v, i = "") => {
+  var _a;
+  return isSymbol$1(v) ? `Symbol(${(_a = v.description) != null ? _a : i})` : v;
+};
 
 function defaultOnError(error) {
   throw error;
@@ -22483,6 +22492,10 @@ function resolveSetupReference(name, context) {
       `${context.helperString(UNREF)}(${fromMaybeRef})`
     ) : `$setup[${JSON.stringify(fromMaybeRef)}]`;
   }
+  const fromProps = checkType("props");
+  if (fromProps) {
+    return `${context.helperString(UNREF)}(${context.inline ? "__props" : "$props"}[${JSON.stringify(fromProps)}])`;
+  }
 }
 function buildProps(node, context, props = node.props, isComponent, isDynamicComponent, ssr = false) {
   const { tag, loc: elementLoc, children } = node;
@@ -22523,6 +22536,9 @@ function buildProps(node, context, props = node.props, isComponent, isDynamicCom
       if (isEventHandler && isReservedProp(name)) {
         hasVnodeHook = true;
       }
+      if (isEventHandler && value.type === 14) {
+        value = value.arguments[0];
+      }
       if (value.type === 20 || (value.type === 4 || value.type === 8) && getConstantType(value, context) > 0) {
         return;
       }
@@ -26842,8 +26858,11 @@ function getEscapedPropName(key) {
   return propNameEscapeSymbolsRE.test(key) ? JSON.stringify(key) : key;
 }
 const cssVarNameEscapeSymbolsRE = /[ !"#$%&'()*+,./:;<=>?@[\\\]^`{|}~]/g;
-function getEscapedCssVarName(key) {
-  return key.replace(cssVarNameEscapeSymbolsRE, (s) => `\\${s}`);
+function getEscapedCssVarName(key, doubleEscape) {
+  return key.replace(
+    cssVarNameEscapeSymbolsRE,
+    (s) => doubleEscape ? `\\\\${s}` : `\\${s}`
+  );
 }
 
 function pad$1 (hash, len) {
@@ -26920,15 +26939,15 @@ const CSS_VARS_HELPER = `useCssVars`;
 function genCssVarsFromList(vars, id, isProd, isSSR = false) {
   return `{
   ${vars.map(
-    (key) => `"${isSSR ? `--` : ``}${genVarName(id, key, isProd)}": (${key})`
+    (key) => `"${isSSR ? `--` : ``}${genVarName(id, key, isProd, isSSR)}": (${key})`
   ).join(",\n  ")}
 }`;
 }
-function genVarName(id, raw, isProd) {
+function genVarName(id, raw, isProd, isSSR = false) {
   if (isProd) {
     return hash(id + raw);
   } else {
-    return `${id}-${getEscapedCssVarName(raw)}`;
+    return `${id}-${getEscapedCssVarName(raw, isSSR)}`;
   }
 }
 function normalizeExpression(exp) {
@@ -27516,22 +27535,29 @@ function parse$7(source, {
       descriptor.script = null;
     }
   }
+  let templateColumnOffset = 0;
+  if (descriptor.template && (descriptor.template.lang === "pug" || descriptor.template.lang === "jade")) {
+    [descriptor.template.content, templateColumnOffset] = dedent(
+      descriptor.template.content
+    );
+  }
   if (sourceMap) {
-    const genMap = (block) => {
+    const genMap = (block, columnOffset = 0) => {
       if (block && !block.src) {
         block.map = generateSourceMap(
           filename,
           source,
           block.content,
           sourceRoot,
-          !pad || block.type === "template" ? block.loc.start.line - 1 : 0
+          !pad || block.type === "template" ? block.loc.start.line - 1 : 0,
+          columnOffset
         );
       }
     };
-    genMap(descriptor.template);
+    genMap(descriptor.template, templateColumnOffset);
     genMap(descriptor.script);
-    descriptor.styles.forEach(genMap);
-    descriptor.customBlocks.forEach(genMap);
+    descriptor.styles.forEach((s) => genMap(s));
+    descriptor.customBlocks.forEach((s) => genMap(s));
   }
   descriptor.cssVars = parseCssVars(descriptor);
   const slottedRE = /(?:::v-|:)slotted\(/;
@@ -27609,7 +27635,7 @@ function createBlock(node, source, pad) {
 const splitRE = /\r?\n/g;
 const emptyRE = /^(?:\/\/)?\s*$/;
 const replaceRE = /./g;
-function generateSourceMap(filename, source, generated, sourceRoot, lineOffset) {
+function generateSourceMap(filename, source, generated, sourceRoot, lineOffset, columnOffset) {
   const map = new SourceMapGenerator$6({
     file: filename.replace(/\\/g, "/"),
     sourceRoot: sourceRoot.replace(/\\/g, "/")
@@ -27625,7 +27651,7 @@ function generateSourceMap(filename, source, generated, sourceRoot, lineOffset)
             source: filename,
             original: {
               line: originalLine,
-              column: i
+              column: i + columnOffset
             },
             generated: {
               line: generatedLine,
@@ -27676,6 +27702,26 @@ function hmrShouldReload(prevImports, next) {
   }
   return false;
 }
+function dedent(s) {
+  const lines = s.split("\n");
+  const minIndent = lines.reduce(function(minIndent2, line) {
+    var _a, _b;
+    if (line.trim() === "") {
+      return minIndent2;
+    }
+    const indent = ((_b = (_a = line.match(/^\s*/)) == null ? void 0 : _a[0]) == null ? void 0 : _b.length) || 0;
+    return Math.min(indent, minIndent2);
+  }, Infinity);
+  if (minIndent === 0) {
+    return [s, minIndent];
+  }
+  return [
+    lines.map(function(line) {
+      return line.slice(minIndent);
+    }).join("\n"),
+    minIndent
+  ];
+}
 
 /*! https://mths.be/punycode v1.4.1 by @mathias */
 
@@ -37602,7 +37648,7 @@ let Root$2 = root$2;
 
 let Processor$1 = class Processor {
   constructor(plugins = []) {
-    this.version = '8.4.31';
+    this.version = '8.4.32';
     this.plugins = this.normalize(plugins);
   }
 
@@ -41394,14 +41440,19 @@ function rewriteSelector(id, selector, selectorRoot, slotted = false) {
         return false;
       }
     }
-    if (n.type !== "pseudo" && n.type !== "combinator") {
+    if (n.type !== "pseudo" && n.type !== "combinator" || n.type === "pseudo" && (n.value === ":is" || n.value === ":where")) {
       node = n;
     }
-    if (n.type === "pseudo" && (n.value === ":is" || n.value === ":where")) {
-      rewriteSelector(id, n.nodes[0], selectorRoot, slotted);
+  });
+  if (node) {
+    const { type, value } = node;
+    if (type === "pseudo" && (value === ":is" || value === ":where")) {
+      node.nodes.forEach(
+        (value2) => rewriteSelector(id, value2, selectorRoot, slotted)
+      );
       shouldInject = false;
     }
-  });
+  }
   if (node) {
     node.spaces.after = "";
   } else {
@@ -47006,6 +47057,7 @@ class ScriptCompileContext {
   constructor(descriptor, options) {
     this.descriptor = descriptor;
     this.options = options;
+    this.isCE = false;
     this.source = this.descriptor.source;
     this.filename = this.descriptor.filename;
     this.s = new MagicString(this.source);
@@ -47032,6 +47084,11 @@ class ScriptCompileContext {
     const scriptSetupLang = scriptSetup && scriptSetup.lang;
     this.isJS = scriptLang === "js" || scriptLang === "jsx" || scriptSetupLang === "js" || scriptSetupLang === "jsx";
     this.isTS = scriptLang === "ts" || scriptLang === "tsx" || scriptSetupLang === "ts" || scriptSetupLang === "tsx";
+    const customElement = options.customElement;
+    const filename = this.descriptor.filename;
+    if (customElement) {
+      this.isCE = typeof customElement === "boolean" ? customElement : customElement(filename);
+    }
     const plugins = resolveParserPlugins(
       scriptLang || scriptSetupLang,
       options.babelParserPlugins
@@ -47130,33 +47187,39 @@ class TypeScope {
     this.exportedDeclares = /* @__PURE__ */ Object.create(null);
   }
 }
-function resolveTypeElements(ctx, node, scope) {
+function resolveTypeElements(ctx, node, scope, typeParameters) {
   if (node._resolvedElements) {
     return node._resolvedElements;
   }
   return node._resolvedElements = innerResolveTypeElements(
     ctx,
     node,
-    node._ownerScope || scope || ctxToScope(ctx)
+    node._ownerScope || scope || ctxToScope(ctx),
+    typeParameters
   );
 }
-function innerResolveTypeElements(ctx, node, scope) {
+function innerResolveTypeElements(ctx, node, scope, typeParameters) {
   var _a, _b;
   switch (node.type) {
     case "TSTypeLiteral":
-      return typeElementsToMap(ctx, node.members, scope);
+      return typeElementsToMap(ctx, node.members, scope, typeParameters);
     case "TSInterfaceDeclaration":
-      return resolveInterfaceMembers(ctx, node, scope);
+      return resolveInterfaceMembers(ctx, node, scope, typeParameters);
     case "TSTypeAliasDeclaration":
     case "TSParenthesizedType":
-      return resolveTypeElements(ctx, node.typeAnnotation, scope);
+      return resolveTypeElements(
+        ctx,
+        node.typeAnnotation,
+        scope,
+        typeParameters
+      );
     case "TSFunctionType": {
       return { props: {}, calls: [node] };
     }
     case "TSUnionType":
     case "TSIntersectionType":
       return mergeElements(
-        node.types.map((t) => resolveTypeElements(ctx, t, scope)),
+        node.types.map((t) => resolveTypeElements(ctx, t, scope, typeParameters)),
         node.type
       );
     case "TSMappedType":
@@ -47173,20 +47236,53 @@ function innerResolveTypeElements(ctx, node, scope) {
       const typeName = getReferenceName(node);
       if ((typeName === "ExtractPropTypes" || typeName === "ExtractPublicPropTypes") && node.typeParameters && ((_a = scope.imports[typeName]) == null ? void 0 : _a.source) === "vue") {
         return resolveExtractPropTypes(
-          resolveTypeElements(ctx, node.typeParameters.params[0], scope),
+          resolveTypeElements(
+            ctx,
+            node.typeParameters.params[0],
+            scope,
+            typeParameters
+          ),
           scope
         );
       }
       const resolved = resolveTypeReference(ctx, node, scope);
       if (resolved) {
-        return resolveTypeElements(ctx, resolved, resolved._ownerScope);
+        const typeParams = /* @__PURE__ */ Object.create(null);
+        if ((resolved.type === "TSTypeAliasDeclaration" || resolved.type === "TSInterfaceDeclaration") && resolved.typeParameters && node.typeParameters) {
+          resolved.typeParameters.params.forEach((p, i) => {
+            let param = typeParameters && typeParameters[p.name];
+            if (!param)
+              param = node.typeParameters.params[i];
+            typeParams[p.name] = param;
+          });
+        }
+        return resolveTypeElements(
+          ctx,
+          resolved,
+          resolved._ownerScope,
+          typeParams
+        );
       } else {
         if (typeof typeName === "string") {
+          if (typeParameters && typeParameters[typeName]) {
+            return resolveTypeElements(
+              ctx,
+              typeParameters[typeName],
+              scope,
+              typeParameters
+            );
+          }
           if (
             // @ts-ignore
             SupportedBuiltinsSet.has(typeName)
           ) {
-            return resolveBuiltin(ctx, node, typeName, scope);
+            return resolveBuiltin(
+              ctx,
+              node,
+              typeName,
+              scope,
+              typeParameters
+            );
           } else if (typeName === "ReturnType" && node.typeParameters) {
             const ret = resolveReturnType(
               ctx,
@@ -47235,10 +47331,14 @@ function innerResolveTypeElements(ctx, node, scope) {
   }
   return ctx.error(`Unresolvable type: ${node.type}`, node, scope);
 }
-function typeElementsToMap(ctx, elements, scope = ctxToScope(ctx)) {
+function typeElementsToMap(ctx, elements, scope = ctxToScope(ctx), typeParameters) {
   const res = { props: {} };
   for (const e of elements) {
     if (e.type === "TSPropertySignature" || e.type === "TSMethodSignature") {
+      if (typeParameters) {
+        scope = createChildScope(scope);
+        Object.assign(scope.types, typeParameters);
+      }
       e._ownerScope = scope;
       const name = getId(e.key);
       if (name && !e.computed) {
@@ -47301,8 +47401,13 @@ function createProperty(key, typeAnnotation, scope, optional) {
     _ownerScope: scope
   };
 }
-function resolveInterfaceMembers(ctx, node, scope) {
-  const base = typeElementsToMap(ctx, node.body.body, node._ownerScope);
+function resolveInterfaceMembers(ctx, node, scope, typeParameters) {
+  const base = typeElementsToMap(
+    ctx,
+    node.body.body,
+    node._ownerScope,
+    typeParameters
+  );
   if (node.extends) {
     for (const ext of node.extends) {
       if (ext.leadingComments && ext.leadingComments.some((c) => c.value.includes("@vue-ignore"))) {
@@ -47476,8 +47581,13 @@ const SupportedBuiltinsSet = /* @__PURE__ */ new Set([
   "Pick",
   "Omit"
 ]);
-function resolveBuiltin(ctx, node, name, scope) {
-  const t = resolveTypeElements(ctx, node.typeParameters.params[0], scope);
+function resolveBuiltin(ctx, node, name, scope, typeParameters) {
+  const t = resolveTypeElements(
+    ctx,
+    node.typeParameters.params[0],
+    scope,
+    typeParameters
+  );
   switch (name) {
     case "Partial": {
       const res2 = { props: {}, calls: t.calls };
@@ -47605,7 +47715,21 @@ function resolveGlobalScope(ctx) {
 let ts;
 let loadTS;
 function registerTS(_loadTS) {
-  loadTS = _loadTS;
+  loadTS = () => {
+    try {
+      return _loadTS();
+    } catch (err) {
+      if (typeof err.message === "string" && err.message.includes("Cannot find module")) {
+        throw new Error(
+          'Failed to load TypeScript, which is required for resolving imported types. Please make sure "typescript" is installed as a project dependency.'
+        );
+      } else {
+        throw new Error(
+          "Failed to load TypeScript for resolving imported types."
+        );
+      }
+    }
+  };
 }
 function resolveFS(ctx) {
   if (ctx.fs) {
@@ -47639,7 +47763,12 @@ function resolveTypeFromImport(ctx, node, name, scope) {
   return resolveTypeReference(ctx, node, sourceScope, imported, true);
 }
 function importSourceToScope(ctx, node, scope, source) {
-  const fs = resolveFS(ctx);
+  let fs;
+  try {
+    fs = resolveFS(ctx);
+  } catch (err) {
+    return ctx.error(err.message, node, scope);
+  }
   if (!fs) {
     return ctx.error(
       `No fs option provided to \`compileScript\` in non-Node environment. File system access is required for resolving imported types.`,
@@ -47764,14 +47893,7 @@ function moduleDeclToScope(ctx, node, parentScope) {
   if (node._resolvedChildScope) {
     return node._resolvedChildScope;
   }
-  const scope = new TypeScope(
-    parentScope.filename,
-    parentScope.source,
-    parentScope.offset,
-    Object.create(parentScope.imports),
-    Object.create(parentScope.types),
-    Object.create(parentScope.declares)
-  );
+  const scope = createChildScope(parentScope);
   if (node.body.type === "TSModuleDeclaration") {
     const decl = node.body;
     decl._ownerScope = scope;
@@ -47782,6 +47904,16 @@ function moduleDeclToScope(ctx, node, parentScope) {
   }
   return node._resolvedChildScope = scope;
 }
+function createChildScope(parentScope) {
+  return new TypeScope(
+    parentScope.filename,
+    parentScope.source,
+    parentScope.offset,
+    Object.create(parentScope.imports),
+    Object.create(parentScope.types),
+    Object.create(parentScope.declares)
+  );
+}
 const importExportRE = /^Import|^Export/;
 function recordTypes(ctx, body, scope, asGlobal = false) {
   const { types, declares, exportedTypes, exportedDeclares, imports } = scope;
@@ -47903,7 +48035,7 @@ function recordType(node, types, declares, overwriteId) {
         types[overwriteId || getId(node.id)] = node;
       break;
     case "TSTypeAliasDeclaration":
-      types[node.id.name] = node.typeAnnotation;
+      types[node.id.name] = node.typeParameters ? node : node.typeAnnotation;
       break;
     case "TSDeclareFunction":
       if (node.id)
@@ -48443,7 +48575,7 @@ function genRuntimeProps(ctx) {
           );
       }
       if (defaults.length) {
-        propsDecls = `${ctx.helper(
+        propsDecls = `/*#__PURE__*/${ctx.helper(
           `mergeDefaults`
         )}(${propsDecls}, {
   ${defaults.join(",\n  ")}
@@ -48455,7 +48587,9 @@ function genRuntimeProps(ctx) {
   }
   const modelsDecls = genModelProps(ctx);
   if (propsDecls && modelsDecls) {
-    return `${ctx.helper("mergeModels")}(${propsDecls}, ${modelsDecls})`;
+    return `/*#__PURE__*/${ctx.helper(
+      "mergeModels"
+    )}(${propsDecls}, ${modelsDecls})`;
   } else {
     return modelsDecls || propsDecls;
   }
@@ -48477,9 +48611,9 @@ function genRuntimePropsFromTypes(ctx) {
     ${propStrings.join(",\n    ")}
   }`;
   if (ctx.propsRuntimeDefaults && !hasStaticDefaults) {
-    propsDecls = `${ctx.helper("mergeDefaults")}(${propsDecls}, ${ctx.getString(
-      ctx.propsRuntimeDefaults
-    )})`;
+    propsDecls = `/*#__PURE__*/${ctx.helper(
+      "mergeDefaults"
+    )}(${propsDecls}, ${ctx.getString(ctx.propsRuntimeDefaults)})`;
   }
   return propsDecls;
 }
@@ -48544,6 +48678,15 @@ function genRuntimePropFromType(ctx, { key, required, type, skipCheck }, hasStat
       defaultString
     ])} }`;
   } else {
+    if (ctx.isCE) {
+      if (defaultString) {
+        return `${finalKey}: ${`{ ${defaultString}, type: ${toRuntimeTypeString(
+          type
+        )} }`}`;
+      } else {
+        return `${finalKey}: {type: ${toRuntimeTypeString(type)}}`;
+      }
+    }
     return `${finalKey}: ${defaultString ? `{ ${defaultString} }` : `{}`}`;
   }
 }
@@ -48816,7 +48959,9 @@ function genRuntimeEmits(ctx) {
   }
   if (ctx.hasDefineModelCall) {
     let modelEmitsDecl = `[${Object.keys(ctx.modelDecls).map((n) => JSON.stringify(`update:${n}`)).join(", ")}]`;
-    emitsDecl = emitsDecl ? `${ctx.helper("mergeModels")}(${emitsDecl}, ${modelEmitsDecl})` : modelEmitsDecl;
+    emitsDecl = emitsDecl ? `/*#__PURE__*/${ctx.helper(
+      "mergeModels"
+    )}(${emitsDecl}, ${modelEmitsDecl})` : modelEmitsDecl;
   }
   return emitsDecl;
 }
@@ -49800,7 +49945,7 @@ function isStaticNode(node) {
   return false;
 }
 
-const version = "3.3.9";
+const version = "3.3.11";
 const parseCache = parseCache$1;
 const walk = walk$1;
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vue/compiler-sfc",
-  "version": "3.3.9",
+  "version": "3.3.11",
   "description": "@vue/compiler-sfc",
   "main": "dist/compiler-sfc.cjs.js",
   "module": "dist/compiler-sfc.esm-browser.js",
@@ -32,22 +32,22 @@
   },
   "homepage": "https://github.com/vuejs/core/tree/main/packages/compiler-sfc#readme",
   "dependencies": {
-    "@babel/parser": "^7.23.3",
+    "@babel/parser": "^7.23.5",
     "estree-walker": "^2.0.2",
     "magic-string": "^0.30.5",
-    "postcss": "^8.4.31",
+    "postcss": "^8.4.32",
     "source-map-js": "^1.0.2",
-    "@vue/compiler-core": "3.3.9",
-    "@vue/compiler-dom": "3.3.9",
-    "@vue/reactivity-transform": "3.3.9",
-    "@vue/shared": "3.3.9",
-    "@vue/compiler-ssr": "3.3.9"
+    "@vue/compiler-dom": "3.3.11",
+    "@vue/compiler-ssr": "3.3.11",
+    "@vue/shared": "3.3.11",
+    "@vue/compiler-core": "3.3.11",
+    "@vue/reactivity-transform": "3.3.11"
   },
   "devDependencies": {
-    "@babel/types": "^7.23.3",
+    "@babel/types": "^7.23.5",
     "@vue/consolidate": "^0.17.3",
     "hash-sum": "^2.0.0",
-    "lru-cache": "^10.0.3",
+    "lru-cache": "^10.1.0",
     "merge-source-map": "^1.1.0",
     "minimatch": "^9.0.3",
     "postcss-modules": "^4.3.1",