@teacss/vite 0.10.9 → 0.10.10

package/dist/finalize.d.ts

@@ -0,0 +1,5 @@
+import { type ResolvedBuildEnvironmentOptions, type ResolvedConfig } from "vite";
+type BuildOptions = Pick<ResolvedBuildEnvironmentOptions, "cssMinify" | "cssTarget">;
+export declare function finalizeBuildCss(css: string, config: ResolvedConfig, build: BuildOptions, viteVersion: string): Promise<string>;
+export {};
+//# sourceMappingURL=finalize.d.ts.map

package/dist/finalize.js

@@ -0,0 +1,104 @@
+import { createRequire } from "node:module";
+import { join } from "node:path";
+import { preprocessCSS } from "vite";
+import { RESOLVED_ENTRY } from "./virtual.js";
+// esbuild and lightningcss are Vite's (a dependency or an optional peer, by version), not this package's: load them as Vite does.
+const fromVite = createRequire(import.meta.resolve("vite"));
+export async function finalizeBuildCss(css, config, build, viteVersion) {
+    const filename = join(config.root, RESOLVED_ENTRY.slice(1));
+    const minifier = minifierOf(build.cssMinify, viteVersion);
+    const lightningcss = config.css.transformer === "lightningcss";
+    // One pass: a second Lightning CSS pass repeats the prefixes the first one added.
+    if (lightningcss && minifier === "lightningcss")
+        return minifyWithLightningcss(css, filename, config, build.cssTarget);
+    const { code } = await preprocessCSS(css, filename, lightningcss ? withoutCssMinify(config) : config);
+    if (minifier === "esbuild")
+        return minifyWithEsbuild(code, filename, config, build.cssTarget);
+    if (minifier === "lightningcss")
+        return minifyWithLightningcss(code, filename, config, build.cssTarget);
+    return code;
+}
+/** `preprocessCSS` runs Lightning CSS with the client environment's `build`, minifying wherever its `cssMinify` is set. */
+function withoutCssMinify(config) {
+    const environments = Object.fromEntries(Object.entries(config.environments).map(([name, options]) => [name, { ...options, build: { ...options.build, cssMinify: false } }]));
+    return { ...config, build: { ...config.build, cssMinify: false }, environments };
+}
+function minifierOf(cssMinify, viteVersion) {
+    if (cssMinify !== true)
+        return cssMinify;
+    // Vite 7 minifies with esbuild for `cssMinify: true`, Vite 8 with Lightning CSS.
+    return Number.parseInt(viteVersion, 10) >= 8 ? "lightningcss" : "esbuild";
+}
+async function minifyWithEsbuild(css, filename, config, cssTarget) {
+    const esbuild = fromVite("esbuild");
+    const result = await esbuild.transform(css, { ...resolveMinifyCssEsbuildOptions(config.esbuild || {}), loader: "css", sourcefile: filename, target: cssTarget || undefined });
+    for (const warning of result.warnings)
+        config.logger.warn(`[esbuild css minify] ${warning.text}`);
+    return result.code;
+}
+function resolveMinifyCssEsbuildOptions(options) {
+    const { charset, legalComments, logLevel, logLimit, logOverride, minifyIdentifiers, minifySyntax, minifyWhitespace } = options;
+    const base = { charset, legalComments, logLevel, logLimit, logOverride };
+    if (minifyIdentifiers == null && minifySyntax == null && minifyWhitespace == null)
+        return { ...base, minify: true };
+    return { ...base, minifyIdentifiers: minifyIdentifiers ?? true, minifySyntax: minifySyntax ?? true, minifyWhitespace: minifyWhitespace ?? true };
+}
+function minifyWithLightningcss(css, filename, config, cssTarget) {
+    const lightningcss = fromVite("lightningcss");
+    const result = lightningcss.transform({ ...config.css.lightningcss, filename, code: Buffer.from(css), minify: true, targets: convertTargets(cssTarget), cssModules: undefined });
+    for (const warning of result.warnings)
+        config.logger.warn(`[lightningcss minify] ${warning.message}`);
+    return new TextDecoder().decode(result.code);
+}
+const CSS_TARGET_BROWSERS = new Map([
+    ["chrome", "chrome"],
+    ["edge", "edge"],
+    ["firefox", "firefox"],
+    ["hermes", false],
+    ["ie", "ie"],
+    ["ios", "ios_saf"],
+    ["node", false],
+    ["opera", "opera"],
+    ["rhino", false],
+    ["safari", "safari"],
+]);
+const ES_TARGETS = new Map([
+    [2015, ["chrome49", "edge13", "safari10", "ios10", "firefox44", "opera36"]],
+    [2016, ["chrome50", "edge13", "safari10", "ios10", "firefox43", "opera37"]],
+    [2017, ["chrome58", "edge15", "safari11", "ios11", "firefox52", "opera45"]],
+    [2018, ["chrome63", "edge79", "safari12", "ios12", "firefox58", "opera50"]],
+    [2019, ["chrome73", "edge79", "safari12.1", "ios12.1", "firefox64", "opera60"]],
+    [2020, ["chrome80", "edge80", "safari14.1", "ios14.5", "firefox80", "opera67"]],
+    [2021, ["chrome85", "edge85", "safari14.1", "ios14.5", "firefox80", "opera71"]],
+    [2022, ["chrome94", "edge94", "safari16.4", "ios16.4", "firefox93", "opera80"]],
+    [2023, ["chrome110", "edge110", "safari16.4", "ios16.4", "firefox146", "opera96"]],
+    [2024, ["chrome119", "edge119", "safari17.4", "ios17.4", "firefox145", "opera105"]],
+    [2025, ["chrome136", "edge136", "safari26.0", "ios26.0", "firefox138", "opera121"]],
+]);
+function convertTargets(cssTarget) {
+    const targets = {};
+    for (const entry of [cssTarget || []].flat().flatMap(esBrowsers)) {
+        if (entry === "esnext")
+            continue;
+        const [, name = "", major, minor = "0"] = /^([a-z_]+)(\d+)(?:\.(\d+))?$/i.exec(entry) ?? [];
+        const browser = CSS_TARGET_BROWSERS.get(name.toLowerCase());
+        if (browser === false)
+            continue;
+        if (browser === undefined)
+            throw new Error(`Unsupported target "${entry}"`);
+        const version = (Number(major) << 16) | (Number(minor) << 8);
+        if (version < (targets[browser] ?? Number.POSITIVE_INFINITY))
+            targets[browser] = version;
+    }
+    return targets;
+}
+function esBrowsers(entry) {
+    const year = /^es(6|\d{4})$/.exec(entry)?.[1];
+    if (year === undefined)
+        return [entry];
+    const browsers = ES_TARGETS.get(year === "6" ? 2015 : Number(year));
+    if (browsers === undefined)
+        throw new Error(`Unsupported target "${entry}"`);
+    return browsers;
+}
+//# sourceMappingURL=finalize.js.map

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+export type { ShellOptions } from "@teacss/engine";
+export { INSPECTOR_BASE, type TeacssViteOptions, type TeacssVitePluginApi, teacss } from "./plugin.js";
+export { BUILD_PLACEHOLDER, BUILD_PLACEHOLDER_PATTERN, DEFAULT_PIPELINE_INCLUDE, ENTRY_IDS, RESOLVED_ENTRY } from "./virtual.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.js

