@bamboocss/vite 1.53.1 → 1.54.0

package/dist/css-output-module.mjs

@@ -1,6 +1,9 @@
 import { t as bare } from "./class-name.mjs";
+import { basename, join } from "node:path";
 import { toHash, truncateList } from "@bamboocss/shared";
+import { existsSync, readFileSync, rmSync, writeFileSync } from "node:fs";
 import remapping from "@ampproject/remapping";
+import { GenMapping, addMapping, toEncodedMap } from "@jridgewell/gen-mapping";
 import MagicString from "magic-string";
 import postcss from "postcss";
 import selectorParser from "postcss-selector-parser";
@@ -170,43 +173,431 @@ const generatedCssSource = (output) => {
 	const source = typeof output.source === "string" ? output.source : Buffer.from(output.source).toString();
 	return source.includes("--made-with-bamboo") ? source : void 0;
 };
-/** Whether this bundle replaces a previously generated Bamboo stylesheet. */
-const containsGeneratedCssAsset = (bundle) => Object.values(bundle).some((output) => generatedCssSource(output) !== void 0);
 /**
-* Prune compiler-owned CSS, then give any sheet whose bytes changed a hash of those bytes.
-*
-* Rollup has already expanded `[hash]` when `generateBundle` runs. Mutating only `source`
-* would therefore leave two different reachable subsets under one CDN key. The extra final
-* hash is not cosmetic: it makes late graph reachability cache-safe.
-*
-* Renaming is therefore not a choice this takes. Pruned bytes under the unpruned sheet's name
-* is the one outcome that must never be reachable, and a sheet nothing was removed from keeps
-* its name because its bytes are unchanged — so "rename" is a consequence of "the bytes moved",
-* not a second option. `prune` is the only knob.
+* Whether this bundle replaces a previously generated Bamboo stylesheet — or, given the set of
+* assets a pass already handled, whether any generated sheet is still waiting for one.
 */
