@vizejs/nuxt 0.159.0 → 0.161.0

package/dist/index.mjs

@@ -7,6 +7,7 @@ import path from "node:path";
 import { createHash } from "node:crypto";
 //#region src/components.ts
 const COMPONENT_CALL_RE = /_?resolveComponent\s*\(\s*["'`]([^"'`]+)["'`]\s*(?:,\s*[^)]+)?\)/g;
+const COMPONENTS_IMPORT_RE = /import\s+(?!type\b)\{([^}]*)\}\s+from\s+(["'])#components\2\s*;?/g;
 const COMPONENT_EXT_RE = /\.(?:[cm]?js|ts|vue)$/;
 const DTS_COMPONENT_RE = /^export const (\w+): (?:LazyComponent<)?typeof import\((["'])(.+?)\2\)(?:\.([A-Za-z_$][\w$]*)|\[['"]([A-Za-z_$][\w$]*)['"]\])>?/;
 const DTS_EXT_RE = /\.d\.ts$/;
@@ -23,6 +24,7 @@ const RUNTIME_COMPONENT_DIRS = [
 	"dist/runtime/components/nuxt4",
 	"runtime/components"
 ];
+const IMPORT_SPECIFIER_RE = /^(type\s+)?([A-Za-z_$][\w$]*)(?:\s+as\s+([A-Za-z_$][\w$]*))?$/;
 function toKebabCase(name) {
 	return name.replace(/([a-z0-9])([A-Z])/g, "$1-$2").replace(/_/g, "-").toLowerCase();
 }
@@ -56,16 +58,70 @@ function detectComponentMode(filePath) {
 	if (CLIENT_COMPONENT_RE.test(filePath)) return "client";
 	if (SERVER_COMPONENT_RE.test(filePath)) return "server";
 }
-function createComponentImport(filePath, exportName, lazy) {
+function normalizeComponentMode(mode) {
+	return mode === "client" || mode === "server" ? mode : void 0;
+}
+function parseComponentImportSpecifier(raw) {
+	const trimmed = raw.trim();
+	if (!trimmed) return null;
+	const match = trimmed.match(IMPORT_SPECIFIER_RE);
+	if (!match) return null;
+	const [, typeKeyword, importedName, localName] = match;
+	return {
+		importedName,
+		localName: localName || importedName,
+		typeOnly: Boolean(typeKeyword)
+	};
+}
+function splitComponentImportSpecifiers(specifiers) {
+	return specifiers.split(",").map((specifier) => specifier.trim()).filter(Boolean);
+}
+function createComponentImport(filePath, exportName, lazy, mode) {
 	const componentImport = {
 		exportName,
 		filePath
 	};
 	if (lazy) componentImport.lazy = true;
-	const mode = detectComponentMode(filePath);
-	if (mode) componentImport.mode = mode;
+	const resolvedMode = normalizeComponentMode(mode) ?? detectComponentMode(filePath);
+	if (resolvedMode) componentImport.mode = resolvedMode;
 	return componentImport;
 }
+function addResolvedComponentBinding(componentImports, resolved, variableName, rawVariableName) {
+	let needsCreateClientOnly = false;
+	let needsDefineAsyncComponent = false;
+	if (resolved.lazy) {
+		needsDefineAsyncComponent = true;
+		const exportAccessor = resolved.exportName === "default" ? "module.default" : `module[${JSON.stringify(resolved.exportName)}]`;
+		if (resolved.mode === "client") {
+			needsCreateClientOnly = true;
+			componentImports.push(`const ${variableName} = __nuxt_define_async_component(() => import(${JSON.stringify(resolved.filePath)}).then((module) => __nuxt_create_client_only(${exportAccessor})));`);
+		} else componentImports.push(`const ${variableName} = __nuxt_define_async_component(() => import(${JSON.stringify(resolved.filePath)}).then((module) => ${exportAccessor}));`);
+		return {
+			needsCreateClientOnly,
+			needsDefineAsyncComponent
+		};
+	}
+	if (resolved.exportName === "default") {
+		if (resolved.mode === "client") {
+			needsCreateClientOnly = true;
+			componentImports.push(`import ${rawVariableName} from ${JSON.stringify(resolved.filePath)};`);
+			componentImports.push(`const ${variableName} = __nuxt_create_client_only(${rawVariableName});`);
+		} else componentImports.push(`import ${variableName} from ${JSON.stringify(resolved.filePath)};`);
+		return {
+			needsCreateClientOnly,
+			needsDefineAsyncComponent
+		};
+	}
+	if (resolved.mode === "client") {
+		needsCreateClientOnly = true;
+		componentImports.push(`import { ${resolved.exportName} as ${rawVariableName} } from ${JSON.stringify(resolved.filePath)};`);
+		componentImports.push(`const ${variableName} = __nuxt_create_client_only(${rawVariableName});`);
+	} else componentImports.push(`import { ${resolved.exportName} as ${variableName} } from ${JSON.stringify(resolved.filePath)};`);
+	return {
+		needsCreateClientOnly,
+		needsDefineAsyncComponent
+	};
+}
 function getNuxtComponentDtsFiles(rootDir, buildDir) {
 	const candidates = [
 		path.join(buildDir, "components.d.ts"),
@@ -153,7 +209,7 @@ function createNuxtComponentResolver(options) {
 	return {
 		register(components) {
 			for (const component of components) {
-				const resolved = createComponentImport(component.filePath, component.export || "default");
+				const resolved = createComponentImport(component.filePath, component.export || "default", false, component.mode);
 				addComponentAlias(registered, component.pascalName, resolved);
 				addComponentAlias(registered, component.kebabName, resolved);
 				addComponentAlias(registered, component.name, resolved);
@@ -175,9 +231,32 @@ function injectNuxtComponentImports(code, resolveComponentImport) {
 	const componentImports = [];
 	const importedComponents = /* @__PURE__ */ new Map();
 	let counter = 0;
+	let importCounter = 0;
 	let needsDefineAsyncComponent = false;
 	let needsCreateClientOnly = false;
-	const nextCode = code.replace(COMPONENT_CALL_RE, (match, name) => {
+	const nextCode = code.replace(COMPONENTS_IMPORT_RE, (match, specifiers) => {
+		const unresolvedSpecifiers = [];
+		let changed = false;
+		for (const rawSpecifier of splitComponentImportSpecifiers(specifiers)) {
+			const specifier = parseComponentImportSpecifier(rawSpecifier);
+			if (!specifier || specifier.typeOnly) {
+				unresolvedSpecifiers.push(rawSpecifier);
+				continue;
+			}
+			const resolved = resolveComponentImport(specifier.importedName);
+			if (!resolved) {
+				unresolvedSpecifiers.push(rawSpecifier);
+				continue;
+			}
+			changed = true;
+			const result = addResolvedComponentBinding(componentImports, resolved, specifier.localName, `__nuxt_import_component_${importCounter++}_raw`);
+			needsCreateClientOnly ||= result.needsCreateClientOnly;
+			needsDefineAsyncComponent ||= result.needsDefineAsyncComponent;
+		}
+		if (!changed) return match;
+		if (unresolvedSpecifiers.length === 0) return "";
+		return `import { ${unresolvedSpecifiers.join(", ")} } from "#components";`;
+	}).replace(COMPONENT_CALL_RE, (match, name) => {
 		const resolved = resolveComponentImport(name);
 		if (!resolved) return match;
 		const importKey = `${resolved.exportName}\u0000${resolved.filePath}\u0000${resolved.lazy ? "lazy" : "eager"}\u0000${resolved.mode ?? "default"}`;
@@ -185,25 +264,9 @@ function injectNuxtComponentImports(code, resolveComponentImport) {
 		if (!variableName) {
 			variableName = `__nuxt_component_${counter++}`;
 			importedComponents.set(importKey, variableName);
-			if (resolved.lazy) {
-				needsDefineAsyncComponent = true;
-				const exportAccessor = resolved.exportName === "default" ? "module.default" : `module[${JSON.stringify(resolved.exportName)}]`;
-				if (resolved.mode === "client") {
-					needsCreateClientOnly = true;
-					componentImports.push(`const ${variableName} = __nuxt_define_async_component(() => import(${JSON.stringify(resolved.filePath)}).then((module) => __nuxt_create_client_only(${exportAccessor})));`);
-				} else componentImports.push(`const ${variableName} = __nuxt_define_async_component(() => import(${JSON.stringify(resolved.filePath)}).then((module) => ${exportAccessor}));`);
-			} else if (resolved.exportName === "default") if (resolved.mode === "client") {
-				needsCreateClientOnly = true;
-				const rawVariableName = `${variableName}_raw`;
-				componentImports.push(`import ${rawVariableName} from ${JSON.stringify(resolved.filePath)};`);
-				componentImports.push(`const ${variableName} = __nuxt_create_client_only(${rawVariableName});`);
-			} else componentImports.push(`import ${variableName} from ${JSON.stringify(resolved.filePath)};`);
-			else if (resolved.mode === "client") {
-				needsCreateClientOnly = true;
-				const rawVariableName = `${variableName}_raw`;
-				componentImports.push(`import { ${resolved.exportName} as ${rawVariableName} } from ${JSON.stringify(resolved.filePath)};`);
-				componentImports.push(`const ${variableName} = __nuxt_create_client_only(${rawVariableName});`);
-			} else componentImports.push(`import { ${resolved.exportName} as ${variableName} } from ${JSON.stringify(resolved.filePath)};`);
+			const result = addResolvedComponentBinding(componentImports, resolved, variableName, `${variableName}_raw`);
+			needsCreateClientOnly ||= result.needsCreateClientOnly;
+			needsDefineAsyncComponent ||= result.needsDefineAsyncComponent;
 		}
 		return variableName;
 	});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vizejs/nuxt",
-  "version": "0.159.0",
+  "version": "0.161.0",
   "description": "Nuxt module for Vize - compiler, musea gallery, linter, and type checker",
   "keywords": [
     "compiler",
@@ -41,10 +41,10 @@
   },
   "dependencies": {
     "@nuxt/kit": "4.4.6",
-    "@vizejs/musea-nuxt": "0.159.0",
-    "@vizejs/vite-plugin": "0.159.0",
-    "@vizejs/vite-plugin-musea": "0.159.0",
-    "vize": "0.159.0"
+    "@vizejs/musea-nuxt": "0.161.0",
+    "@vizejs/vite-plugin": "0.161.0",
+    "@vizejs/vite-plugin-musea": "0.161.0",
+    "vize": "0.161.0"
   },
   "devDependencies": {
     "typescript": "6.0.3",