@@ -0,0 +1,3 @@
+export { INSPECTOR_BASE, teacss } from "./plugin.js";
+export { BUILD_PLACEHOLDER, BUILD_PLACEHOLDER_PATTERN, DEFAULT_PIPELINE_INCLUDE, ENTRY_IDS, RESOLVED_ENTRY } from "./virtual.js";
+//# sourceMappingURL=index.js.map

package/dist/plugin.d.ts

@@ -0,0 +1,29 @@
+import { type Project, type ShellOptions } from "@teacss/engine";
+import type { Plugin } from "vite";
+export interface TeacssViteOptions extends ShellOptions {
+    /**
+     * The engine's own minify of the generated CSS, which drops the layer comments and line breaks. Default false:
+     * a build hands the generated CSS to Vite's minifier, `build.cssMinify`, whatever this option says.
+     */
+    minify?: boolean;
+    /** Serve `@teacss/inspector` at `INSPECTOR_BASE` on the dev server. Default true; a build never mounts it. */
+    inspector?: boolean;
+    /**
+     * In a build, set `css.transformer` and `build.cssMinify` to "lightningcss" where the user left them
+     * unset, top level and per environment (`cssMinify` only where `build.minify` is not false). Default:
+     * only when `lightningcss` resolves from the project root (it is Vite's optional peer).
+     */
+    lightningcss?: boolean;
+}
+export interface TeacssVitePluginApi {
+    getProject(): Project;
+    /**
+     * Sends the dev client an update of the generated CSS, as a changed module does: for the modules another plugin
+     * registers through `getProject().transform()`. A build has no client to update.
+     */
+    invalidate(): void;
+}
+/** The dev-server path the inspector's UI and `/api` routes live under; the UI's built asset URLs assume it. */
+export declare const INSPECTOR_BASE = "/__teacss";
+export declare function teacss(options?: TeacssViteOptions): Plugin[];
+//# sourceMappingURL=plugin.d.ts.map