+const containsGeneratedCssAsset = (bundle, handled, handledNames) => Object.values(bundle).some((output) => generatedCssSource(output) !== void 0 && !handled?.has(output) && !handledNames?.has(output.fileName));
 const optimizeStaticCssAssets = (bundle, session, options = {}) => {
-	const { environment, prune = true, requiredClasses, sourcemap = session.sourcemap } = options;
+	const { environment, prune = true, requiredClasses, sourcemap = session.sourcemap, handled, handledNames, split } = options;
 	/** Assets in this bundle that carry the generated stylesheet, pruned or not. */
 	let sheets = 0;
+	/** Their file names, after any rename below. */
+	const names = [];
+	const results = [];
 	for (const output of Object.values(bundle)) {
 		const source = generatedCssSource(output);
 		if (source === void 0) continue;
+		if (handled?.has(output) || handledNames?.has(output.fileName)) continue;
+		handled?.add(output);
+		handledNames?.add(output.fileName);
 		sheets++;
-		const optimized = pruneStaticCss(source, session, {
+		names.push(output.fileName);
+		const original = output.fileName;
+		const pruned = pruneStaticCss(source, session, {
 			environment,
 			prune,
 			requiredClasses
 		});
-		if (!prune) continue;
+		if (!prune) {
+			results.push({
+				original,
+				fileName: original,
+				source,
+				optimized: source,
+				asset: output,
+				moved: /* @__PURE__ */ new Set()
+			});
+			continue;
+		}
+		let optimized = pruned;
+		let moved = /* @__PURE__ */ new Set();
+		if (split?.ownership.size) {
+			const divided = splitStaticCss(pruned, session, split.ownership);
+			optimized = divided.css;
+			moved = divided.moved;
+			for (const [chunk, css] of divided.chunks) split.emit(chunk, css);
+		}
 		output.source = optimized;
-		if (optimized === source) continue;
+		if (optimized === source) {
+			results.push({
+				original,
+				fileName: original,
+				source,
+				optimized,
+				asset: output,
+				moved
+			});
+			continue;
+		}
+		names.pop();
 		const nextName = output.fileName.replace(/\.css$/, `.b-${toHash(optimized)}.css`);
 		if (bundle[nextName] && bundle[nextName] !== output) throw new Error(`bamboocss: final CSS asset name collision at ${JSON.stringify(nextName)}.`);
 		const previous = output.fileName;
 		output.fileName = nextName;
+		names.push(nextName);
+		handledNames?.add(nextName);
+		results.push({
+			original,
+			fileName: nextName,
+			source,
+			optimized,
+			asset: output,
+			moved
+		});
 		replaceAssetReferences(bundle, previous, nextName, sourcemap);
+		try {
+			bundle[nextName] = output;
+			if (bundle[nextName] === output && nextName !== previous) delete bundle[previous];
+		} catch {}
+	}
+	return {
+		sheets,
+		names,
+		results
+	};
+};
+/** Text outputs a stylesheet's name can appear in. Fonts and images are skipped unread. */
+const REFERENCING_EXTENSIONS = /\.(?:[cm]?js|html?|css|json|txt|map|webmanifest|svg|xml)$/i;
+const CHUNK_EXTENSIONS = /\.[cm]?js$/i;
+/**
+* Rewrite one written file the way `replaceChunkReference` rewrites a chunk in memory.
+*
+* A chunk with a sourcemap — a sibling `.map`, or one inlined — has its mappings carried
+* across the edit: the replacement changes the length of a line, and every mapping after it
+* on that line would otherwise be off by the difference.
+*/
+const replaceFileReference = (path, previous, next) => {
+	const code = readFileSync(path, "utf8");
+	if (!code.includes(previous)) return false;
+	if (!CHUNK_EXTENSIONS.test(path)) {
+		writeFileSync(path, code.replaceAll(previous, next));
+		return true;
+	}
+	const magic = new MagicString(code);
+	let index = code.indexOf(previous);
+	while (index !== -1) {
+		magic.overwrite(index, index + previous.length, next);
+		index = code.indexOf(previous, index + previous.length);
+	}
+	let rewritten = magic.toString();
+	const inlineMap = code.match(INLINE_SOURCE_MAP)?.[0];
+	const mapPath = `${path}.map`;
+	const rawMap = inlineMap ? JSON.parse(Buffer.from(inlineMap.slice(inlineMap.indexOf("base64,") + 7), "base64").toString()) : existsSync(mapPath) ? JSON.parse(readFileSync(mapPath, "utf8")) : void 0;
+	if (rawMap) {
+		const combined = remapping([magic.generateMap({
+			source: basename(path),
+			hires: "boundary"
+		}), rawMap], () => null);
+		if (rawMap.file) combined.file = rawMap.file;
+		if (rawMap.debugId) combined.debugId = rawMap.debugId;
+		if (inlineMap) rewritten = rewritten.replace(INLINE_SOURCE_MAP, "") + `\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,${Buffer.from(combined.toString()).toString("base64")}`;
+		else writeFileSync(mapPath, combined.toString());
+	}
+	writeFileSync(path, rewritten);
+	return true;
+};
+/**
+* Prune every deferred sheet against the whole run's reachability, on disk.
+*
+* From the *unpruned* source, not from the file: the file was pruned against a partial run and
+* may lack a rule a later environment reaches, and pruning cannot put a rule back. When the
+* final bytes are the provisional bytes — the common case, since a later environment usually
+* reaches nothing new — nothing on disk moves and every recorded name stays right. When they
+* differ, the same contract as `optimizeStaticCssAssets` applies: the bytes and the name move
+* together, every written reference moves with them across environments, and a copy of the
+* provisional sheet a framework wrote into another output is replaced the same way.
+*/
+const finalizeDeferredSheets = (sheets, session, options) => {
+	const { requiredClasses, prune = true, outputs, bundle, sourcemap = session.sourcemap } = options;
+	const finalized = [];
+	for (const sheet of sheets) {
+		if (!existsSync(join(sheet.dir, sheet.fileName))) continue;
+		let final = pruneStaticCss(sheet.source, session, {
+			prune,
+			requiredClasses
+		});
+		if (sheet.moved?.size) final = splitStaticCss(final, session, new Map([...sheet.moved].map((className) => [className, ""]))).css;
+		if (!prune || final === sheet.provisional) {
+			finalized.push({
+				...sheet,
+				before: sheet.provisional.length,
+				after: sheet.provisional.length
+			});
+			continue;
+		}
+		const nextName = sheet.originalFileName.replace(/\.css$/, `.b-${toHash(final)}.css`);
+		const directories = new Set([sheet.dir]);
+		for (const output of outputs) directories.add(output.dir);
+		for (const dir of directories) {
+			const copy = join(dir, sheet.fileName);
+			if (!existsSync(copy)) continue;
+			if (dir !== sheet.dir && readFileSync(copy, "utf8") !== sheet.provisional) continue;
+			writeFileSync(join(dir, nextName), final);
+			rmSync(copy, { force: true });
+		}
+		const seen = /* @__PURE__ */ new Set();
+		for (const output of outputs) for (const file of output.files) {
+			if (!REFERENCING_EXTENSIONS.test(file)) continue;
+			const target = join(output.dir, file);
+			if (seen.has(target) || file === sheet.fileName) continue;
+			seen.add(target);
+			if (!existsSync(target)) continue;
+			replaceFileReference(target, sheet.fileName, nextName);
+		}
+		if (sheet.asset) {
+			sheet.asset.source = final;
+			sheet.asset.fileName = nextName;
+			if (sheet.bundle) {
+				try {
+					sheet.bundle[nextName] = sheet.asset;
+					if (sheet.bundle[nextName] === sheet.asset) delete sheet.bundle[sheet.fileName];
+				} catch {}
+				replaceAssetReferences(sheet.bundle, sheet.fileName, nextName, sheet.sourcemap);
+			}
+		}
+		if (bundle) replaceAssetReferences(bundle, sheet.fileName, nextName, sourcemap);
+		finalized.push({
+			...sheet,
+			renamed: nextName,
+			before: sheet.provisional.length,
+			after: final.length
+		});
+	}
+	return finalized;
+};
+/** The at-rules a rule sits under, outermost first, as name and params. */
+const ancestryOf = (rule) => {
+	const chain = [];
+	let parent = rule.parent;
+	while (parent && parent.type !== "root") {
+		if (parent.type === "atrule") {
+			const atRule = parent;
+			chain.unshift({
+				name: atRule.name,
+				params: atRule.params
+			});
+		}
+		parent = parent.parent;
+	}
+	return chain;
+};
+/** The container in `root` under the same at-rule chain, created where absent. */
+const containerFor = (root, chain) => {
+	let container = root;
+	for (const { name, params } of chain) {
+		let next = container.nodes?.find((node) => node.type === "atrule" && node.name === name && node.params === params);
+		if (!next) {
+			next = postcss.atRule({
+				name,
+				params,
+				nodes: []
+			});
+			container.append(next);
+		}
+		container = next;
+	}
+	return container;
+};
+/**
+* Move every utility rule a lazily loaded chunk owns into a sheet of that chunk's own.
+*
+* Reads the finished entry sheet — pruned, sublayered, minified or not — and walks its
+* utility rules. A selector naming exactly one class that `ownership` assigns to a chunk is
+* moved to that chunk's sheet under the same at-rule chain: the utilities layer, its sublayer,
+* any media or container query. A rule with several selectors is split per selector, since a
+* merged rule's members can belong to different chunks. Whatever nothing owns stays.
+*
+* Each chunk sheet opens with the entry's sublayer order statement, so whichever sheet the
+* document happens to parse first establishes the same order. That is what makes the split
+* safe at all: precedence lives in the sublayers, not in where a rule sits.
+*/
+const splitStaticCss = (css, session, ownership) => {
+	const chunks = /* @__PURE__ */ new Map();
+	const moved = /* @__PURE__ */ new Set();
+	if (!ownership.size || !css.includes("--made-with-bamboo")) return {
+		css,
+		chunks,
+		moved
+	};
+	const root = postcss.parse(css);
+	const roots = /* @__PURE__ */ new Map();
+	const rootFor = (chunk) => {
+		let chunkRoot = roots.get(chunk);
+		if (!chunkRoot) {
+			chunkRoot = postcss.root();
+			roots.set(chunk, chunkRoot);
+		}
+		return chunkRoot;
+	};
+	const isUtilityRule = (rule) => {
+		let parent = rule.parent;
+		while (parent) {
+			if (parent.type === "atrule") {
+				const atRule = parent;
+				if (atRule.name === "layer" && atRule.params === session.utilityLayer) return true;
+			}
+			parent = parent.parent;
+		}
+		return false;
+	};
+	let order;
+	root.walkAtRules("layer", (atRule) => {
+		if (order || atRule.nodes) return;
+		const parent = atRule.parent;
+		if (parent?.type === "atrule" && parent.params === session.utilityLayer) order = atRule;
+	});
+	root.walkRules((rule) => {
+		if (!isUtilityRule(rule)) return;
+		const kept = [];
+		const taken = /* @__PURE__ */ new Map();
+		for (const selector of rule.selectors) {
+			let owner;
+			try {
+				selectorParser((selectors) => {
+					const classes = /* @__PURE__ */ new Set();
+					selectors.walkClasses((classNode) => {
+						classes.add(bare(classNode.toString().slice(1)));
+					});
+					if (classes.size !== 1) return;
+					const [className] = classes;
+					owner = ownership.get(className);
+					if (owner !== void 0) moved.add(className);
+				}).processSync(selector);
+			} catch {}
+			if (owner === void 0) kept.push(selector);
+			else (taken.get(owner) ?? taken.set(owner, []).get(owner)).push(selector);
+		}
+		if (!taken.size) return;
+		const chain = ancestryOf(rule);
+		for (const [chunk, selectors] of taken) containerFor(rootFor(chunk), chain).append(rule.clone({ selectors }));
+		if (kept.length) rule.selectors = kept;
+		else rule.remove();
+	});
+	let removed = true;
+	while (removed) {
+		removed = false;
+		root.walkAtRules((atRule) => {
+			if (atRule.nodes?.length !== 0) return;
+			atRule.remove();
+			removed = true;
+		});
 	}
-	return { sheets };
+	for (const [chunk, chunkRoot] of roots) {
+		if (order) chunkRoot.nodes.find((node) => node.type === "atrule" && node.name === "layer" && node.params === session.utilityLayer)?.prepend(order.clone());
+		chunks.set(chunk, chunkRoot.toString());
+	}
+	return {
+		css: root.toString(),
+		chunks,
+		moved
+	};
+};
+/** A class token of a selector, escapes and all: `.hover\\:c_red600` up to its unescaped `:`. */
+const CLASS_TOKEN = /\.((?:\\.|[^\\\s.:>+~[\](),])+)/g;
+/**
+* The top-level comma-separated parts of a selector list as written, each with its offset.
+*
+* `rule.selectors` splits the same way but loses where each part sits, and a merged rule's
+* selectors sit on separate lines in the unminified sheet a dev server serves.
+*/
+const selectorParts = (raw) => {
+	const parts = [];
+	let depth = 0;
+	let start = 0;
+	for (let index = 0; index < raw.length; index++) {
+		const char = raw[index];
+		if (char === "\\") index++;
+		else if (char === "(" || char === "[") depth++;
+		else if (char === ")" || char === "]") depth--;
+		else if (char === "," && depth === 0) {
+			parts.push({
+				text: raw.slice(start, index),
+				offset: start
+			});
+			start = index + 1;
+		}
+	}
+	parts.push({
+		text: raw.slice(start),
+		offset: start
+	});
+	return parts.map((part) => {
+		const leading = part.text.length - part.text.trimStart().length;
+		return {
+			text: part.text.trim(),
+			offset: part.offset + leading
+		};
+	});
+};
+/** `start` advanced over `text` up to `offset`, in 1-based lines and columns. */
+const positionAt = (text, offset, start) => {
+	let { line, column } = start;
+	for (let index = 0; index < offset; index++) if (text[index] === "\n") {
+		line++;
+		column = 1;
+	} else column++;
+	return {
+		line,
+		column
+	};
+};
+/**
+* A source map from each rule of the served stylesheet to the call site its atom was first
+* encoded at, for DevTools to name the file and line a rule came from.
+*
+* Read off the finished sheet rather than threaded through its generation: rules enter the
+* postcss tree as strings, which strips their positions, and the optimizer re-parses the text
+* twice more. One parse here costs the same as one of those and needs no cooperation from
+* either. A rule maps at its selector, and a merged rule maps each of its selectors, since
+* the optimizer folds rules from different call sites into one. `sourcesContent` is left for
+* Vite to fill from disk, which it does for a dev stylesheet's map before inlining it.
+*/
+const cssSourceMap = (css, origins) => {
+	const byBareClass = /* @__PURE__ */ new Map();
+	for (const [className, origin] of origins) {
+		const name = bare(className);
+		if (!byBareClass.has(name)) byBareClass.set(name, origin);
+	}
+	if (!byBareClass.size) return void 0;
+	const originOf = (selector) => {
+		for (const match of selector.matchAll(CLASS_TOKEN)) {
+			const origin = byBareClass.get(bare(match[1]));
+			if (origin) return origin;
+		}
+	};
+	const map = new GenMapping();
+	let mapped = 0;
+	postcss.parse(css).walkRules((rule) => {
+		const start = rule.source?.start;
+		if (!start) return;
+		const raw = rule.raws.selector?.raw ?? rule.selector;
+		for (const part of selectorParts(raw)) {
+			const origin = originOf(part.text);
+			if (!origin) continue;
+			const generated = positionAt(raw, part.offset, start);
+			addMapping(map, {
+				generated: {
+					line: generated.line,
+					column: generated.column - 1
+				},
+				source: origin.filePath,
+				original: {
+					line: origin.line,
+					column: origin.column - 1
+				}
+			});
+			mapped++;
+		}
+	});
+	if (!mapped) return void 0;
+	const encoded = toEncodedMap(map);
+	return {
+		version: 3,
+		mappings: encoded.mappings,
+		names: [...encoded.names],
+		sources: encoded.sources.map((source) => source ?? "")
+	};
 };
 //#endregion
-export { containsGeneratedCssAsset, optimizeStaticCssAssets, pruneStaticCss };
+export { containsGeneratedCssAsset, cssSourceMap, finalizeDeferredSheets, optimizeStaticCssAssets, pruneStaticCss, splitStaticCss };

package/dist/fold-module.cjs

@@ -1,7 +1,7 @@
 const require_chunk = require("./chunk.cjs");
+let node_path = require("node:path");
 let _bamboocss_shared = require("@bamboocss/shared");
 let node_crypto = require("node:crypto");
-let node_path = require("node:path");
 let magic_string = require("magic-string");
 magic_string = require_chunk.__toESM(magic_string);
 let _bamboocss_config_ts_path = require("@bamboocss/config/ts-path");

package/dist/fold-module.mjs

@@ -1,6 +1,6 @@
+import { dirname, relative, resolve } from "node:path";
 import { compact, createCssUncached, createMergeCss, memo, viewTransitionClassName } from "@bamboocss/shared";
 import { createHash } from "node:crypto";
-import { dirname, relative, resolve } from "node:path";
 import MagicString from "magic-string";
 import { resolveTsPathPattern } from "@bamboocss/config/ts-path";
 import { box, maybeBoxNode } from "@bamboocss/extractor";