@vizejs/unplugin 0.204.0 → 0.210.0

package/dist/babel.d.mts

@@ -1,4 +1,4 @@
-import { r as VizeUnpluginOptions } from "./types-B13SJWBj.mjs";
+import { r as VizeUnpluginOptions } from "./types-CgwReHH2.mjs";
 
 //#region src/babel.d.ts
 type BabelParserOptions = Record<string, unknown> & {

package/dist/babel.mjs

@@ -1,4 +1,4 @@
-import { a as createFilter, i as generateOutput, r as compileVueModule, t as normalizeOptions } from "./unplugin-BvkszWH0.mjs";
+import { a as createFilter, i as generateOutput, r as compileVueModule, t as normalizeOptions } from "./unplugin-BBdWoA7s.mjs";
 //#region src/babel.ts
 function vizeBabelPlugin(_api, rawOptions = {}) {
 	const options = normalizeOptions(rawOptions);

package/dist/esbuild.d.mts

@@ -1,4 +1,4 @@
-import { r as VizeUnpluginOptions } from "./types-B13SJWBj.mjs";
+import { r as VizeUnpluginOptions } from "./types-CgwReHH2.mjs";
 import * as _$unplugin from "unplugin";
 
 //#region src/esbuild.d.ts

package/dist/esbuild.mjs

@@ -1,4 +1,4 @@
-import { n as vizeUnplugin } from "./unplugin-BvkszWH0.mjs";
+import { n as vizeUnplugin } from "./unplugin-BBdWoA7s.mjs";
 //#region src/esbuild.ts
 var esbuild_default = vizeUnplugin.esbuild;
 //#endregion

package/dist/index.d.mts

@@ -1,4 +1,4 @@
-import { i as VizeVueVersion, n as VizeCompatibilityOptions, r as VizeUnpluginOptions, t as MacroArtifact } from "./types-B13SJWBj.mjs";
+import { i as VizeVueVersion, n as VizeCompatibilityOptions, r as VizeUnpluginOptions, t as MacroArtifact } from "./types-CgwReHH2.mjs";
 import * as _$unplugin from "unplugin";
 //#region src/unplugin.d.ts
 declare const vizeUnplugin: _$unplugin.UnpluginInstance<VizeUnpluginOptions | undefined, boolean>;

package/dist/index.mjs

@@ -1,2 +1,2 @@
-import { n as vizeUnplugin } from "./unplugin-BvkszWH0.mjs";
+import { n as vizeUnplugin } from "./unplugin-BBdWoA7s.mjs";
 export { vizeUnplugin as default, vizeUnplugin };

package/dist/rolldown.d.mts

@@ -1,4 +1,4 @@
-import { r as VizeUnpluginOptions } from "./types-B13SJWBj.mjs";
+import { r as VizeUnpluginOptions } from "./types-CgwReHH2.mjs";
 import * as _$unplugin from "unplugin";
 
 //#region src/rolldown.d.ts

package/dist/rolldown.mjs

@@ -1,4 +1,4 @@
-import { n as vizeUnplugin } from "./unplugin-BvkszWH0.mjs";
+import { n as vizeUnplugin } from "./unplugin-BBdWoA7s.mjs";
 //#region src/rolldown.ts
 var rolldown_default = vizeUnplugin.rollup;
 //#endregion

package/dist/rollup.d.mts

@@ -1,4 +1,4 @@
-import { r as VizeUnpluginOptions } from "./types-B13SJWBj.mjs";
+import { r as VizeUnpluginOptions } from "./types-CgwReHH2.mjs";
 import * as _$unplugin from "unplugin";
 
 //#region src/rollup.d.ts

package/dist/rollup.mjs

@@ -1,4 +1,4 @@
-import { n as vizeUnplugin } from "./unplugin-BvkszWH0.mjs";
+import { n as vizeUnplugin } from "./unplugin-BBdWoA7s.mjs";
 //#region src/rollup.ts
 var rollup_default = vizeUnplugin.rollup;
 //#endregion

package/dist/{types-B13SJWBj.d.mts → types-CgwReHH2.d.mts}

@@ -17,6 +17,13 @@ interface VizeUnpluginOptions {
   sourceMap?: boolean;
   mode?: "module" | "function";
   vapor?: boolean;
+  /**
+   * Default output mode for `.jsx`/`.tsx` components without a `"use vue:*"`
+   * directive. Distinct from `vapor` (which targets `.vue` SFCs). A
+   * per-component directive overrides it.
+   * @default "vdom"
+   */
+  jsxMode?: "vdom" | "vapor";
   customRenderer?: boolean;
   templateSyntax?: VizeTemplateSyntax;
   runtimeModuleName?: string;

package/dist/{unplugin-BvkszWH0.mjs → unplugin-BBdWoA7s.mjs}

@@ -7,7 +7,7 @@ import { generateSfcScopeId, wrapSfcScopedPreprocessorStyle } from "@vizejs/nati
 import { transform } from "oxc-transform";
 //#region src/filter.ts
 function createFilter(include, exclude) {
-	const includePatterns = include ? Array.isArray(include) ? include : [include] : [/\.vue$/];
+	const includePatterns = include ? Array.isArray(include) ? include : [include] : [/\.vue$/, /\.[jt]sx$/];
 	const excludePatterns = exclude ? Array.isArray(exclude) ? exclude : [exclude] : [/node_modules/];
 	return (id) => {
 		const matchInclude = includePatterns.some((pattern) => matchesPattern(pattern, id));
@@ -46,6 +46,35 @@ function generateScopeId(filename, root, isProduction, source) {
 function supportsTemplateOnlyHmr(output) {
 	return /(?:^|\n)(?:_sfc_main|__sfc__)\.render\s*=\s*render\b/m.test(output);
 }
+/**
+* Prepend a runtime `<style>` injection for plain CSS to a module's output.
+*
+* This is the same inline-CSS path plain SFC `<style>` blocks use (see
+* {@link generateOutput}): a guarded `document.createElement("style")` keyed by
+* a stable id, so the rule is appended once and idempotently. `styleKey` seeds
+* the element id (deduping re-injection across HMR/multiple imports). Used for
+* both SFC plain CSS and JSX `<style scoped>` CSS (#1495, #1533), whose content
+* is already scope-rewritten by the compiler.
+*/
+function prependInlineStyleInjection(output, css, styleKey) {
+	return `
+export const __vize_css__ = ${JSON.stringify(css)};
+const __vize_css_id__ = ${JSON.stringify(`vize-style-${styleKey}`)};
+(function() {
+  if (typeof document !== "undefined") {
+    let style = document.getElementById(__vize_css_id__);
+    if (!style) {
+      style = document.createElement("style");
+      style.id = __vize_css_id__;
+      style.textContent = __vize_css__;
+      document.head.appendChild(style);
+    } else {
+      style.textContent = __vize_css__;
+    }
+  }
+})();
+${output}`;
+}
 function generateOutput(compiled, options) {
 	const { isProduction, isDev, extractCss, filePath } = options;
 	let output = compiled.code;
@@ -92,23 +121,7 @@ function generateOutput(compiled, options) {
 			}).join("\n");
 			output = output.replace(/^export default _sfc_main;?$/m, `${cssModuleSetup}\nexport default _sfc_main;`);
 		}
-	} else if (compiled.css && !(isProduction && extractCss)) output = `
-export const __vize_css__ = ${JSON.stringify(compiled.css)};
-const __vize_css_id__ = ${JSON.stringify(`vize-style-${compiled.scopeId}`)};
-(function() {
-  if (typeof document !== "undefined") {
-    let style = document.getElementById(__vize_css_id__);
-    if (!style) {
-      style = document.createElement("style");
-      style.id = __vize_css_id__;
-      style.textContent = __vize_css__;
-      document.head.appendChild(style);
-    } else {
-      style.textContent = __vize_css__;
-    }
-  }
-})();
-${output}`;
+	} else if (compiled.css && !(isProduction && extractCss)) output = prependInlineStyleInjection(output, compiled.css, compiled.scopeId);
 	if (!isProduction && isDev && hasExportDefault && supportsTemplateOnlyHmr(output)) output += "";
 	return output;
 }
@@ -127,7 +140,7 @@ function toStyleBlockInfo(block) {
 }
 //#endregion
 //#region src/compiler.ts
-const { compileSfc } = native;
+const { compileSfc, compileJsx } = native;
 function buildSignature(options) {
 	return [
 		options.isProduction ? "1" : "0",
@@ -191,12 +204,38 @@ function compileVueModule(filePath, source, options, cache) {
 		warnings: result.warnings
 	};
 }
+function compileJsxModule(filePath, source, options) {
+	const result = compileJsx(source, {
+		filename: filePath,
+		lang: filePath.endsWith(".tsx") ? "tsx" : "jsx",
+		jsxMode: options.jsxMode,
+		vapor: options.vapor,
+		sourceMap: options.sourceMap
+	});
+	if (result.errors.length > 0) throw new Error(result.errors.join("\n"));
+	const css = (result.scopedStyles ?? []).map((style) => style.css).join("\n");
+	let code = result.code;
+	let map = result.map ?? null;
+	if (css) {
+		const styleKey = result.scopedStyles[0].scopeId.replace(/^data-v-/, "");
+		code = prependInlineStyleInjection(code, css, styleKey);
+		map = null;
+	}
+	return {
+		code,
+		map,
+		warnings: result.warnings
+	};
+}
 //#endregion
 //#region src/request.ts
 const STYLE_MARKER = ".__vize_style_";
 function isVueFile(id) {
 	return id.endsWith(".vue");
 }
+function isJsxFile(id) {
+	return id.endsWith(".jsx") || id.endsWith(".tsx");
+}
 function isVueStyleRequest(id) {
 	if (!id.includes("?vue")) return false;
 	const { query } = parseVueRequest(id);
@@ -289,6 +328,7 @@ function normalizeOptions(rawOptions = {}) {
 		sourceMap: rawOptions.sourceMap ?? !isProduction,
 		mode,
 		vapor: rawOptions.vapor ?? false,
+		jsxMode: rawOptions.jsxMode,
 		customRenderer: rawOptions.customRenderer ?? false,
 		templateSyntax,
 		runtimeModuleName: rawOptions.runtimeModuleName ?? "vue",
@@ -366,12 +406,22 @@ const vizeUnplugin = createUnplugin((rawOptions = {}) => {
 		},
 		transformInclude(id) {
 			if (options.hostCompiler) return false;
+			if (isJsxFile(id)) return filter(id);
 			if (!id.includes(".vue")) return false;
 			const request = parseVueRequest(id);
 			return !request.query.vue && isVueFile(request.filename) && filter(request.filename);
 		},
 		async transform(code, id) {
 			if (options.hostCompiler) return null;
+			if (isJsxFile(id)) {
+				if (!filter(id)) return null;
+				const { code: jsxCode, map: jsxMap, warnings } = compileJsxModule(id, code, options);
+				for (const warning of warnings) this.warn(`[vize] ${warning}`);
+				return {
+					code: jsxCode,
+					map: jsxMap
+				};
+			}
 			if (!isVueFile(id) || !filter(id)) return null;
 			const { compiled, warnings } = compileVueModule(id, code, options, cache);
 			for (const warning of warnings) this.warn(`[vize] ${warning}`);
@@ -392,8 +442,8 @@ const vizeUnplugin = createUnplugin((rawOptions = {}) => {
 			if (!options.hostCompiler) injectWebpackVueDefines(compiler, options.isProduction, options.compatibility.webpackVersion);
 		},
 		esbuild: {
-			onResolveFilter: /\.vue(?:$|\?)/,
-			onLoadFilter: /\.vue(?:$|\?)/,
+			onResolveFilter: /\.(?:vue|[jt]sx)(?:$|\?)/,
+			onLoadFilter: /\.(?:vue|[jt]sx)(?:$|\?)/,
 			loader(_code, id) {
 				const request = parseVueRequest(id);
 				if (request.query.type === "style") return request.query.module !== false ? "local-css" : "css";

package/dist/webpack.d.mts

@@ -1,4 +1,4 @@
-import { r as VizeUnpluginOptions } from "./types-B13SJWBj.mjs";
+import { r as VizeUnpluginOptions } from "./types-CgwReHH2.mjs";
 import * as _$webpack from "webpack";
 
 //#region src/webpack.d.ts

package/dist/webpack.mjs

@@ -1,4 +1,4 @@
-import { n as vizeUnplugin } from "./unplugin-BvkszWH0.mjs";
+import { n as vizeUnplugin } from "./unplugin-BBdWoA7s.mjs";
 //#region src/webpack.ts
 var webpack_default = vizeUnplugin.webpack;
 //#endregion

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vizejs/unplugin",
-  "version": "0.204.0",
+  "version": "0.210.0",
   "description": "Experimental Vue SFC integrations for Rollup, Rolldown, Webpack, esbuild, and Babel powered by Vize",
   "keywords": [
     "babel",
@@ -67,7 +67,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@vizejs/native": "0.204.0",
+    "@vizejs/native": "0.210.0",
     "oxc-transform": "0.130.0",
     "unplugin": "3.0.0"
   },