package/dist/plugin.js

@@ -0,0 +1,459 @@
+import { createHash } from "node:crypto";
+import { readFileSync } from "node:fs";
+import { createRequire } from "node:module";
+import { join, posix, resolve } from "node:path";
+import { createProject, extractBundledFonts, isCssId, markers, replaceEntryWithMap } from "@teacss/engine";
+import { createInspectorMiddleware } from "@teacss/inspector";
+import { finalizeBuildCss } from "./finalize.js";
+import { BUILD_PLACEHOLDER, BUILD_PLACEHOLDER_PATTERN, digestPlaceholder, hmrPath, isResolvedEntry, resolveEntryId, shouldTransform } from "./virtual.js";
+const INCLUDE_COMMENT = markers().includeComment;
+/** architecture §5: the files `loadProjectFromRoot` discovers the entry through. */
+const ENTRY_CANDIDATES = ["package.json", "index.css", "src/index.css"];
+/** Collapses the invalidations of one burst of transforms into one client update. */
+const INVALIDATION_DELAY_MS = 10;
+/** The dev-server path the inspector's UI and `/api` routes live under; the UI's built asset URLs assume it. */
+export const INSPECTOR_BASE = "/__teacss";
+/** Where, under Vite's `base`, the dev server serves the fonts of the generated CSS; the path teacss-ts uses. */
+const DEV_FONTS = "__teacss_fonts";
+const HTML_ENTRY = /\.html$/;
+/** `vite:css-post`'s transform, and the stylesheets holding the placeholder it cached, by its hook object. */
+const cssPostCaches = new WeakMap();
+/**
+ * Vite names a CSS file by the hash of what `vite:css-post` cached for its stylesheets, when it renders a chunk,
+ * and the generated CSS replaces the placeholder only in `generateBundle`. So the stylesheets that hold the
+ * placeholder are recorded here, and `renderStart` caches them again with the generated CSS's digest in it.
+ */
+function recordPlaceholderStylesheets(plugins) {
+    const hook = plugins.find((plugin) => plugin.name === "vite:css-post")?.transform;
+    if (typeof hook !== "object" || hook === null || cssPostCaches.has(hook))
+        return;
+    const transform = hook.handler;
+    const cached = new Map();
+    cssPostCaches.set(hook, { transform, cached });
+    const record = function (css, id, ...rest) {
+        if (typeof css === "string" && css.search(BUILD_PLACEHOLDER_PATTERN) !== -1)
+            cached.set(id, css);
+        return transform.call(this, css, id, ...rest);
+    };
+    hook.handler = record;
+}
+export function teacss(options = {}) {
+    const { inspector = true, lightningcss, ...shell } = options;
+    let project;
+    let config;
+    let server;
+    let viteVersion = "";
+    /** When `config` sets `build.cssMinify`: the environments whose own `build.cssMinify` the user set. */
+    let userCssMinify;
+    let invalidation;
+    /** What the last watcher event threw, shown in the error overlay until an event succeeds. */
+    let failure;
+    /** No live project yet, or `dispose()` released it. */
+    let disposed = true;
+    /** `@source` files registered as modules from disk, so the ones Vite never imports still count. */
+    const sources = new Set();
+    /** Stylesheet ids whose `@teacss;` took the generated CSS; they are invalidated with the virtual entry. */
+    const entries = new Set();
+    /** `@source` directories already reported as unreadable: Vite's builder resolves the config once per environment. */
+    const unreadable = new Set();
+    /** The bytes of each font the dev CSS links to, by its file name under `DEV_FONTS`, which carries its sha256. */
+    const devFonts = new Map();
+    function warnUnreadable() {
+        for (const path of project.info.unreadableDirectories) {
+            if (unreadable.has(path))
+                continue;
+            unreadable.add(path);
+            config.logger.warn(`[@teacss/vite] cannot read ${path} (E_IO)`);
+        }
+    }
+    function scanSource(file) {
+        let code;
+        try {
+            code = readFileSync(file, "utf8");
+        }
+        catch {
+            sources.delete(file);
+            return project.removeModule(file);
+        }
+        sources.add(file);
+        return project.transform(file, code).changed;
+    }
+    function syncSources() {
+        const next = new Set(project.info.sourceFiles);
+        let changed = false;
+        for (const file of sources) {
+            if (next.has(file))
+                continue;
+            sources.delete(file);
+            changed = project.removeModule(file) || changed;
+        }
+        for (const file of next) {
+            if (sources.has(file))
+                continue;
+            server?.watcher.add(file);
+            changed = scanSource(file) || changed;
+        }
+        return changed;
+    }
+    function isConfigFile(file) {
+        return project.engine.configFiles().includes(file) || ENTRY_CANDIDATES.some((candidate) => join(project.root, candidate) === file);
+    }
+    /** Forgets the modules `transform` registered for a deleted file, its `?query` variants included. */
+    function removeTransformed(file) {
+        let changed = false;
+        for (const id of project.modules()) {
+            if (id === file || id.startsWith(`${file}?`))
+                changed = project.removeModule(id) || changed;
+        }
+        return changed;
+    }
+    function onFileChange(file, event) {
+        if (event === "update" && !isConfigFile(file)) {
+            if (sources.has(file) && scanSource(file))
+                invalidateEntry();
+            // While the last reload failed, `configFiles()` is the last good program's: the file may be an import only the failed load read.
+            if (!failure)
+                return;
+        }
+        const removed = event === "delete" && removeTransformed(file);
+        const programChanged = project.reload();
+        watchConfig();
+        warnUnreadable();
+        const sourcesChanged = syncSources();
+        // After a failure the page also reloads to drop the error overlay, even when the fix restored the last good program.
+        if (programChanged || failure)
+            fullReload();
+        else if (sourcesChanged || removed)
+            invalidateEntry();
+    }
+    /**
+     * A dev server's watcher event. An error, such as a configuration error in the saved entry, goes to the log and
+     * the error overlay instead of ending the process; the engine keeps its last good program. Until a reload
+     * succeeds, every event reloads the project, and the one that succeeds reloads the page.
+     */
+    function onWatcherEvent(file, event) {
+        try {
+            onFileChange(file, event);
+        }
+        catch (error) {
+            const message = describeError(error);
+            failure = { message, stack: error instanceof Error ? (error.stack ?? "") : "", plugin: "teacss", id: failure?.id ?? file };
+            config.logger.error(`[@teacss/vite] ${message}`, { timestamp: true, error: error instanceof Error ? error : undefined });
+            server?.hot.send({ type: "error", err: failure });
+            watchFailedImports();
+            return;
+        }
+        failure = undefined;
+    }
+    /** The entry's imports can sit outside the root Vite watches, and chokidar reports a missing path once it appears. */
+    function watchConfig() {
+        server?.watcher.add([...project.engine.configFiles(), ...project.engine.missingImports()]);
+    }
+    /** The files the failed load read: a fix saved to an import outside the root then reaches the watcher too. */
+    function watchFailedImports() {
+        const { entryPath } = project.info;
+        if (!server || entryPath === null)
+            return;
+        try {
+            server.watcher.add(project.engine.inspectEntry({ root: project.root, entryPath }).configFiles);
+        }
+        catch {
+            // An unreadable entry is reported by the root watcher when it comes back.
+        }
+    }
+    function fullReload() {
+        if (!server)
+            return;
+        server.moduleGraph.invalidateAll();
+        server.hot.send({ type: "full-reload" });
+    }
+    function invalidateEntry() {
+        if (!server || invalidation)
+            return;
+        invalidation = setTimeout(() => {
+            invalidation = undefined;
+            sendEntryUpdate();
+        }, INVALIDATION_DELAY_MS);
+    }
+    function sendEntryUpdate() {
+        if (!server)
+            return;
+        const timestamp = Date.now();
+        const updates = [];
+        for (const [id, mod] of server.moduleGraph.idToModuleMap) {
+            if (!isResolvedEntry(id) && !entries.has(id))
+                continue;
+            server.moduleGraph.invalidateModule(mod);
+            // As in Vite's own HMR: a stylesheet requested directly (`<link>`, `?direct`) has no JS importer to accept a js-update.
+            const path = hmrPath(mod.url, viteVersion);
+            updates.push({ type: mod.type === "css" ? "css-update" : "js-update", path, acceptedPath: path, timestamp });
+        }
+        if (updates.length > 0)
+            server.hot.send({ type: "update", updates });
+    }
+    function open() {
+        const isBuild = config.command === "build";
+        project = createProject({
+            ...shell,
+            root: shell.root ?? config.root,
+            envMode: shell.envMode ?? (isBuild ? "build" : "dev"),
+            minify: shell.minify ?? false,
+        });
+        disposed = false;
+        sources.clear();
+        entries.clear();
+        warnUnreadable();
+        syncSources();
+    }
+    /**
+     * What stands for the generated CSS: the placeholder `generateBundle` replaces in a build, the CSS itself in dev,
+     * with its fonts linked from the dev server. While a watcher event has failed, the error goes out again: Vite's
+     * own update of a changed entry stylesheet clears the overlay before the client requests it.
+     */
+    function generated(warn) {
+        if (config.command === "build")
+            return BUILD_PLACEHOLDER;
+        if (failure)
+            server?.hot.send({ type: "error", err: failure });
+        const result = project.css();
+        project.reportUnmatched(result, { warn });
+        return linkDevFonts(result.css);
+    }
+    /** `css` with the fonts it inlines linked from the dev server, which serves the bytes recorded here. */
+    function linkDevFonts(css) {
+        // As Vite's own dev asset URLs: a page served by another server (`server.origin`) loads them from Vite.
+        const prefix = `${config.server.origin ?? ""}${config.base}${DEV_FONTS}/`;
+        const linked = extractBundledFonts(css, (digest, bytes) => {
+            const name = `teacss-${digest}.woff2`;
+            devFonts.set(name, bytes);
+            return `${prefix}${name}`;
+        }).css;
+        // Vite runs PostCSS on a stylesheet with a lowercase `url(`, and these URLs are final. CSS function names
+        // are case-insensitive, so writing them `URL(`, as teacss-ts does, lets the sheet skip PostCSS.
+        const quoted = JSON.stringify(prefix).slice(0, -1);
+        return linked.replaceAll(`url(${quoted}`, `URL(${quoted}`);
+    }
+    /** A font this instance has not linked yet, as in CSS another process generated, is looked up in the project's CSS. */
+    function devFont(name) {
+        if (!devFonts.has(name) && !disposed)
+            linkDevFonts(project.css().css);
+        return devFonts.get(name);
+    }
+    function dispose() {
+        if (invalidation)
+            clearTimeout(invalidation);
+        invalidation = undefined;
+        server = undefined;
+        if (disposed)
+            return;
+        disposed = true;
+        project.dispose();
+    }
+    /**
+     * Splices the generated CSS into every CSS file that holds the placeholder. Vite writes a chunk's CSS file
+     * when it renders the chunk, and with `build.cssCodeSplit: false` its single CSS file only in its own
+     * `generateBundle`, so `teacss:api` runs this again after it.
+     */
+    const spliceGenerated = async function (_options, bundle) {
+        let css;
+        const fonts = new Map();
+        for (const file of Object.values(bundle)) {
+            if (file.type !== "asset" || !file.fileName.endsWith(".css"))
+                continue;
+            const source = typeof file.source === "string" ? file.source : new TextDecoder().decode(file.source);
+            if (source.search(BUILD_PLACEHOLDER_PATTERN) === -1)
+                continue;
+            if (css === undefined) {
+                const result = project.css();
+                project.reportUnmatched(result, { warn: (message) => this.warn(message) });
+                css = await finalizeBuildCss(result.css, this.environment.getTopLevelConfig(), this.environment.config.build, viteVersion);
+            }
+            const emitted = new Set();
+            const spliced = extractBundledFonts(css, (digest, bytes) => {
+                let reference = fonts.get(digest);
+                if (reference === undefined) {
+                    reference = this.emitFile({ type: "asset", name: `teacss-${digest}.woff2`, source: bytes });
+                    fonts.set(digest, reference);
+                }
+                const fileName = this.getFileName(reference);
+                emitted.add(fileName);
+                return assetUrl(config.base, file.fileName, fileName);
+            }).css;
+            file.source = source.replace(BUILD_PLACEHOLDER_PATTERN, () => spliced);
+            // Vite's manifest lists a chunk's assets from `viteMetadata.importedAssets`; Astro moves the
+            // fonts of its server build to the client output from that list.
+            for (const chunk of Object.values(bundle)) {
+                if (chunk.type !== "chunk" || !chunk.viteMetadata?.importedCss.has(file.fileName))
+                    continue;
+                for (const fileName of emitted)
+                    chunk.viteMetadata.importedAssets.add(fileName);
+            }
+        }
+    };
+    const main = {
+        name: "teacss",
+        enforce: "pre",
+        config(user, env) {
+            userCssMinify = undefined;
+            if (lightningcss === false || env.command !== "build")
+                return null;
+            if (lightningcss === undefined && !resolves("lightningcss", user.root ?? process.cwd()))
+                return null;
+            const patch = {};
+            if (user.css?.transformer === undefined)
+                patch.css = { transformer: "lightningcss" };
+            if (user.build?.cssMinify !== undefined)
+                return patch;
+            userCssMinify = new Set(Object.entries(user.environments ?? {}).flatMap(([name, options]) => (options.build?.cssMinify === undefined ? [] : [name])));
+            // With `build.minify: false` Vite resolves an unset `cssMinify` to off; keep it that way.
+            if (user.build?.minify !== false)
+                patch.build = { cssMinify: "lightningcss" };
+            return patch;
+        },
+        // An environment's options carry the top-level `build` after every plugin's `config` hook, the
+        // `cssMinify` set above included, so a later plugin's choice is kept and an environment's own
+        // `build.minify: false` turns ours back off.
+        configEnvironment(name, environment) {
+            if (!userCssMinify || userCssMinify.has(name))
+                return null;
+            const { cssMinify, minify } = environment.build ?? {};
+            if (cssMinify === undefined)
+                return minify === false ? null : { build: { cssMinify: "lightningcss" } };
+            return cssMinify === "lightningcss" && minify === false ? { build: { cssMinify: false } } : null;
+        },
+        // Vite's builder (`vite build --app`, Astro) resolves the config once per environment on the same
+        // plugin objects, then builds the environments one after another, closing each bundle.
+        configResolved(resolved) {
+            dispose();
+            config = resolved;
+            viteVersion = this.meta.viteVersion;
+            if (resolved.command === "build")
+                recordPlaceholderStylesheets(resolved.plugins);
+            open();
+        },
+        async renderStart() {
+            if (config.command !== "build")
+                return;
+            const hook = this.environment.config.plugins.find((plugin) => plugin.name === "vite:css-post")?.transform;
+            const cache = typeof hook === "object" && hook !== null ? cssPostCaches.get(hook) : undefined;
+            if (!cache || cache.cached.size === 0)
+                return;
+            const digest = createHash("sha256").update(project.css().css).digest("hex").slice(0, 16);
+            for (const [id, css] of cache.cached)
+                await cache.transform.call(this, css.replace(BUILD_PLACEHOLDER_PATTERN, () => digestPlaceholder(digest)), id);
+        },
+        buildStart() {
+            if (disposed)
+                open();
+            for (const file of [...project.watchFiles(), ...project.engine.missingImports()])
+                this.addWatchFile(file);
+        },
+        configureServer(devServer) {
+            server = devServer;
+            watchConfig();
+            devServer.watcher
+                .on("add", (file) => onWatcherEvent(file, "create"))
+                .on("change", (file) => onWatcherEvent(file, "update"))
+                .on("unlink", (file) => onWatcherEvent(file, "delete"));
+            // Vite's client reloads the page on its first update while an overlay is open, which drops the overlay.
+            devServer.hot.on("vite:client:connect", (_data, client) => {
+                if (failure)
+                    client.send({ type: "error", err: failure });
+            });
+            const serveFont = (request, response, next) => {
+                const bytes = devFont(request.url?.split("?", 1)[0]?.slice(1) ?? "");
+                if (!bytes)
+                    return next();
+                response.setHeader("Content-Type", "font/woff2");
+                response.setHeader("Cache-Control", "public, max-age=31536000, immutable");
+                response.end(bytes);
+            };
+            // After Vite's CORS and host check, ahead of the middleware that strips `base`.
+            devServer.middlewares.use(`${config.base}${DEV_FONTS}`, serveFont);
+            // A parent app that mounts Vite's middlewares under `base` strips it before they run.
+            if (config.server.middlewareMode && config.base !== "/")
+                devServer.middlewares.use(`/${DEV_FONTS}`, serveFont);
+            if (inspector)
+                devServer.middlewares.use(INSPECTOR_BASE, createInspectorMiddleware(project));
+        },
+        watchChange(id, change) {
+            if (!server)
+                onFileChange(id, change.event);
+        },
+        resolveId(id) {
+            return resolveEntryId(id);
+        },
+        load(id) {
+            if (!isResolvedEntry(id))
+                return null;
+            return generated((message) => this.warn(message));
+        },
+        transform(code, id) {
+            // An HTML entry goes through `transformIndexHtml`; in a build Vite also hands it to `transform`
+            // first, and registering both the source and the rewritten page would drop its `:css:` groups.
+            if (HTML_ENTRY.test(id) || !shouldTransform(id, code, INCLUDE_COMMENT))
+                return null;
+            const result = project.transform(id, code);
+            const stylesheet = isCssId(id);
+            const entry = stylesheet ? replaceEntryWithMap(result.code, () => generated((message) => this.warn(message)), { id, original: code, map: result.map }) : null;
+            if (entry !== null) {
+                entries.add(id);
+                return { code: entry.code, map: { ...entry.map, file: entry.map.file ?? undefined } };
+            }
+            // A stylesheet's `changed` only means its code was rewritten: it registers no tokens, and
+            // invalidating on it would re-transform an entry stylesheet without end.
+            if (result.changed && !stylesheet)
+                invalidateEntry();
+            if (result.code === code)
+                return null;
+            return { code: result.code, map: result.map ? { ...result.map, file: result.map.file ?? undefined } : null };
+        },
+        transformIndexHtml: {
+            order: "pre",
+            handler(html, { filename }) {
+                const result = project.transform(filename, html);
+                if (result.changed)
+                    invalidateEntry();
+                return result.code;
+            },
+        },
+        generateBundle: spliceGenerated,
+        closeBundle() {
+            if (!config.build.watch)
+                dispose();
+        },
+        closeWatcher() {
+            dispose();
+        },
+    };
+    const api = {
+        name: "teacss:api",
+        enforce: "post",
+        generateBundle: spliceGenerated,
+        api: { getProject: () => project, invalidate: invalidateEntry },
+    };
+    return [main, api];
+}
+/** The URL a stylesheet at `cssFileName` uses for an emitted asset under Vite's `base`. */
+function assetUrl(base, cssFileName, assetFileName) {
+    if (base === "./" || base === "")
+        return `./${posix.relative(posix.dirname(cssFileName), assetFileName)}`;
+    return `${base}${assetFileName}`;
+}
+/** `E_CODE: message` for an engine error, the message otherwise. */
+function describeError(error) {
+    if (!(error instanceof Error))
+        return String(error);
+    const { code } = error;
+    return typeof code === "string" && code.startsWith("E_") ? `${code}: ${error.message}` : error.message;
+}
+function resolves(specifier, root) {
+    try {
+        createRequire(join(resolve(root), "package.json")).resolve(specifier);
+        return true;
+    }
+    catch {
+        return false;
+    }
+}
+//# sourceMappingURL=plugin.js.map

