wgsl-edit 0.0.25 → 0.0.26

package/dist/wgsl-edit.js

@@ -5073,11 +5073,11 @@ var shift = {
 };
 var mac = typeof navigator != "undefined" && /Mac/.test(navigator.platform);
 var ie$1 = typeof navigator != "undefined" && /MSIE \d|Trident\/(?:[7-9]|\d{2,})\..*rv:(\d+)/.exec(navigator.userAgent);
-for (var i$1 = 0; i$1 < 10; i$1++) base[48 + i$1] = base[96 + i$1] = String(i$1);
-for (var i$1 = 1; i$1 <= 24; i$1++) base[i$1 + 111] = "F" + i$1;
-for (var i$1 = 65; i$1 <= 90; i$1++) {
-	base[i$1] = String.fromCharCode(i$1 + 32);
-	shift[i$1] = String.fromCharCode(i$1);
+for (var i = 0; i < 10; i++) base[48 + i] = base[96 + i] = String(i);
+for (var i = 1; i <= 24; i++) base[i + 111] = "F" + i;
+for (var i = 65; i <= 90; i++) {
+	base[i] = String.fromCharCode(i + 32);
+	shift[i] = String.fromCharCode(i);
 }
 for (var code in base) if (!shift.hasOwnProperty(code)) shift[code] = base[code];
 function keyName(event) {
@@ -15018,7 +15018,7 @@ tagHighlighter([
 ]);
 //#endregion
 //#region ../../node_modules/.pnpm/@codemirror+language@6.11.2/node_modules/@codemirror/language/dist/index.js
-var _a$1;
+var _a;
 /**
 Node prop stored in a parser's top syntax node to provide the
 facet that stores language-specific data for that language.
@@ -15479,7 +15479,7 @@ if (typeof requestIdleCallback != "undefined") requestIdle = (callback) => {
 	}, 100);
 	return () => idle < 0 ? clearTimeout(timeout) : cancelIdleCallback(idle);
 };
-const isInputPending = typeof navigator != "undefined" && ((_a$1 = navigator.scheduling) === null || _a$1 === void 0 ? void 0 : _a$1.isInputPending) ? () => navigator.scheduling.isInputPending() : null;
+const isInputPending = typeof navigator != "undefined" && ((_a = navigator.scheduling) === null || _a === void 0 ? void 0 : _a.isInputPending) ? () => navigator.scheduling.isInputPending() : null;
 const parseWorker = /* @__PURE__ */ ViewPlugin.fromClass(class ParseWorker {
 	constructor(view) {
 		this.view = view;
@@ -19035,12 +19035,13 @@ const isBrowser = "document" in globalThis;
 /** Throw an error with an embedded source map so that browser users can
 *  click on the error in the browser debug console and see the wesl source code.  */
 function throwClickableError(params) {
-	const { url, text, lineNumber, lineColumn, length, error } = params;
+	const { url, text, lineNumber, lineColumn, length, offset, error } = params;
 	const weslLocation = {
 		file: url,
 		line: lineNumber,
 		column: lineColumn,
-		length
+		length,
+		offset
 	};
 	error.weslLocation = weslLocation;
 	if (!isBrowser) throw error;
@@ -19101,6 +19102,7 @@ function failIdentElem(identElem, msg = "") {
 		lineNumber,
 		lineColumn,
 		length: end - start,
+		offset: start,
 		error: new Error(detailedMessage)
 	});
 }
@@ -19376,7 +19378,7 @@ function lowerAndEmitElem(e, ctx) {
 		case "let":
 		case "statement":
 		case "continuing":
-			emitStatement$1(e, ctx);
+			emitStatement(e, ctx);
 			return;
 		case "override":
 		case "const":
@@ -19414,7 +19416,7 @@ function emitModule(e, ctx) {
 		lowerAndEmitElem(child, ctx);
 	}
 }
-function emitStatement$1(e, ctx) {
+function emitStatement(e, ctx) {
 	if (!(e.contents.length > 0 && e.contents[0].kind === "attribute")) emitAttributes(e.attributes, ctx);
 	emitContents(e, ctx);
 }
@@ -22751,20 +22753,13 @@ async function link(params) {
 }
 /** linker api for benchmarking */
 function _linkSync(params) {
-	const { weslSrc, libs = [], packageName, debugWeslRoot } = params;
-	const { resolver } = params;
-	const resolvers = [];
-	if (resolver) resolvers.push(resolver);
-	else if (weslSrc) resolvers.push(new RecordResolver(weslSrc, {
+	const { weslSrc, libs = [], packageName, debugWeslRoot, resolver } = params;
+	if (!resolver && !weslSrc) throw new Error("Either resolver or weslSrc must be provided");
+	const allResolvers = [resolver ?? new RecordResolver(weslSrc, {
 		packageName,
 		debugWeslRoot
-	}));
-	else throw new Error("Either resolver or weslSrc must be provided");
-	if (libs.length > 0) {
-		const libResolvers = createLibraryResolvers(libs, debugWeslRoot);
-		resolvers.push(...libResolvers);
-	}
-	const finalResolver = resolvers.length === 1 ? resolvers[0] : new CompositeResolver(resolvers);
+	}), ...createLibraryResolvers(libs, debugWeslRoot)];
+	const finalResolver = allResolvers.length === 1 ? allResolvers[0] : new CompositeResolver(allResolvers);
 	return linkRegistry({
 		...params,
 		resolver: finalResolver
@@ -22848,6 +22843,7 @@ function setupVirtualLibs(virtualLibs, constants) {
 	}
 	return libs && mapValues(libs, (fn) => ({ fn }));
 }
+/** Run registered transform plugins over the bound AST. */
 function applyTransformPlugins(rootModule, globalNames, config) {
 	const { moduleElem, srcModule } = rootModule;
 	const startAst = {
@@ -22860,53 +22856,38 @@ function applyTransformPlugins(rootModule, globalNames, config) {
 }
 /** Assemble WGSL output from prologue statements, root module, and imported declarations. */
 function emitWgsl(rootModuleElem, srcModule, newDecls, newStatements, conditions = {}) {
-	const prologueBuilders = newStatements.map((s) => emitStatement(s, conditions));
-	const rootBuilder = new SrcMapBuilder({
-		text: srcModule.src,
-		path: srcModule.debugFilePath
-	});
+	const prologueBuilders = newStatements.map((s) => emitElem(s.srcModule, s.elem, conditions, { addNl: true }));
+	const rootBuilder = builderFromModule(srcModule);
 	lowerAndEmit({
 		srcBuilder: rootBuilder,
 		rootElems: [rootModuleElem],
 		conditions,
 		extracting: false
 	});
-	const declBuilders = newDecls.map((decl) => emitDecl(decl, conditions));
+	const declBuilders = newDecls.map((decl) => emitElem(decl.srcModule, decl.declElem, conditions, { skipConditionalFiltering: true }));
 	return [
 		...prologueBuilders,
 		rootBuilder,
 		...declBuilders
 	];
 }
-function emitStatement(s, conditions) {
-	const { elem, srcModule } = s;
-	const { src: text, debugFilePath: path } = srcModule;
-	const builder = new SrcMapBuilder({
-		text,
-		path
-	});
+/** Emit a single element (prologue statement or imported declaration) into a SrcMapBuilder. */
+function emitElem(srcModule, elem, conditions, opts = {}) {
+	const builder = builderFromModule(srcModule);
 	lowerAndEmit({
 		srcBuilder: builder,
 		rootElems: [elem],
-		conditions
+		conditions,
+		skipConditionalFiltering: opts.skipConditionalFiltering
 	});
-	builder.addNl();
+	if (opts.addNl) builder.addNl();
 	return builder;
 }
-/** Skip conditional filtering because findValidRootDecls already validated these declarations */
-function emitDecl(decl, conditions) {
-	const { src: text, debugFilePath: path } = decl.srcModule;
-	const builder = new SrcMapBuilder({
-		text,
-		path
-	});
-	lowerAndEmit({
-		srcBuilder: builder,
-		rootElems: [decl.declElem],
-		conditions,
-		skipConditionalFiltering: true
+function builderFromModule(srcModule) {
+	return new SrcMapBuilder({
+		text: srcModule.src,
+		path: srcModule.debugFilePath
 	});
-	return builder;
 }
 matchOneOf(textureStorageTypes);
 matchOneOf(sampledTextureTypes);
@@ -27394,338 +27375,6 @@ async function hydrateBundle(path, registry, hydrated, fetcher) {
 	return placeholder;
 }
 //#endregion
-//#region ../../node_modules/.pnpm/fflate@0.8.2/node_modules/fflate/esm/browser.js
-var u8 = Uint8Array, u16 = Uint16Array, i32 = Int32Array;
-var fleb = new u8([
-	0,
-	0,
-	0,
-	0,
-	0,
-	0,
-	0,
-	0,
-	1,
-	1,
-	1,
-	1,
-	2,
-	2,
-	2,
-	2,
-	3,
-	3,
-	3,
-	3,
-	4,
-	4,
-	4,
-	4,
-	5,
-	5,
-	5,
-	5,
-	0,
-	0,
-	0,
-	0
-]);
-var fdeb = new u8([
-	0,
-	0,
-	0,
-	0,
-	1,
-	1,
-	2,
-	2,
-	3,
-	3,
-	4,
-	4,
-	5,
-	5,
-	6,
-	6,
-	7,
-	7,
-	8,
-	8,
-	9,
-	9,
-	10,
-	10,
-	11,
-	11,
-	12,
-	12,
-	13,
-	13,
-	0,
-	0
-]);
-var clim = new u8([
-	16,
-	17,
-	18,
-	0,
-	8,
-	7,
-	9,
-	6,
-	10,
-	5,
-	11,
-	4,
-	12,
-	3,
-	13,
-	2,
-	14,
-	1,
-	15
-]);
-var freb = function(eb, start) {
-	var b = new u16(31);
-	for (var i = 0; i < 31; ++i) b[i] = start += 1 << eb[i - 1];
-	var r = new i32(b[30]);
-	for (var i = 1; i < 30; ++i) for (var j = b[i]; j < b[i + 1]; ++j) r[j] = j - b[i] << 5 | i;
-	return {
-		b,
-		r
-	};
-};
-var _a = freb(fleb, 2), fl = _a.b, revfl = _a.r;
-fl[28] = 258, revfl[258] = 28;
-var _b = freb(fdeb, 0), fd = _b.b;
-_b.r;
-var rev = new u16(32768);
-for (var i = 0; i < 32768; ++i) {
-	var x = (i & 43690) >> 1 | (i & 21845) << 1;
-	x = (x & 52428) >> 2 | (x & 13107) << 2;
-	x = (x & 61680) >> 4 | (x & 3855) << 4;
-	rev[i] = ((x & 65280) >> 8 | (x & 255) << 8) >> 1;
-}
-var hMap = (function(cd, mb, r) {
-	var s = cd.length;
-	var i = 0;
-	var l = new u16(mb);
-	for (; i < s; ++i) if (cd[i]) ++l[cd[i] - 1];
-	var le = new u16(mb);
-	for (i = 1; i < mb; ++i) le[i] = le[i - 1] + l[i - 1] << 1;
-	var co;
-	if (r) {
-		co = new u16(1 << mb);
-		var rvb = 15 - mb;
-		for (i = 0; i < s; ++i) if (cd[i]) {
-			var sv = i << 4 | cd[i];
-			var r_1 = mb - cd[i];
-			var v = le[cd[i] - 1]++ << r_1;
-			for (var m = v | (1 << r_1) - 1; v <= m; ++v) co[rev[v] >> rvb] = sv;
-		}
-	} else {
-		co = new u16(s);
-		for (i = 0; i < s; ++i) if (cd[i]) co[i] = rev[le[cd[i] - 1]++] >> 15 - cd[i];
-	}
-	return co;
-});
-var flt = new u8(288);
-for (var i = 0; i < 144; ++i) flt[i] = 8;
-for (var i = 144; i < 256; ++i) flt[i] = 9;
-for (var i = 256; i < 280; ++i) flt[i] = 7;
-for (var i = 280; i < 288; ++i) flt[i] = 8;
-var fdt = new u8(32);
-for (var i = 0; i < 32; ++i) fdt[i] = 5;
-var flrm = /* @__PURE__ */ hMap(flt, 9, 1), fdrm = /* @__PURE__ */ hMap(fdt, 5, 1);
-var max = function(a) {
-	var m = a[0];
-	for (var i = 1; i < a.length; ++i) if (a[i] > m) m = a[i];
-	return m;
-};
-var bits = function(d, p, m) {
-	var o = p / 8 | 0;
-	return (d[o] | d[o + 1] << 8) >> (p & 7) & m;
-};
-var bits16 = function(d, p) {
-	var o = p / 8 | 0;
-	return (d[o] | d[o + 1] << 8 | d[o + 2] << 16) >> (p & 7);
-};
-var shft = function(p) {
-	return (p + 7) / 8 | 0;
-};
-var slc = function(v, s, e) {
-	if (s == null || s < 0) s = 0;
-	if (e == null || e > v.length) e = v.length;
-	return new u8(v.subarray(s, e));
-};
-var ec = [
-	"unexpected EOF",
-	"invalid block type",
-	"invalid length/literal",
-	"invalid distance",
-	"stream finished",
-	"no stream handler",
-	,
-	"no callback",
-	"invalid UTF-8 data",
-	"extra field too long",
-	"date not in range 1980-2099",
-	"filename too long",
-	"stream finishing",
-	"invalid zip data"
-];
-var err = function(ind, msg, nt) {
-	var e = new Error(msg || ec[ind]);
-	e.code = ind;
-	if (Error.captureStackTrace) Error.captureStackTrace(e, err);
-	if (!nt) throw e;
-	return e;
-};
-var inflt = function(dat, st, buf, dict) {
-	var sl = dat.length, dl = dict ? dict.length : 0;
-	if (!sl || st.f && !st.l) return buf || new u8(0);
-	var noBuf = !buf;
-	var resize = noBuf || st.i != 2;
-	var noSt = st.i;
-	if (noBuf) buf = new u8(sl * 3);
-	var cbuf = function(l) {
-		var bl = buf.length;
-		if (l > bl) {
-			var nbuf = new u8(Math.max(bl * 2, l));
-			nbuf.set(buf);
-			buf = nbuf;
-		}
-	};
-	var final = st.f || 0, pos = st.p || 0, bt = st.b || 0, lm = st.l, dm = st.d, lbt = st.m, dbt = st.n;
-	var tbts = sl * 8;
-	do {
-		if (!lm) {
-			final = bits(dat, pos, 1);
-			var type = bits(dat, pos + 1, 3);
-			pos += 3;
-			if (!type) {
-				var s = shft(pos) + 4, l = dat[s - 4] | dat[s - 3] << 8, t = s + l;
-				if (t > sl) {
-					if (noSt) err(0);
-					break;
-				}
-				if (resize) cbuf(bt + l);
-				buf.set(dat.subarray(s, t), bt);
-				st.b = bt += l, st.p = pos = t * 8, st.f = final;
-				continue;
-			} else if (type == 1) lm = flrm, dm = fdrm, lbt = 9, dbt = 5;
-			else if (type == 2) {
-				var hLit = bits(dat, pos, 31) + 257, hcLen = bits(dat, pos + 10, 15) + 4;
-				var tl = hLit + bits(dat, pos + 5, 31) + 1;
-				pos += 14;
-				var ldt = new u8(tl);
-				var clt = new u8(19);
-				for (var i = 0; i < hcLen; ++i) clt[clim[i]] = bits(dat, pos + i * 3, 7);
-				pos += hcLen * 3;
-				var clb = max(clt), clbmsk = (1 << clb) - 1;
-				var clm = hMap(clt, clb, 1);
-				for (var i = 0; i < tl;) {
-					var r = clm[bits(dat, pos, clbmsk)];
-					pos += r & 15;
-					var s = r >> 4;
-					if (s < 16) ldt[i++] = s;
-					else {
-						var c = 0, n = 0;
-						if (s == 16) n = 3 + bits(dat, pos, 3), pos += 2, c = ldt[i - 1];
-						else if (s == 17) n = 3 + bits(dat, pos, 7), pos += 3;
-						else if (s == 18) n = 11 + bits(dat, pos, 127), pos += 7;
-						while (n--) ldt[i++] = c;
-					}
-				}
-				var lt = ldt.subarray(0, hLit), dt = ldt.subarray(hLit);
-				lbt = max(lt);
-				dbt = max(dt);
-				lm = hMap(lt, lbt, 1);
-				dm = hMap(dt, dbt, 1);
-			} else err(1);
-			if (pos > tbts) {
-				if (noSt) err(0);
-				break;
-			}
-		}
-		if (resize) cbuf(bt + 131072);
-		var lms = (1 << lbt) - 1, dms = (1 << dbt) - 1;
-		var lpos = pos;
-		for (;; lpos = pos) {
-			var c = lm[bits16(dat, pos) & lms], sym = c >> 4;
-			pos += c & 15;
-			if (pos > tbts) {
-				if (noSt) err(0);
-				break;
-			}
-			if (!c) err(2);
-			if (sym < 256) buf[bt++] = sym;
-			else if (sym == 256) {
-				lpos = pos, lm = null;
-				break;
-			} else {
-				var add = sym - 254;
-				if (sym > 264) {
-					var i = sym - 257, b = fleb[i];
-					add = bits(dat, pos, (1 << b) - 1) + fl[i];
-					pos += b;
-				}
-				var d = dm[bits16(dat, pos) & dms], dsym = d >> 4;
-				if (!d) err(3);
-				pos += d & 15;
-				var dt = fd[dsym];
-				if (dsym > 3) {
-					var b = fdeb[dsym];
-					dt += bits16(dat, pos) & (1 << b) - 1, pos += b;
-				}
-				if (pos > tbts) {
-					if (noSt) err(0);
-					break;
-				}
-				if (resize) cbuf(bt + 131072);
-				var end = bt + add;
-				if (bt < dt) {
-					var shift = dl - dt, dend = Math.min(dt, end);
-					if (shift + bt < 0) err(3);
-					for (; bt < dend; ++bt) buf[bt] = dict[shift + bt];
-				}
-				for (; bt < end; ++bt) buf[bt] = buf[bt - dt];
-			}
-		}
-		st.l = lm, st.p = lpos, st.b = bt, st.f = final;
-		if (lm) final = 1, st.m = lbt, st.d = dm, st.n = dbt;
-	} while (!final);
-	return bt != buf.length && noBuf ? slc(buf, 0, bt) : buf.subarray(0, bt);
-};
-var et = /* @__PURE__ */ new u8(0);
-var gzs = function(d) {
-	if (d[0] != 31 || d[1] != 139 || d[2] != 8) err(6, "invalid gzip data");
-	var flg = d[3];
-	var st = 10;
-	if (flg & 4) st += (d[10] | d[11] << 8) + 2;
-	for (var zs = (flg >> 3 & 1) + (flg >> 4 & 1); zs > 0; zs -= !d[st++]);
-	return st + (flg & 2);
-};
-var gzl = function(d) {
-	var l = d.length;
-	return (d[l - 4] | d[l - 3] << 8 | d[l - 2] << 16 | d[l - 1] << 24) >>> 0;
-};
-/**
-* Expands GZIP data
-* @param data The data to decompress
-* @param opts The decompression options
-* @returns The decompressed version of the data
-*/
-function gunzipSync(data, opts) {
-	var st = gzs(data);
-	if (st + 8 > data.length) err(6, "invalid gzip data");
-	return inflt(data.subarray(st, -8), { i: 2 }, opts && opts.out || new u8(gzl(data)), opts && opts.dictionary);
-}
-var td = typeof TextDecoder != "undefined" && /* @__PURE__ */ new TextDecoder();
-try {
-	td.decode(et, { stream: true });
-} catch (e) {}
-//#endregion
 //#region ../../node_modules/.pnpm/nanotar@0.2.0/node_modules/nanotar/dist/index.mjs
 const TAR_TYPE_FILE = 0;
 const TAR_TYPE_DIR = 5;
@@ -27777,6 +27426,13 @@ function parseTar(data, opts) {
 	}
 	return files;
 }
+async function parseTarGzip(data, opts = {}) {
+	const stream = new ReadableStream({ start(controller) {
+		controller.enqueue(new Uint8Array(data));
+		controller.close();
+	} }).pipeThrough(new DecompressionStream(opts.compression ?? "gzip"));
+	return parseTar(await new Response(stream).arrayBuffer(), opts);
+}
 function _readString(buffer, offset, size) {
 	const view = new Uint8Array(buffer, offset, size);
 	const i = view.indexOf(0);
@@ -27813,7 +27469,7 @@ function memoAsync(fn) {
 async function fetchAndExtractTgzRaw(tgzUrl) {
 	const response = await fetch(tgzUrl);
 	if (!response.ok) throw new Error(`Failed to fetch package: HTTP ${response.status}`);
-	return parseTar(gunzipSync(new Uint8Array(await response.arrayBuffer())));
+	return parseTarGzip(new Uint8Array(await response.arrayBuffer()));
 }
 async function npmPackageToUrlRaw(packageName) {
 	const metadataUrl = `https://registry.npmjs.org/${packageName}`;
@@ -27880,6 +27536,10 @@ async function fetchOnePackage(pkgId, loaded) {
 	throw new Error(`Package not found: ${pkgId}`);
 }
 //#endregion
+//#region src/SaveEndpoint.ts
+/** Shared between client (WgslEdit) and server (SaveMiddleware) so they can't drift. */
+const saveEndpoint = "/__wgsl-edit/save";
+//#endregion
 //#region src/WgslEdit.css?inline
 var WgslEdit_default = ":host {\n  --tab-bar-bg: transparent;\n  --tab-border: #ccc;\n  --tab-color: #999;\n  --tab-active-bg: #fff;\n  --tab-active-color: #222;\n  --tab-accent: #5f61d8;\n\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  min-height: 100px;\n}\n\n:host(.dark) {\n  --tab-bar-bg: transparent;\n  --tab-border: #555;\n  --tab-color: #999;\n  --tab-active-bg: #1e1e1e;\n  --tab-active-color: #fff;\n}\n\n.tab-bar {\n  --bar-v: 6px;\n  --bar-h: 8px;\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  padding: var(--bar-v) var(--bar-h);\n  background: var(--tab-bar-bg);\n  flex-shrink: 0;\n  position: relative;\n}\n\n.tab-bar::after {\n  content: \"\";\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  height: 1px;\n  background: var(--tab-border);\n}\n\n.tab {\n  --tab-v: 5px;\n  --tab-h: 12px;\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  padding: var(--tab-v) var(--tab-h);\n  background: transparent;\n  border: none;\n  border-radius: 0;\n  color: var(--tab-color);\n  cursor: pointer;\n  position: relative;\n  font-size: 15px;\n  font-family: system-ui, sans-serif;\n}\n\n.tab.active {\n  color: var(--tab-accent);\n  font-weight: 600;\n  padding-bottom: calc(var(--tab-v) + var(--bar-v) + 0.5px);\n  margin-bottom: calc(-1 * (var(--bar-v) + 0.5px));\n  position: relative;\n  z-index: 1;\n  border-bottom: 2px solid var(--tab-accent);\n}\n\n.tab.active:first-child {\n  margin-left: calc(-1 * var(--bar-h));\n  padding-left: calc(var(--tab-h) + var(--bar-h));\n}\n\n.tab-close {\n  position: absolute;\n  right: -8px;\n  /* top: 2px; */\n  width: 16px;\n  height: 16px;\n  padding: 0;\n  border: none;\n  background: transparent;\n  color: inherit;\n  cursor: pointer;\n  opacity: 0;\n  font-size: 18px;\n  line-height: 1;\n}\n\n.tab:hover .tab-close {\n  opacity: 0.6;\n}\n\n.tab-close:hover {\n  opacity: 1;\n}\n\n.tab-rename {\n  background: var(--tab-active-bg);\n  border: 1px solid var(--tab-border);\n  border-radius: 4px;\n  color: var(--tab-active-color);\n  font-size: 15px;\n  font-family: system-ui, sans-serif;\n  padding: 0 4px;\n  outline: none;\n}\n\n.tab-add {\n  padding: 0 10px;\n  background: transparent;\n  border: none;\n  color: var(--tab-color);\n  cursor: pointer;\n  font-size: 25px;\n  line-height: 1;\n}\n\n.tab-add:hover {\n  color: var(--tab-active-color);\n}\n\n.editor-container {\n  flex: 1;\n  min-height: 0;\n  width: 100%;\n  padding: var(--editor-padding, 16px 0 0);\n}\n\n.cm-editor {\n  height: 100%;\n  font-size: var(--editor-font-size, 14px);\n}\n\n.cm-scroller {\n  overflow: auto;\n}\n\n.snackbar {\n  position: absolute;\n  bottom: 16px;\n  left: 16px;\n  background: #e8e8e8;\n  color: #333;\n  padding: 10px 20px;\n  border-radius: 8px;\n  font-size: 14px;\n  font-family: system-ui, sans-serif;\n  line-height: 1.4;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n  opacity: 0;\n  pointer-events: none;\n  transition: opacity 0.2s;\n  z-index: 10;\n}\n\n:host(.dark) .snackbar {\n  background: #3a3a3a;\n  color: #e0e0e0;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);\n}\n\n.snackbar.visible {\n  opacity: 1;\n}\n";
 //#endregion
@@ -27918,7 +27578,8 @@ var WgslEdit = class extends HTMLElement {
 		"lint-from",
 		"line-numbers",
 		"fetch-libs",
-		"gpu-lint"
+		"gpu-lint",
+		"autosave"
 	];
 	editorView = null;
 	editorContainer;
@@ -27947,6 +27608,10 @@ var WgslEdit = class extends HTMLElement {
 	_fetchingPkgs = /* @__PURE__ */ new Set();
 	_fetchedPkgs = /* @__PURE__ */ new Set();
 	_snackTimer;
+	_devSaveListener = null;
+	_saveTimer;
+	_dirtyFiles = /* @__PURE__ */ new Set();
+	_switchingFile = false;
 	_externalDiagnostics = [];
 	_lintFromEl = null;
 	/** Bound listeners for lint-from element's compile events. */
@@ -27970,10 +27635,13 @@ var WgslEdit = class extends HTMLElement {
 	connectedCallback() {
 		this.initEditor();
 		this.loadInitialContent();
-		upgradeProperty(this, "conditions");
-		upgradeProperty(this, "source");
-		upgradeProperty(this, "sources");
-		upgradeProperty(this, "project");
+		for (const p of [
+			"conditions",
+			"source",
+			"sources",
+			"project",
+			"autosave"
+		]) upgradeProperty(this, p);
 	}
 	disconnectedCallback() {
 		this.connectLintSource(null);
@@ -27981,25 +27649,43 @@ var WgslEdit = class extends HTMLElement {
 		this.editorView = null;
 	}
 	attributeChangedCallback(name, _old, value) {
-		if (name === "src" && value && this.editorView) this.loadFromUrl(value);
-		else if (name === "readonly") this.updateReadonly();
-		else if (name === "theme") this.theme = value || "auto";
-		else if (name === "tabs") {
-			this._tabs = value !== "false";
-			this.renderTabs();
-		} else if (name === "lint") {
-			this._lint = value || "on";
-			this.updateLint();
-		} else if (name === "lint-from") this.connectLintSource(value);
-		else if (name === "line-numbers") {
-			this._lineNumbers = value === "true";
-			this.updateLineNumbers();
-		} else if (name === "fetch-libs") {
-			this._fetchLibs = value !== "false";
-			this.updateLint();
-		} else if (name === "gpu-lint") {
-			this._gpuLint = value !== "off";
-			this.updateLint();
+		switch (name) {
+			case "src":
+				if (value && this.editorView) this.loadFromUrl(value);
+				break;
+			case "readonly":
+				this.updateReadonly();
+				break;
+			case "theme":
+				this.theme = value || "auto";
+				break;
+			case "tabs":
+				this._tabs = value !== "false";
+				this.renderTabs();
+				break;
+			case "lint":
+				this._lint = value || "on";
+				this.updateLint();
+				break;
+			case "lint-from":
+				this.connectLintSource(value);
+				break;
+			case "line-numbers":
+				this._lineNumbers = value === "true";
+				this.updateLineNumbers();
+				break;
+			case "fetch-libs":
+				this._fetchLibs = value !== "false";
+				this.updateLint();
+				break;
+			case "gpu-lint":
+				this._gpuLint = value !== "off";
+				this.updateLint();
+				break;
+			case "autosave":
+				if (value !== null && value !== "false") this.enableDevSave();
+				else this.disableDevSave();
+				break;
 		}
 	}
 	/** Conditions for conditional compilation (@if/@elif/@else). */
@@ -28011,6 +27697,10 @@ var WgslEdit = class extends HTMLElement {
 		this.updateLint();
 		this.dispatchChange();
 	}
+	/** Reconfigure a compartment via the active editor view (no-op if unmounted). */
+	reconfigure(comp, ext) {
+		this.editorView?.dispatch({ effects: comp.reconfigure(ext) });
+	}
 	/** Active file content (single-file API). */
 	get source() {
 		return this.editorView?.state.doc.toString() ?? this._pendingSource ?? "";
@@ -28018,27 +27708,30 @@ var WgslEdit = class extends HTMLElement {
 	/** Set active file content (single-file API). Auto-creates a default file entry. */
 	set source(value) {
 		if (!this._activeFile && this._files.size === 0) {
-			this._files.set("main.wesl", { doc: Text.of(value.split("\n")) });
+			this._files.set("main.wesl", { doc: toDoc(value) });
 			this._activeFile = "main.wesl";
 			this.renderTabs();
 		}
 		if (this.editorView) {
-			const to = this.editorView.state.doc.length;
-			this.editorView.dispatch({ changes: {
-				from: 0,
-				to,
-				insert: value
-			} });
+			const docLength = this.editorView.state.doc.length;
+			this.editorView.dispatch({
+				changes: {
+					from: 0,
+					to: docLength,
+					insert: value
+				},
+				annotations: Transaction.addToHistory.of(false)
+			});
 		} else {
 			this._pendingSource = value;
 			const entry = this._files.get(this._activeFile);
-			if (entry) entry.doc = Text.of(value.split("\n"));
+			if (entry) entry.doc = toDoc(value);
 		}
 	}
 	/** All file contents keyed by module path (e.g., "package::main"). */
 	get sources() {
 		this.saveCurrentFileState();
-		const pkg = this._packageName ?? "package";
+		const pkg = this.pkgName();
 		const result = {};
 		for (const [tabName, state] of this._files) result[fileToModulePath(tabName, pkg, false)] = state.doc.toString();
 		return result;
@@ -28048,12 +27741,13 @@ var WgslEdit = class extends HTMLElement {
 		this._files.clear();
 		for (const [key, content] of Object.entries(value)) {
 			const tabName = toTabName(key);
-			this._files.set(tabName, { doc: Text.of(content.split("\n")) });
+			this._files.set(tabName, { doc: toDoc(content) });
 		}
 		const firstKey = Object.keys(value)[0];
 		if (firstKey) this.switchToFile(toTabName(firstKey));
 		this.renderTabs();
 	}
+	/** Snapshot of all editor state needed to link: sources, conditions, libs, root module. */
 	get project() {
 		return {
 			weslSrc: this.sources,
@@ -28061,20 +27755,22 @@ var WgslEdit = class extends HTMLElement {
 			conditions: this._conditions,
 			constants: this._constants,
 			libs: this._libs,
-			packageName: this._packageName
+			packageName: this._packageName,
+			shaderRoot: this.shaderRoot ?? void 0
 		};
 	}
 	set project(value) {
 		const { weslSrc, rootModuleName, conditions } = value;
-		const { constants, packageName, libs } = value;
+		const { constants, packageName, libs, shaderRoot } = value;
 		if (conditions !== void 0) this._conditions = conditions;
 		if (constants !== void 0) this._constants = constants;
 		if (packageName !== void 0) this._packageName = packageName;
 		if (libs !== void 0) this._libs = libs;
 		if (rootModuleName !== void 0) this._rootModuleName = rootModuleName;
+		if (shaderRoot !== void 0 && !this.hasAttribute("shader-root")) this.shaderRoot = shaderRoot;
 		if (weslSrc) {
 			this.sources = weslSrc;
-			const tab = toTabName(rootModuleName ?? this._rootModuleName ?? "");
+			const tab = toTabName(this._rootModuleName ?? "");
 			if (tab) this.activeFile = tab;
 		}
 		this.updateLint();
@@ -28087,14 +27783,13 @@ var WgslEdit = class extends HTMLElement {
 		})).dest;
 	}
 	linkParams() {
-		const pkg = this._packageName ?? "package";
 		return {
 			weslSrc: this.sources,
-			rootModuleName: this._rootModuleName ?? fileToModulePath(this._activeFile, pkg, false),
+			rootModuleName: this._rootModuleName ?? this.activeModulePath(),
 			conditions: this._conditions,
 			constants: this._constants,
 			libs: this._libs,
-			packageName: pkg
+			packageName: this.pkgName()
 		};
 	}
 	get libs() {
@@ -28150,6 +27845,20 @@ var WgslEdit = class extends HTMLElement {
 		if (!value) this.setAttribute("gpu-lint", "off");
 		else this.removeAttribute("gpu-lint");
 	}
+	/** Persist edits to disk via the dev-server save endpoint.
+	*  Requires `wgslEditAutosave()` to be installed in vite.config.ts. */
+	get autosave() {
+		return this._devSaveListener !== null;
+	}
+	set autosave(value) {
+		if (value) {
+			this.enableDevSave();
+			this.setAttribute("autosave", "");
+		} else {
+			this.disableDevSave();
+			this.removeAttribute("autosave");
+		}
+	}
 	/** Whether to auto-fetch missing library packages from npm (default: true). */
 	get fetchLibs() {
 		return this._fetchLibs;
@@ -28199,13 +27908,15 @@ var WgslEdit = class extends HTMLElement {
 		if (value) this.setAttribute("shader-root", value);
 		else this.removeAttribute("shader-root");
 	}
+	/** Add a new file and switch to it. No-op if `name` already exists. */
 	addFile(name, content = "") {
 		if (this._files.has(name)) return;
-		this._files.set(name, { doc: Text.of(content.split("\n")) });
+		this._files.set(name, { doc: toDoc(content) });
 		this.switchToFile(name);
 		this.renderTabs();
 		this.dispatchFileChange("add", name);
 	}
+	/** Remove a file. No-op if it is missing or is the last remaining file. */
 	removeFile(name) {
 		if (!this._files.has(name) || this._files.size <= 1) return;
 		this._files.delete(name);
@@ -28216,6 +27927,7 @@ var WgslEdit = class extends HTMLElement {
 		this.renderTabs();
 		this.dispatchFileChange("remove", name);
 	}
+	/** Rename a file, preserving its document and editor state. No-op on collision. */
 	renameFile(oldName, newName) {
 		const state = this._files.get(oldName);
 		if (!state || this._files.has(newName)) return;
@@ -28231,28 +27943,36 @@ var WgslEdit = class extends HTMLElement {
 		this.saveCurrentFileState();
 		this._activeFile = name;
 		const fileState = this._files.get(name);
-		if (this.editorView) {
-			const changes = {
-				from: 0,
-				to: this.editorView.state.doc.length,
-				insert: fileState.doc.toString()
-			};
-			const effects = EditorView.scrollIntoView(fileState.scrollPos ?? 0);
-			this.editorView.dispatch({
-				changes,
-				selection: fileState.selection,
-				effects
-			});
+		const view = this.editorView;
+		if (view) {
+			const state = fileState.state ?? this.createFileState(fileState.doc);
+			fileState.state = state;
+			view.setState(state);
+			if (fileState.scrollPos != null) view.scrollDOM.scrollTop = fileState.scrollPos;
 		}
 		this.renderTabs();
 	}
+	/** Build a fresh EditorState seeded with `doc` and the current extension set. */
+	createFileState(doc) {
+		return EditorState.create({
+			doc,
+			extensions: this.buildExtensions()
+		});
+	}
 	saveCurrentFileState() {
 		const view = this.editorView;
-		const state = this._activeFile ? this._files.get(this._activeFile) : void 0;
-		if (!view || !state) return;
-		state.doc = view.state.doc;
-		state.selection = view.state.selection;
-		state.scrollPos = view.scrollDOM.scrollTop;
+		const fileState = this._activeFile ? this._files.get(this._activeFile) : void 0;
+		if (!view || !fileState) return;
+		fileState.state = view.state;
+		fileState.doc = view.state.doc;
+		fileState.selection = view.state.selection;
+		fileState.scrollPos = view.scrollDOM.scrollTop;
+	}
+	pkgName() {
+		return this._packageName ?? "package";
+	}
+	activeModulePath() {
+		return fileToModulePath(this._activeFile, this.pkgName(), false);
 	}
 	dispatchChange() {
 		this.dispatchEvent(new CustomEvent("change", { detail: this.project }));
@@ -28264,25 +27984,86 @@ var WgslEdit = class extends HTMLElement {
 		};
 		this.dispatchEvent(new CustomEvent("file-change", { detail }));
 	}
+	scheduleAutosave() {
+		this._dirtyFiles.add(this._activeFile);
+		clearTimeout(this._saveTimer);
+		this._saveTimer = setTimeout(() => this.fireAutosave(), 500);
+	}
+	/** Dispatch an `autosave` event with a fresh project snapshot and the dirty-file list. */
+	fireAutosave() {
+		const dirty = [...this._dirtyFiles];
+		this._dirtyFiles.clear();
+		const detail = {
+			project: this.project,
+			dirty
+		};
+		this.dispatchEvent(new CustomEvent("autosave", { detail }));
+	}
+	enableDevSave() {
+		if (this._devSaveListener) return;
+		this._devSaveListener = (e) => this.devSave(e);
+		this.addEventListener("autosave", this._devSaveListener);
+	}
+	disableDevSave() {
+		if (!this._devSaveListener) return;
+		this.removeEventListener("autosave", this._devSaveListener);
+		this._devSaveListener = null;
+	}
+	/** Built-in `autosave` listener: POST each dirty file to the dev-server save endpoint. */
+	async devSave(e) {
+		const root = this.shaderRoot;
+		if (!root) return;
+		const { project, dirty } = e.detail;
+		const weslSrc = project.weslSrc;
+		if (!weslSrc) return;
+		const pkg = this.pkgName();
+		for (const file of dirty) {
+			const content = weslSrc[fileToModulePath(file, pkg, false)];
+			if (content === void 0) continue;
+			try {
+				const res = await fetch(saveEndpoint, {
+					method: "POST",
+					headers: { "Content-Type": "application/json" },
+					body: JSON.stringify({
+						root,
+						file,
+						content
+					})
+				});
+				if (!res.ok) return this.devSaveFailed(`HTTP ${res.status}`);
+			} catch (err) {
+				return this.devSaveFailed(err instanceof Error ? err.message : String(err));
+			}
+		}
+	}
+	/** One-shot disable on first failure: avoids spamming the console on every keystroke. */
+	devSaveFailed(reason) {
+		this.disableDevSave();
+		console.error(`wgsl-edit: autosave disabled (${reason}). Make sure wgslEditAutosave() is installed in vite.config.ts.`);
+	}
+	/** First-time setup: read attributes, parse inline content, mount the EditorView. */
 	initEditor() {
 		this.readInitialAttributes();
 		this.parseInlineContent();
 		this._mediaQuery = matchMedia("(prefers-color-scheme: dark)");
 		this._mediaQuery.addEventListener("change", () => this.updateTheme());
 		const firstFile = this._files.keys().next().value;
-		const initialDoc = this._pendingSource ?? (firstFile ? this._files.get(firstFile).doc.toString() : "");
+		const firstDoc = firstFile && this._files.get(firstFile).doc.toString();
+		const initialDoc = this._pendingSource ?? firstDoc ?? "";
 		this._pendingSource = null;
 		if (firstFile) this._activeFile = firstFile;
 		else if (initialDoc) {
-			this._files.set("main.wesl", { doc: Text.of(initialDoc.split("\n")) });
+			this._files.set("main.wesl", { doc: toDoc(initialDoc) });
 			this._activeFile = "main.wesl";
 		}
-		const extensions = this.buildExtensions();
+		const state = this.createFileState(initialDoc);
+		const active = this._activeFile ? this._files.get(this._activeFile) : null;
+		if (active) {
+			active.state = state;
+			active.doc = state.doc;
+		}
 		this.editorView = new EditorView({
-			state: EditorState.create({
-				doc: initialDoc,
-				extensions
-			}),
+			state,
 			parent: this.editorContainer
 		});
 		this.renderTabs();
@@ -28299,6 +28080,7 @@ var WgslEdit = class extends HTMLElement {
 		const lintFromAttr = this.getAttribute("lint-from");
 		if (lintFromAttr) this.connectLintSource(lintFromAttr);
 	}
+	/** Assemble the full CodeMirror extension set for a fresh EditorState. */
 	buildExtensions() {
 		const baseTheme = EditorView.theme({
 			".cm-content": { padding: "0" },
@@ -28343,6 +28125,7 @@ var WgslEdit = class extends HTMLElement {
 					this._externalDiagnostics = [];
 					this.saveCurrentFileState();
 					this.dispatchChange();
+					if (!this._switchingFile) this.scheduleAutosave();
 				}
 			})
 		];
@@ -28353,11 +28136,11 @@ var WgslEdit = class extends HTMLElement {
 		return [EditorView.theme({}, { dark: isDark }), isDark ? darkColors : lightColors];
 	}
 	updateTheme() {
-		this.editorView?.dispatch({ effects: this.themeCompartment.reconfigure(this.resolveTheme()) });
+		this.reconfigure(this.themeCompartment, this.resolveTheme());
 	}
 	updateReadonly() {
 		const ext = EditorState.readOnly.of(this.readonly);
-		this.editorView?.dispatch({ effects: this.readonlyCompartment.reconfigure(ext) });
+		this.reconfigure(this.readonlyCompartment, ext);
 		this.renderTabs();
 	}
 	resolveLint() {
@@ -28365,7 +28148,7 @@ var WgslEdit = class extends HTMLElement {
 		const useGpuLint = this._gpuLint && !this._lintFromEl;
 		return createWeslLinter({
 			getSources: () => this.sources,
-			rootModule: () => fileToModulePath(this._activeFile, this._packageName ?? "package", false),
+			rootModule: () => this.activeModulePath(),
 			conditions: () => this._conditions,
 			packageName: () => this._packageName,
 			getExternalDiagnostics: () => this._externalDiagnostics,
@@ -28378,11 +28161,8 @@ var WgslEdit = class extends HTMLElement {
 	/** Link WESL->WGSL and validate via WebGPU, returning CodeMirror diagnostics. */
 	async gpuValidate() {
 		const { validateWgsl } = await import("./GpuValidator-D88-VTq9.js");
-		const params = this.linkParams();
-		const linked = await link(params);
-		const messages = await validateWgsl(linked.dest);
-		const pkg = params.packageName ?? "package";
-		return mapGpuDiagnostics(messages, linked, this._activeFile, pkg);
+		const linked = await link(this.linkParams());
+		return mapGpuDiagnostics(await validateWgsl(linked.dest), linked, this._activeFile, this.pkgName());
 	}
 	/** Fetch missing library packages, deduplicating in-flight requests. */
 	async fetchLibsOnDemand(names) {
@@ -28409,14 +28189,15 @@ var WgslEdit = class extends HTMLElement {
 		}
 	}
 	updateLint() {
-		this.editorView?.dispatch({ effects: this.lintCompartment.reconfigure(this.resolveLint()) });
+		this.reconfigure(this.lintCompartment, this.resolveLint());
 	}
 	/** Listen for compile-error/compile-success events from a lint source element. */
 	connectLintSource(id) {
 		const hadExternal = !!this._lintFromEl;
-		if (this._lintFromEl) {
-			this._lintFromEl.removeEventListener("compile-error", this._boundCompileError);
-			this._lintFromEl.removeEventListener("compile-success", this._boundCompileSuccess);
+		const prev = this._lintFromEl;
+		if (prev) {
+			prev.removeEventListener("compile-error", this._boundCompileError);
+			prev.removeEventListener("compile-success", this._boundCompileSuccess);
 			this._lintFromEl = null;
 		}
 		this._externalDiagnostics = [];
@@ -28428,23 +28209,24 @@ var WgslEdit = class extends HTMLElement {
 		}
 		if (hadExternal !== !!this._lintFromEl) this.updateLint();
 	}
+	/** Convert external compile-error locations into CodeMirror diagnostics for the active file. */
 	onCompileError(e) {
 		const detail = e.detail;
 		if (!this.editorView || detail.source === "wesl") return;
 		const doc = this.editorView.state.doc;
-		const pkg = this._packageName ?? "package";
-		const activeModule = fileToModulePath(this._activeFile, pkg, false);
-		this._externalDiagnostics = detail.locations.filter((loc) => {
-			if (!loc.file) return true;
-			return fileToModulePath(loc.file, pkg, false) === activeModule;
-		}).map((loc) => {
+		const pkg = this.pkgName();
+		const activeModule = this.activeModulePath();
+		const inActiveFile = (loc) => !loc.file || fileToModulePath(loc.file, pkg, false) === activeModule;
+		this._externalDiagnostics = detail.locations.filter(inActiveFile).map((loc) => {
 			const line = doc.line(Math.max(1, Math.min(loc.line, doc.lines)));
 			const from = Math.min(line.from + (loc.column ?? 0), doc.length);
+			const to = Math.min(from + (loc.length ?? 1), doc.length);
+			const { severity, message } = loc;
 			return {
 				from,
-				to: Math.min(from + (loc.length ?? 1), doc.length),
-				severity: loc.severity,
-				message: loc.message,
+				to,
+				severity,
+				message,
 				source: "WebGPU"
 			};
 		});
@@ -28459,21 +28241,20 @@ var WgslEdit = class extends HTMLElement {
 		return this._lineNumbers ? [] : EditorView.theme({ ".cm-gutters": { display: "none" } });
 	}
 	updateLineNumbers() {
-		const ext = this.resolveLineNumbers();
-		this.editorView?.dispatch({ effects: this.lineNumbersCompartment.reconfigure(ext) });
+		this.reconfigure(this.lineNumbersCompartment, this.resolveLineNumbers());
 	}
 	/** Parse script tags into _files. Supports single or multi-file via data-name. */
 	parseInlineContent() {
 		const scripts = Array.from(this.querySelectorAll("script[type=\"text/wgsl\"], script[type=\"text/wesl\"]"));
 		if (scripts.length === 0) {
 			const content = this.textContent?.trim() ?? "";
-			if (content) this._files.set("main.wesl", { doc: Text.of(content.split("\n")) });
+			if (content) this._files.set("main.wesl", { doc: toDoc(content) });
 			return;
 		}
 		for (const script of scripts) {
 			const name = script.getAttribute("data-name") || "main.wesl";
 			const content = script.textContent?.trim() ?? "";
-			this._files.set(name, { doc: Text.of(content.split("\n")) });
+			this._files.set(name, { doc: toDoc(content) });
 		}
 	}
 	renderTabs() {
@@ -28518,28 +28299,27 @@ var WgslEdit = class extends HTMLElement {
 		});
 		return btn;
 	}
+	/** Replace the tab name span with an editable input; commit on Enter/blur, cancel on Escape. */
 	startRenameTab(tab, nameSpan, oldName) {
 		const input = document.createElement("input");
 		input.className = "tab-rename";
 		input.value = oldName;
 		input.size = Math.max(oldName.length, 8);
+		const cancelRename = () => {
+			nameSpan.style.display = "";
+			input.remove();
+		};
 		const finishRename = () => {
 			const newName = input.value.trim() || oldName;
 			if (newName !== oldName && !this._files.has(newName)) this.renameFile(oldName, newName);
-			else {
-				nameSpan.style.display = "";
-				input.remove();
-			}
+			else cancelRename();
 		};
 		input.addEventListener("keydown", (e) => {
 			if (e.key === "Enter") {
 				e.preventDefault();
 				finishRename();
 			}
-			if (e.key === "Escape") {
-				nameSpan.style.display = "";
-				input.remove();
-			}
+			if (e.key === "Escape") cancelRename();
 		});
 		input.addEventListener("blur", finishRename);
 		input.addEventListener("input", () => {
@@ -28567,6 +28347,7 @@ var WgslEdit = class extends HTMLElement {
 		if (src) this.loadFromUrl(src);
 	}
 };
+/** Build a CodeMirror highlight style from a WESL color palette. */
 function weslColors(c) {
 	return syntaxHighlighting(HighlightStyle.define([
 		{
@@ -28634,24 +28415,7 @@ function weslColors(c) {
 		fontStyle: "normal"
 	} }));
 }
-/** Map GPU validation messages back to source positions via the source map. */
-function mapGpuDiagnostics(messages, linked, activeFile, pkg) {
-	const { sourceMap } = linked;
-	const active = fileToModulePath(activeFile, pkg, false);
-	return messages.flatMap((msg) => {
-		const srcPos = sourceMap.destToSrc(msg.offset);
-		if ((srcPos.src.path ? fileToModulePath(srcPos.src.path, pkg, false) : null) !== active) return [];
-		const endPos = sourceMap.destToSrc(msg.offset + msg.length);
-		const from = srcPos.position;
-		return {
-			from,
-			to: endPos.position > from ? endPos.position : from + 1,
-			severity: msg.severity,
-			message: msg.message,
-			source: "WebGPU"
-		};
-	});
-}
+/** Lazily build and cache the shared component stylesheet. */
 function getStyles() {
 	if (!cachedStyleSheet) {
 		cachedStyleSheet = new CSSStyleSheet();
@@ -28659,7 +28423,8 @@ function getStyles() {
 	}
 	return cachedStyleSheet;
 }
-/** Absorb instance properties set before custom element upgrade. */
+/** Absorb instance properties set before custom element upgrade.
+* Duplicated in WgslPlay.ts. Later, extract to a shared package. */
 function upgradeProperty(el, prop) {
 	if (Object.hasOwn(el, prop)) {
 		const value = el[prop];
@@ -28667,11 +28432,36 @@ function upgradeProperty(el, prop) {
 		el[prop] = value;
 	}
 }
+/** Build a CodeMirror Text doc from a string. */
+function toDoc(s) {
+	return Text.of(s.split("\n"));
+}
 /** Convert a module path or file path to a tab name: "package::main" -> "main", "main.wesl" -> "main.wesl" */
 function toTabName(key) {
 	if (key.includes("::")) return key.replace(/^[^:]+::/, "").replaceAll("::", "/");
 	return key.replace(/^\.\//, "");
 }
+/** Map GPU validation messages back to source positions via the source map. */
+function mapGpuDiagnostics(messages, linked, activeFile, pkg) {
+	const { sourceMap } = linked;
+	const active = fileToModulePath(activeFile, pkg, false);
+	return messages.flatMap((msg) => {
+		const srcPos = sourceMap.destToSrc(msg.offset);
+		const path = srcPos.src.path;
+		if ((path ? fileToModulePath(path, pkg, false) : null) !== active) return [];
+		const endPos = sourceMap.destToSrc(msg.offset + msg.length);
+		const from = srcPos.position;
+		const to = endPos.position > from ? endPos.position : from + 1;
+		const { severity, message } = msg;
+		return {
+			from,
+			to,
+			severity,
+			message,
+			source: "WebGPU"
+		};
+	});
+}
 //#endregion
 //#region src/index.ts
 if (!customElements.get("wgsl-edit")) customElements.define("wgsl-edit", WgslEdit);