package/dist/virtual.d.ts

@@ -0,0 +1,32 @@
+/** The ids a user imports to get the generated stylesheet (teacss-ts `ENTRY_IDS`). */
+export declare const ENTRY_IDS: ReadonlySet<string>;
+/** The resolved id of the virtual entry; Vite's CSS pipeline treats it as a `.css` module. */
+export declare const RESOLVED_ENTRY = "\0virtual:teacss.css";
+/**
+ * What `load` returns for the entry in a build; `generateBundle` replaces it with the generated CSS. A rule,
+ * because every minifier keeps one: lightningcss keeps a legal comment only at the top of a stylesheet and
+ * warns about an unknown at-rule, esbuild drops the comment, and other CSS can precede the entry in a chunk.
+ */
+export declare const BUILD_PLACEHOLDER: string;
+/** `BUILD_PLACEHOLDER` with the digest of the CSS that will replace it, which goes into the CSS file's name. */
+export declare function digestPlaceholder(digest: string): string;
+/** `BUILD_PLACEHOLDER` or a `digestPlaceholder` as any minifier prints it. */
+export declare const BUILD_PLACEHOLDER_PATTERN: RegExp;
+/** Resolves `virtual:teacss.css`, `teacss.css`, their `/`-prefixed forms and the resolved id itself, keeping a `?query`. */
+export declare function resolveEntryId(id: string): string | null;
+/**
+ * The path an HMR update names a module by: the id the client registered the module's hot context under.
+ * Vite 7 wraps a URL that is not a path (`\0virtual:teacss.css` → `/@id/__x00__virtual:teacss.css`, its
+ * `normalizeHmrUrl`); Vite 8 registers and sends the module graph's URL as is, and its client wraps it.
+ */
+export declare function hmrPath(url: string, viteVersion: string): string;
+/** Whether `id` is the resolved entry, with or without a `?query`. */
+export declare function isResolvedEntry(id: string): boolean;
+export declare const DEFAULT_PIPELINE_INCLUDE: RegExp;
+/**
+ * Which modules `transform` hands to the project: never a virtual one; any module whose code carries
+ * `includeComment` (`@teacss-include`); otherwise, outside `node_modules`, CSS ids (`transformStylesheet`)
+ * and the ids `DEFAULT_PIPELINE_INCLUDE` matches. `@source` files are scanned from disk regardless.
+ */
+export declare function shouldTransform(id: string, code: string, includeComment: string): boolean;
+//# sourceMappingURL=virtual.d.ts.map

package/dist/virtual.js

@@ -0,0 +1,59 @@
+import { CSS_PLACEHOLDER, isCssId } from "@teacss/engine";
+/** The ids a user imports to get the generated stylesheet (teacss-ts `ENTRY_IDS`). */
+export const ENTRY_IDS = new Set(["virtual:teacss.css", "teacss.css"]);
+/** The resolved id of the virtual entry; Vite's CSS pipeline treats it as a `.css` module. */
+export const RESOLVED_ENTRY = "\0virtual:teacss.css";
+const PLACEHOLDER_NAME = CSS_PLACEHOLDER.slice(1);
+/**
+ * What `load` returns for the entry in a build; `generateBundle` replaces it with the generated CSS. A rule,
+ * because every minifier keeps one: lightningcss keeps a legal comment only at the top of a stylesheet and
+ * warns about an unknown at-rule, esbuild drops the comment, and other CSS can precede the entry in a chunk.
+ */
+export const BUILD_PLACEHOLDER = `#${PLACEHOLDER_NAME}{--${PLACEHOLDER_NAME}:0}`;
+/** `BUILD_PLACEHOLDER` with the digest of the CSS that will replace it, which goes into the CSS file's name. */
+export function digestPlaceholder(digest) {
+    return `#${PLACEHOLDER_NAME}{--${PLACEHOLDER_NAME}:t${digest}}`;
+}
+/** `BUILD_PLACEHOLDER` or a `digestPlaceholder` as any minifier prints it. */
+export const BUILD_PLACEHOLDER_PATTERN = new RegExp(`#${PLACEHOLDER_NAME}\\s*\\{\\s*--${PLACEHOLDER_NAME}\\s*:\\s*[\\w-]+\\s*;?\\s*\\}`, "g");
+/** Resolves `virtual:teacss.css`, `teacss.css`, their `/`-prefixed forms and the resolved id itself, keeping a `?query`. */
+export function resolveEntryId(id) {
+    const [bare = "", query] = splitQuery(id);
+    const isEntry = bare === RESOLVED_ENTRY || ENTRY_IDS.has(bare) || ENTRY_IDS.has(bare.replace(/^\//, ""));
+    return isEntry ? (query === undefined ? RESOLVED_ENTRY : `${RESOLVED_ENTRY}?${query}`) : null;
+}
+/**
+ * The path an HMR update names a module by: the id the client registered the module's hot context under.
+ * Vite 7 wraps a URL that is not a path (`\0virtual:teacss.css` → `/@id/__x00__virtual:teacss.css`, its
+ * `normalizeHmrUrl`); Vite 8 registers and sends the module graph's URL as is, and its client wraps it.
+ */
+export function hmrPath(url, viteVersion) {
+    if (Number.parseInt(viteVersion, 10) >= 8 || url.startsWith("/") || url.startsWith("."))
+        return url;
+    return `/@id/${url.replace("\0", "__x00__")}`;
+}
+/** Whether `id` is the resolved entry, with or without a `?query`. */
+export function isResolvedEntry(id) {
+    return splitQuery(id)[0] === RESOLVED_ENTRY;
+}
+function splitQuery(id) {
+    const index = id.indexOf("?");
+    return index === -1 ? [id, undefined] : [id.slice(0, index), id.slice(index + 1)];
+}
+// same as teacss-ts runtime defaultPipelineInclude
+export const DEFAULT_PIPELINE_INCLUDE = /\.(vue|svelte|[jt]sx|vine\.ts|mdx?|astro|elm|php|phtml|marko|html)($|\?)/;
+/**
+ * Which modules `transform` hands to the project: never a virtual one; any module whose code carries
+ * `includeComment` (`@teacss-include`); otherwise, outside `node_modules`, CSS ids (`transformStylesheet`)
+ * and the ids `DEFAULT_PIPELINE_INCLUDE` matches. `@source` files are scanned from disk regardless.
+ */
+export function shouldTransform(id, code, includeComment) {
+    if (id.startsWith("\0"))
+        return false;
+    if (code.includes(includeComment))
+        return true;
+    if (id.includes("/node_modules/"))
+        return false;
+    return isCssId(id) || DEFAULT_PIPELINE_INCLUDE.test(id);
+}
+//# sourceMappingURL=virtual.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teacss/vite",
-  "version": "0.10.9",
+  "version": "0.10.10",
   "description": "Vite plugin for TeaCSS on the Rust engine (@teacss/engine)",
   "license": "MIT",
   "type": "module",
@@ -36,8 +36,8 @@
     "vite": ">=7"
   },
   "dependencies": {
-    "@teacss/engine": "0.10.9",
-    "@teacss/inspector": "0.10.9"
+    "@teacss/engine": "0.10.10",
+    "@teacss/inspector": "0.10.10"
   },
   "devDependencies": {
     "@types/node": "^22.20.5",