wgsl-edit 0.0.18 → 0.0.19

package/dist/WgslEdit.d.ts

@@ -1,4 +1,4 @@
-import { Conditions, LinkParams } from "wesl";
+import { Conditions, LinkParams, WeslBundle } from "wesl";
 
 //#region src/WgslEdit.d.ts
 type WeslProject = Pick<LinkParams, "weslSrc" | "rootModuleName" | "conditions" | "constants" | "libs" | "packageName">;
@@ -20,6 +20,7 @@ declare class WgslEdit extends HTMLElement {
   private _lineNumbers;
   private _files;
   private _activeFile;
+  private _rootModuleName;
   private _tabs;
   private _lint;
   private _fetchLibs;
@@ -54,7 +55,12 @@ declare class WgslEdit extends HTMLElement {
   set project(value: WeslProject);
   /** Link/compile WESL sources into WGSL. Returns the compiled WGSL string. */
   link(options?: Partial<LinkParams>): Promise<string>;
-  /** Currently active file name. */
+  /** Library bundles for linking (set via project). */
+  get libs(): WeslBundle[];
+  /** Root module for linking (stable across tab switches). */
+  get rootModuleName(): string | undefined;
+  set rootModuleName(value: string | undefined);
+  /** Currently active file name (selected tab). */
   get activeFile(): string;
   /** Switch to a file by name. */
   set activeFile(name: string);

package/dist/WgslEdit.js

@@ -61,13 +61,14 @@ var WgslEdit = class extends HTMLElement {
 	_lineNumbers = false;
 	_files = /* @__PURE__ */ new Map();
 	_activeFile = "";
+	_rootModuleName;
 	_tabs = true;
 	_lint = "on";
 	_fetchLibs = true;
 	_conditions = {};
 	_packageName;
 	_libs = [];
-	_ignorePackages = ["constants", "test"];
+	_ignorePackages = ["constants", "env"];
 	_fetchingPkgs = /* @__PURE__ */ new Set();
 	_fetchedPkgs = /* @__PURE__ */ new Set();
 	_snackTimer;
@@ -181,16 +182,18 @@ var WgslEdit = class extends HTMLElement {
 		if (conditions !== void 0) this._conditions = conditions;
 		if (packageName !== void 0) this._packageName = packageName;
 		if (libs !== void 0) this._libs = libs;
+		if (rootModuleName !== void 0) this._rootModuleName = rootModuleName;
 		if (weslSrc) {
 			this.sources = weslSrc;
-			if (rootModuleName) this.activeFile = toTabName(rootModuleName);
+			const tab = toTabName(rootModuleName ?? this._rootModuleName ?? "");
+			if (tab) this.activeFile = tab;
 		}
 		this.updateLint();
 	}
 	/** Link/compile WESL sources into WGSL. Returns the compiled WGSL string. */
 	async link(options) {
 		const pkg = this._packageName ?? "package";
-		const rootModuleName = fileToModulePath(this._activeFile, pkg, false);
+		const rootModuleName = this._rootModuleName ?? fileToModulePath(this._activeFile, pkg, false);
 		return (await link({
 			weslSrc: this.sources,
 			rootModuleName,
@@ -200,7 +203,19 @@ var WgslEdit = class extends HTMLElement {
 			...options
 		})).dest;
 	}
-	/** Currently active file name. */
+	/** Library bundles for linking (set via project). */
+	get libs() {
+		return this._libs;
+	}
+	/** Root module for linking (stable across tab switches). */
+	get rootModuleName() {
+		return this._rootModuleName;
+	}
+	set rootModuleName(value) {
+		this._rootModuleName = value;
+		this.dispatchChange();
+	}
+	/** Currently active file name (selected tab). */
 	get activeFile() {
 		return this._activeFile;
 	}
@@ -348,11 +363,11 @@ var WgslEdit = class extends HTMLElement {
 		}
 	}
 	dispatchChange() {
-		const { source, sources, conditions, _activeFile: activeFile } = this;
+		const { source, sources, conditions, _rootModuleName: rootModuleName } = this;
 		const detail = {
 			source,
 			sources,
-			activeFile,
+			rootModuleName,
 			conditions
 		};
 		this.dispatchEvent(new CustomEvent("change", { detail }));

package/dist/wgsl-edit.js

@@ -19307,11 +19307,78 @@ function emptyScope(parent, kind = "scope") {
 }
 
 //#endregion
-//#region ../wesl/src/LowerAndEmit.ts
-/** Valid WGSL standard attributes (from spec). Non-WGSL attributes are stripped.
-* See: https://www.w3.org/TR/WGSL/#attributes
-* Note: @builtin, @diagnostic, @interpolate are parsed as separate attribute types. */
-const wgslStandardAttributes$1 = new Set([
+//#region ../wesl/src/StandardTypes.ts
+const stdFns = `bitcast all any select arrayLength 
+  abs acos acosh asin asinh atan atanh atan2 ceil clamp cos cosh 
+  countLeadingZeros countOneBits countTrailingZeros cross 
+  degrees determinant distance dot dot4U8Packed dot4I8Packed 
+  exp exp2 extractBits faceForward firstLeadingBit firstTrailingBit 
+  floor fma fract frexp insertBits inverseSqrt ldexp length log log2
+  max min mix modf normalize pow quantizeToF16 radians reflect refract
+  reverseBits round saturate sign sin sinh smoothstep sqrt step tan tanh
+  transpose trunc
+  dpdx dpdxCoarse dpdxFine dpdy dpdyCoarse dpdyFine fwidth 
+  fwidthCoarse fwidthFine
+  textureDimensions textureGather textureGatherCompare textureLoad
+  textureNumLayers textureNumLevels textureNumSamples
+  textureSample textureSampleBias textureSampleCompare textureSampleCompareLevel
+  textureSampleGrad textureSampleLevel textureSampleBaseClampToEdge
+  textureStore
+  atomicLoad atomicStore atomicAdd atomicSub atomicMax atomicMin
+  atomicAnd atomicOr atomicXor atomicExchange atomicCompareExchangeWeak
+  pack4x8snorm pack4x8unorm pack4xI8 pack4xU8 pack4xI8Clamp pack4xU8Clamp
+  pack2x16snorm pack2x16unorm pack2x16float
+  unpack4x8snorm unpack4x8unorm unpack4xI8 unpack4xU8 
+  unpack2x16snorm unpack2x16unorm unpack2x16float
+  storageBarrier textureBarrier workgroupBarrier workgroupUniformLoad
+  subgroupAdd subgroupAll subgroupAnd subgroupAny subgroupBallot 
+  subgroupBroadcast subgroupBroadcastFirst subgroupElect 
+  subgroupExclusiveAdd subgroupExclusiveMul subgroupInclusiveAdd 
+  subgroupInclusiveMul subgroupMax subgroupMin subgroupMul subgroupOr 
+  subgroupShuffle subgroupShuffleUp subgroupShuffleXor subgroupXor
+  quadBroadcast quadSwapDiagonal quadSwapX quadSwapY`.split(/\s+/);
+const sampledTextureTypes = `
+  texture_1d texture_2d texture_2d_array texture_3d 
+  texture_cube texture_cube_array
+`;
+const multisampledTextureTypes = `
+  texture_multisampled_2d texture_depth_multisampled_2d
+`;
+const textureStorageTypes = `
+  texture_storage_1d texture_storage_2d texture_storage_2d_array 
+  texture_storage_3d
+`;
+const stdTypes = `array atomic bool f16 f32 i32 
+  mat2x2 mat2x3 mat2x4 mat3x2 mat3x3 mat3x4 mat4x2 mat4x3 mat4x4
+  mat2x2f mat2x3f mat2x4f mat3x2f mat3x3f mat3x4f
+  mat4x2f mat4x3f mat4x4f
+  mat2x2h mat2x3h mat2x4h mat3x2h mat3x3h mat3x4h
+  mat4x2h mat4x3h mat4x4h
+  u32 vec2 vec3 vec4 ptr
+  vec2i vec3i vec4i vec2u vec3u vec4u
+  vec2f vec3f vec4f vec2h vec3h vec4h
+  ${sampledTextureTypes}
+  ${multisampledTextureTypes}
+  texture_external
+  ${textureStorageTypes}
+  texture_depth_2d texture_depth_2d_array texture_depth_cube
+  texture_depth_cube_array
+  sampler sampler_comparison
+  rgba8unorm rgba8snorm rgba8uint rgba8sint
+  rgba16uint rgba16sint rgba16float 
+  r32uint r32sint r32float rg32uint rg32sint rg32float
+  rgba32uint rgba32sint rgba32float
+  bgra8unorm`.split(/\s+/);
+/** https://www.w3.org/TR/WGSL/#predeclared-enumerants  */
+const stdEnumerants = `read write read_write 
+  function private workgroup uniform storage
+  rgba8unorm rgba8snorm rgba8uint rgba8sint 
+  rgba16uint rgba16sint rgba16float 
+  r32uint r32sint r32float rg32uint rg32sint rg32float
+  rgba32uint rgba32sint rgba32float bgra8unorm`.split(/\s+/);
+/** WGSL standard attributes whose params need binding (e.g., @workgroup_size).
+* See: https://www.w3.org/TR/WGSL/#attributes */
+const wgslStandardAttributes = new Set([
 	"align",
 	"binding",
 	"blend_src",
@@ -19327,6 +19394,21 @@ const wgslStandardAttributes$1 = new Set([
 	"vertex",
 	"workgroup_size"
 ]);
+/** return true if the name is for a built in type (not a user struct) */
+function stdType(name) {
+	return stdTypes.includes(name);
+}
+/** return true if the name is for a built in fn (not a user function) */
+function stdFn(name) {
+	return stdFns.includes(name) || stdType(name);
+}
+/** return true if the name is for a built in enumerant */
+function stdEnumerant(name) {
+	return stdEnumerants.includes(name);
+}
+
+//#endregion
+//#region ../wesl/src/LowerAndEmit.ts
 /** Traverse the AST, starting from root elements, emitting WGSL for each. */
 function lowerAndEmit(params) {
 	const { srcBuilder, rootElems, conditions } = params;
@@ -19606,7 +19688,7 @@ function emitAttribute(e, ctx) {
 	const { kind } = e.attribute;
 	if (kind === "@if" || kind === "@elif" || kind === "@else") return false;
 	if (kind === "@attribute") {
-		if (!wgslStandardAttributes$1.has(e.attribute.name)) return false;
+		if (!wgslStandardAttributes.has(e.attribute.name)) return false;
 		emitStandardAttribute(e, ctx);
 		return true;
 	}
@@ -22087,115 +22169,16 @@ function flatImports(ast, conditions) {
 	return flat;
 }
 
-//#endregion
-//#region ../wesl/src/StandardTypes.ts
-const stdFns = `bitcast all any select arrayLength 
-  abs acos acosh asin asinh atan atanh atan2 ceil clamp cos cosh 
-  countLeadingZeros countOneBits countTrailingZeros cross 
-  degrees determinant distance dot dot4U8Packed dot4I8Packed 
-  exp exp2 extractBits faceForward firstLeadingBit firstTrailingBit 
-  floor fma fract frexp insertBits inverseSqrt ldexp length log log2
-  max min mix modf normalize pow quantizeToF16 radians reflect refract
-  reverseBits round saturate sign sin sinh smoothstep sqrt step tan tanh
-  transpose trunc
-  dpdx dpdxCoarse dpdxFine dpdy dpdyCoarse dpdyFine fwidth 
-  fwidthCoarse fwidthFine
-  textureDimensions textureGather textureGatherCompare textureLoad
-  textureNumLayers textureNumLevels textureNumSamples
-  textureSample textureSampleBias textureSampleCompare textureSampleCompareLevel
-  textureSampleGrad textureSampleLevel textureSampleBaseClampToEdge
-  textureStore
-  atomicLoad atomicStore atomicAdd atomicSub atomicMax atomicMin
-  atomicAnd atomicOr atomicXor atomicExchange atomicCompareExchangeWeak
-  pack4x8snorm pack4x8unorm pack4xI8 pack4xU8 pack4xI8Clamp pack4xU8Clamp
-  pack2x16snorm pack2x16unorm pack2x16float
-  unpack4x8snorm unpack4x8unorm unpack4xI8 unpack4xU8 
-  unpack2x16snorm unpack2x16unorm unpack2x16float
-  storageBarrier textureBarrier workgroupBarrier workgroupUniformLoad
-  subgroupAdd subgroupAll subgroupAnd subgroupAny subgroupBallot 
-  subgroupBroadcast subgroupBroadcastFirst subgroupElect 
-  subgroupExclusiveAdd subgroupExclusiveMul subgroupInclusiveAdd 
-  subgroupInclusiveMul subgroupMax subgroupMin subgroupMul subgroupOr 
-  subgroupShuffle subgroupShuffleUp subgroupShuffleXor subgroupXor
-  quadBroadcast quadSwapDiagonal quadSwapX quadSwapY`.split(/\s+/);
-const sampledTextureTypes = `
-  texture_1d texture_2d texture_2d_array texture_3d 
-  texture_cube texture_cube_array
-`;
-const multisampledTextureTypes = `
-  texture_multisampled_2d texture_depth_multisampled_2d
-`;
-const textureStorageTypes = `
-  texture_storage_1d texture_storage_2d texture_storage_2d_array 
-  texture_storage_3d
-`;
-const stdTypes = `array atomic bool f16 f32 i32 
-  mat2x2 mat2x3 mat2x4 mat3x2 mat3x3 mat3x4 mat4x2 mat4x3 mat4x4
-  mat2x2f mat2x3f mat2x4f mat3x2f mat3x3f mat3x4f
-  mat4x2f mat4x3f mat4x4f
-  mat2x2h mat2x3h mat2x4h mat3x2h mat3x3h mat3x4h
-  mat4x2h mat4x3h mat4x4h
-  u32 vec2 vec3 vec4 ptr
-  vec2i vec3i vec4i vec2u vec3u vec4u
-  vec2f vec3f vec4f vec2h vec3h vec4h
-  ${sampledTextureTypes}
-  ${multisampledTextureTypes}
-  texture_external
-  ${textureStorageTypes}
-  texture_depth_2d texture_depth_2d_array texture_depth_cube
-  texture_depth_cube_array
-  sampler sampler_comparison
-  rgba8unorm rgba8snorm rgba8uint rgba8sint
-  rgba16uint rgba16sint rgba16float 
-  r32uint r32sint r32float rg32uint rg32sint rg32float
-  rgba32uint rgba32sint rgba32float
-  bgra8unorm`.split(/\s+/);
-/** https://www.w3.org/TR/WGSL/#predeclared-enumerants  */
-const stdEnumerants = `read write read_write 
-  function private workgroup uniform storage
-  rgba8unorm rgba8snorm rgba8uint rgba8sint 
-  rgba16uint rgba16sint rgba16float 
-  r32uint r32sint r32float rg32uint rg32sint rg32float
-  rgba32uint rgba32sint rgba32float bgra8unorm`.split(/\s+/);
-/** return true if the name is for a built in type (not a user struct) */
-function stdType(name) {
-	return stdTypes.includes(name);
-}
-/** return true if the name is for a built in fn (not a user function) */
-function stdFn(name) {
-	return stdFns.includes(name) || stdType(name);
-}
-/** return true if the name is for a built in enumerant */
-function stdEnumerant(name) {
-	return stdEnumerants.includes(name);
-}
-
 //#endregion
 //#region ../wesl/src/BindIdents.ts
-/** WGSL standard attributes whose params need binding (e.g., @workgroup_size). */
-const wgslStandardAttributes = new Set([
-	"align",
-	"binding",
-	"blend_src",
-	"compute",
-	"const",
-	"fragment",
-	"group",
-	"id",
-	"invariant",
-	"location",
-	"must_use",
-	"size",
-	"vertex",
-	"workgroup_size"
-]);
 /** Bind ref idents to declarations and mangle global declaration names. */
 function bindIdents(params) {
 	const { rootAst, resolver, virtuals, accumulateUnbound } = params;
 	const { conditions = {}, mangler = minimalMangle } = params;
+	const { discoveryMode } = params;
 	const packageName = rootAst.srcModule.modulePath.split("::")[0];
-	const validRootDecls = findValidRootDecls(rootAst.rootScope, conditions);
-	const { globalNames, knownDecls } = initRootDecls(validRootDecls);
+	const rootDecls = discoveryMode ? findAllRootDecls(rootAst.rootScope) : findValidRootDecls(rootAst.rootScope, conditions);
+	const { globalNames, knownDecls } = initRootDecls(rootDecls);
 	const bindContext = {
 		resolver,
 		conditions,
@@ -22206,13 +22189,14 @@ function bindIdents(params) {
 		foundScopes: /* @__PURE__ */ new Set(),
 		globalNames,
 		globalStatements: /* @__PURE__ */ new Map(),
-		unbound: accumulateUnbound ? [] : void 0
+		unbound: accumulateUnbound ? [] : void 0,
+		discoveryMode
 	};
 	const liveDecls = {
-		decls: new Map(validRootDecls.map((d) => [d.originalName, d])),
+		decls: new Map(rootDecls.map((d) => [d.originalName, d])),
 		parent: null
 	};
-	const fromRootDecls = validRootDecls.flatMap((decl) => processDependentScope(decl, bindContext));
+	const fromRootDecls = rootDecls.flatMap((decl) => processDependentScope(decl, bindContext));
 	const fromRefs = bindIdentsRecursive(rootAst.rootScope, bindContext, liveDecls);
 	const newStatements = [...bindContext.globalStatements.values()];
 	return {
@@ -22248,10 +22232,11 @@ function* validItems(scope, conditions) {
 }
 /** Find all conditionally valid declarations at the root level. */
 function findValidRootDecls(rootScope, conditions) {
-	const found = [];
-	for (const item of validItems(rootScope, conditions)) if (item.kind === "decl") found.push(item);
-	else if (item.kind === "partial") collectDecls(item, found);
-	return found;
+	return collectDecls(validItems(rootScope, conditions));
+}
+/** Find all declarations at the root level, ignoring conditions. */
+function findAllRootDecls(rootScope) {
+	return collectDecls(rootScope.contents);
 }
 /** Find a public declaration with the given original name. */
 function publicDecl(scope, name, conditions) {
@@ -22319,10 +22304,11 @@ function handleRef(ident, liveDecls, bindContext) {
 	}
 	if (!bindContext.unbound) failIdent(ident, `unresolved identifier '${ident.originalName}'`);
 }
+/** Follow new global declarations into their dependent scopes. */
 function handleDecls(newGlobals, bindContext) {
 	return newGlobals.flatMap((decl) => processDependentScope(decl, bindContext));
 }
-/** If found declaration is new, mangle its name. Return if it's a global declaration. */
+/** If found declaration is new, mangle its name. @return the decl if it's global. */
 function handleNewDecl(refIdent, foundDecl, ctx) {
 	const { decl, moduleAst } = foundDecl;
 	const { knownDecls, globalNames, mangler, globalStatements } = ctx;
@@ -22349,7 +22335,8 @@ function findDeclInModule(ident, liveDecls) {
 /** Match a ref ident to a declaration in another module via import or qualified ident. */
 function findQualifiedImport(refIdent, ctx) {
 	const { conditions, unbound, discoveryMode } = ctx;
-	const flatImps = flatImports(refIdent.ast, discoveryMode ? void 0 : conditions);
+	const conds = discoveryMode ? void 0 : conditions;
+	const flatImps = flatImports(refIdent.ast, conds);
 	const identParts = refIdent.originalName.split("::");
 	const pathParts = matchingImport(identParts, flatImps) ?? qualifiedIdent(identParts);
 	if (!pathParts) {
@@ -22403,7 +22390,7 @@ function virtualModule(moduleName, ctx) {
 /** Get cached valid root declarations, computing on first access. */
 function getValidRootDecls(rootScope, conditions) {
 	const lexScope = rootScope;
-	if (!lexScope._validRootDecls) lexScope._validRootDecls = findValidRootDecls(rootScope, conditions);
+	lexScope._validRootDecls ??= findValidRootDecls(rootScope, conditions);
 	return lexScope._validRootDecls;
 }
 /** Given a global declIdent, return the liveDecls for its root scope. */
@@ -22432,150 +22419,18 @@ function setMangledName(proposedName, decl, globalNames, srcModule, mangler) {
 function stdWgsl(name) {
 	return stdType(name) || stdFn(name) || stdEnumerant(name);
 }
+/** @return identParts if it's a qualified path (has ::). */
 function qualifiedIdent(identParts) {
 	if (identParts.length > 1) return identParts;
 }
-/** Collect all declarations in a scope (used when scope is already validated). */
-function collectDecls(scope, found) {
-	for (const item of scope.contents) if (item.kind === "decl") found.push(item);
-	else if (item.kind === "partial") collectDecls(item, found);
-}
-
-//#endregion
-//#region ../wesl/src/discovery/PackageNameUtils.ts
-/** Generate npm package name variations from sanitized WESL identifier.
-*
-* Uses double-underscore encoding to distinguish scoped vs unscoped packages:
-* - Has __ → scoped package (try @scope/pkg variants)
-* - No __ → unscoped package (try pkg variants)
-*
-* Examples:
-*   "lygia__shader_utils" → ["@lygia/shader_utils", "@lygia/shader-utils"]
-*   "random_wgsl" → ["random_wgsl", "random-wgsl"]
-*/
-function* npmNameVariations(sanitizedPath) {
-	const [pkg, sub] = breakAt(sanitizedPath, "/");
-	let pkgName = pkg;
-	let scopePrefix = "";
-	if (pkg.includes("__")) {
-		const [scope, ...rest] = pkg.split("__");
-		pkgName = rest.join("__");
-		scopePrefix = `@${scope}/`;
-	}
-	yield `${scopePrefix}${pkgName}${sub}`;
-	yield `${scopePrefix}${pkgName.replaceAll("_", "-")}${sub}`;
-}
-/** Break string at first occurrence of delimiter.
-* @returns [before, after] where after includes the delimiter */
-function breakAt(str, delimiter) {
-	const index = str.indexOf(delimiter);
-	if (index === -1) return [str, ""];
-	return [str.slice(0, index), str.slice(index)];
-}
-
-//#endregion
-//#region ../wesl/src/LinkedWesl.ts
-/**
-* Multiple WESL files that have been linked together to produce WGSL code.
-*
-* Call {@link LinkedWesl.createShaderModule} on a {@link WeslDevice}
-* to make the error reporting aware of the WESL code.
-*/
-var LinkedWesl = class {
-	sourceMap;
-	constructor(sourceMap) {
-		this.sourceMap = sourceMap;
-	}
-	/**
-	* Creates a {@link GPUShaderModule}.
-	* When errors occur, they will point at the original WESL source code.
-	*
-	* The compilation info {@link GPUShaderModule.getCompilationInfo}
-	* can be remapped with {@link mapGPUCompilationInfo}
-	* @param device GPUDevice. Preferably a {@link WeslDevice} for better error reporting.
-	* @param descriptor - Description of the {@link GPUShaderModule} to create.
-	*/
-	createShaderModule(device, descriptor) {
-		if (!("injectError" in device)) return device.createShaderModule({
-			...descriptor,
-			code: this.dest
-		});
-		device.pushErrorScope("validation");
-		const module = device.createShaderModule({
-			...descriptor,
-			code: this.dest
-		});
-		device.popErrorScope();
-		const { promise, resolve } = Promise.withResolvers();
-		device.injectError("validation", promise);
-		module.getCompilationInfo().then((compilationInfo) => {
-			if (compilationInfo.messages.length === 0) {
-				resolve(null);
-				return;
-			}
-			const mappedCompilationInfo = this.mapGPUCompilationInfo(compilationInfo);
-			const errorMessage = compilationInfoToErrorMessage(mappedCompilationInfo, module);
-			assertThatDebug(errorMessage !== null);
-			const error = new GPUValidationError(errorMessage);
-			error.cause = /* @__PURE__ */ new Error("createShaderModule failed");
-			error.compilationInfo = mappedCompilationInfo;
-			resolve(error);
-		});
-		return module;
-	}
-	/**
-	* Use {@link LinkedWesl.createShaderModule} for a
-	* better error reporting experience.
-	*/
-	get dest() {
-		return this.sourceMap.dest.text;
-	}
-	/** Turns raw compilation info into compilation info
-	* that points at the WESL sources. */
-	mapGPUCompilationInfo(compilationInfo) {
-		return {
-			__brand: compilationInfo.__brand,
-			messages: compilationInfo.messages.map((v) => this.mapGPUCompilationMessage(v))
-		};
-	}
-	mapGPUCompilationMessage(message) {
-		const srcMap = this.sourceMap;
-		const srcPosition = srcMap.destToSrc(message.offset);
-		const length = (message.length > 0 ? srcMap.destToSrc(message.offset + message.length) : srcPosition).position - srcPosition.position;
-		const [lineNum, linePos] = offsetToLineNumber(srcPosition.position, srcPosition.src.text);
-		return {
-			__brand: message.__brand,
-			type: message.type,
-			message: message.message,
-			offset: srcPosition.position,
-			length,
-			lineNum,
-			linePos,
-			module: {
-				url: srcPosition.src.path ?? "",
-				text: srcPosition.src.text
-			}
-		};
-	}
-};
-/**
-* Tries to imitate the way the browser logs the compilation info.
-* Does not do the remapping.
-* @returns A string with errors, or `null` if there were no compilation messages.
-*/
-function compilationInfoToErrorMessage(compilationInfo, shaderModule) {
-	if (compilationInfo.messages.length === 0) return null;
-	let result = `Compilation log for [Invalid ShaderModule (${shaderModule.label || "unlabled"})]:\n`;
-	const errorCount = compilationInfo.messages.filter((v) => v.type === "error").length;
-	if (errorCount > 0) result += `${errorCount} error(s) generated while compiling the shader:\n`;
-	for (const message of compilationInfo.messages) {
-		const { lineNum, linePos } = message;
-		result += `${message.module.url}:${lineNum}:${linePos}`;
-		result += ` ${message.type}: ${message.message}\n`;
-		const source = message.module.text;
-		if (source) result += errorHighlight(source, [message.offset, message.offset + message.length]).join("\n");
-	}
-	return result;
+/** Collect all declarations from scope items, recursing into partial scopes. */
+function collectDecls(items) {
+	return [...items].flatMap((item) => {
+		const { kind } = item;
+		if (kind === "decl") return [item];
+		if (kind === "partial") return collectDecls(item.contents);
+		return [];
+	});
 }
 
 //#endregion
@@ -22727,6 +22582,143 @@ function findInVariants(sources, basePath, extensions = ["wesl", "wgsl"]) {
 	}
 }
 
+//#endregion
+//#region ../wesl/src/discovery/PackageNameUtils.ts
+/** Generate npm package name variations from sanitized WESL identifier.
+*
+* Uses double-underscore encoding to distinguish scoped vs unscoped packages:
+* - Has __ → scoped package (try @scope/pkg variants)
+* - No __ → unscoped package (try pkg variants)
+*
+* Examples:
+*   "lygia__shader_utils" → ["@lygia/shader_utils", "@lygia/shader-utils"]
+*   "random_wgsl" → ["random_wgsl", "random-wgsl"]
+*/
+function* npmNameVariations(sanitizedPath) {
+	const [pkg, sub] = breakAt(sanitizedPath, "/");
+	let pkgName = pkg;
+	let scopePrefix = "";
+	if (pkg.includes("__")) {
+		const [scope, ...rest] = pkg.split("__");
+		pkgName = rest.join("__");
+		scopePrefix = `@${scope}/`;
+	}
+	yield `${scopePrefix}${pkgName}${sub}`;
+	yield `${scopePrefix}${pkgName.replaceAll("_", "-")}${sub}`;
+}
+/** Break string at first occurrence of delimiter.
+* @returns [before, after] where after includes the delimiter */
+function breakAt(str, delimiter) {
+	const index = str.indexOf(delimiter);
+	if (index === -1) return [str, ""];
+	return [str.slice(0, index), str.slice(index)];
+}
+
+//#endregion
+//#region ../wesl/src/LinkedWesl.ts
+/**
+* Multiple WESL files that have been linked together to produce WGSL code.
+*
+* Call {@link LinkedWesl.createShaderModule} on a {@link WeslDevice}
+* to make the error reporting aware of the WESL code.
+*/
+var LinkedWesl = class {
+	sourceMap;
+	constructor(sourceMap) {
+		this.sourceMap = sourceMap;
+	}
+	/**
+	* Creates a {@link GPUShaderModule}.
+	* When errors occur, they will point at the original WESL source code.
+	*
+	* The compilation info {@link GPUShaderModule.getCompilationInfo}
+	* can be remapped with {@link mapGPUCompilationInfo}
+	* @param device GPUDevice. Preferably a {@link WeslDevice} for better error reporting.
+	* @param descriptor - Description of the {@link GPUShaderModule} to create.
+	*/
+	createShaderModule(device, descriptor) {
+		if (!("injectError" in device)) return device.createShaderModule({
+			...descriptor,
+			code: this.dest
+		});
+		device.pushErrorScope("validation");
+		const module = device.createShaderModule({
+			...descriptor,
+			code: this.dest
+		});
+		device.popErrorScope();
+		const { promise, resolve } = Promise.withResolvers();
+		device.injectError("validation", promise);
+		module.getCompilationInfo().then((compilationInfo) => {
+			if (compilationInfo.messages.length === 0) {
+				resolve(null);
+				return;
+			}
+			const mappedCompilationInfo = this.mapGPUCompilationInfo(compilationInfo);
+			const errorMessage = compilationInfoToErrorMessage(mappedCompilationInfo, module);
+			assertThatDebug(errorMessage !== null);
+			const error = new GPUValidationError(errorMessage);
+			error.cause = /* @__PURE__ */ new Error("createShaderModule failed");
+			error.compilationInfo = mappedCompilationInfo;
+			resolve(error);
+		});
+		return module;
+	}
+	/**
+	* Use {@link LinkedWesl.createShaderModule} for a
+	* better error reporting experience.
+	*/
+	get dest() {
+		return this.sourceMap.dest.text;
+	}
+	/** Turns raw compilation info into compilation info
+	* that points at the WESL sources. */
+	mapGPUCompilationInfo(compilationInfo) {
+		return {
+			__brand: compilationInfo.__brand,
+			messages: compilationInfo.messages.map((v) => this.mapGPUCompilationMessage(v))
+		};
+	}
+	mapGPUCompilationMessage(message) {
+		const srcMap = this.sourceMap;
+		const srcPosition = srcMap.destToSrc(message.offset);
+		const length = (message.length > 0 ? srcMap.destToSrc(message.offset + message.length) : srcPosition).position - srcPosition.position;
+		const [lineNum, linePos] = offsetToLineNumber(srcPosition.position, srcPosition.src.text);
+		return {
+			__brand: message.__brand,
+			type: message.type,
+			message: message.message,
+			offset: srcPosition.position,
+			length,
+			lineNum,
+			linePos,
+			module: {
+				url: srcPosition.src.path ?? "",
+				text: srcPosition.src.text
+			}
+		};
+	}
+};
+/**
+* Tries to imitate the way the browser logs the compilation info.
+* Does not do the remapping.
+* @returns A string with errors, or `null` if there were no compilation messages.
+*/
+function compilationInfoToErrorMessage(compilationInfo, shaderModule) {
+	if (compilationInfo.messages.length === 0) return null;
+	let result = `Compilation log for [Invalid ShaderModule (${shaderModule.label || "unlabled"})]:\n`;
+	const errorCount = compilationInfo.messages.filter((v) => v.type === "error").length;
+	if (errorCount > 0) result += `${errorCount} error(s) generated while compiling the shader:\n`;
+	for (const message of compilationInfo.messages) {
+		const { lineNum, linePos } = message;
+		result += `${message.module.url}:${lineNum}:${linePos}`;
+		result += ` ${message.type}: ${message.message}\n`;
+		const source = message.module.text;
+		if (source) result += errorHighlight(source, [message.offset, message.offset + message.length]).join("\n");
+	}
+	return result;
+}
+
 //#endregion
 //#region ../wesl/src/SrcMap.ts
 /** map text ranges in multiple src texts to a single dest text */
@@ -28092,13 +28084,14 @@ var WgslEdit = class extends HTMLElement {
 	_lineNumbers = false;
 	_files = /* @__PURE__ */ new Map();
 	_activeFile = "";
+	_rootModuleName;
 	_tabs = true;
 	_lint = "on";
 	_fetchLibs = true;
 	_conditions = {};
 	_packageName;
 	_libs = [];
-	_ignorePackages = ["constants", "test"];
+	_ignorePackages = ["constants", "env"];
 	_fetchingPkgs = /* @__PURE__ */ new Set();
 	_fetchedPkgs = /* @__PURE__ */ new Set();
 	_snackTimer;
@@ -28212,16 +28205,18 @@ var WgslEdit = class extends HTMLElement {
 		if (conditions !== void 0) this._conditions = conditions;
 		if (packageName !== void 0) this._packageName = packageName;
 		if (libs !== void 0) this._libs = libs;
+		if (rootModuleName !== void 0) this._rootModuleName = rootModuleName;
 		if (weslSrc) {
 			this.sources = weslSrc;
-			if (rootModuleName) this.activeFile = toTabName(rootModuleName);
+			const tab = toTabName(rootModuleName ?? this._rootModuleName ?? "");
+			if (tab) this.activeFile = tab;
 		}
 		this.updateLint();
 	}
 	/** Link/compile WESL sources into WGSL. Returns the compiled WGSL string. */
 	async link(options) {
 		const pkg = this._packageName ?? "package";
-		const rootModuleName = fileToModulePath(this._activeFile, pkg, false);
+		const rootModuleName = this._rootModuleName ?? fileToModulePath(this._activeFile, pkg, false);
 		return (await link({
 			weslSrc: this.sources,
 			rootModuleName,
@@ -28231,7 +28226,19 @@ var WgslEdit = class extends HTMLElement {
 			...options
 		})).dest;
 	}
-	/** Currently active file name. */
+	/** Library bundles for linking (set via project). */
+	get libs() {
+		return this._libs;
+	}
+	/** Root module for linking (stable across tab switches). */
+	get rootModuleName() {
+		return this._rootModuleName;
+	}
+	set rootModuleName(value) {
+		this._rootModuleName = value;
+		this.dispatchChange();
+	}
+	/** Currently active file name (selected tab). */
 	get activeFile() {
 		return this._activeFile;
 	}
@@ -28379,11 +28386,11 @@ var WgslEdit = class extends HTMLElement {
 		}
 	}
 	dispatchChange() {
-		const { source, sources, conditions, _activeFile: activeFile } = this;
+		const { source, sources, conditions, _rootModuleName: rootModuleName } = this;
 		const detail = {
 			source,
 			sources,
-			activeFile,
+			rootModuleName,
 			conditions
 		};
 		this.dispatchEvent(new CustomEvent("change", { detail }));

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "wgsl-edit",
   "description": "Web component for editing WGSL/WESL with CodeMirror",
-  "version": "0.0.18",
+  "version": "0.0.19",
   "type": "module",
   "files": [
     "dist",
@@ -36,9 +36,9 @@
     "@codemirror/view": "^6.0.0",
     "@lezer/highlight": "^1.2.1",
     "codemirror": "^6.0.0",
-    "lezer-wesl": "0.6.43",
-    "wesl": "0.7.22",
-    "wesl-fetch": "0.0.10"
+    "wesl": "0.7.23",
+    "lezer-wesl": "0.6.44",
+    "wesl-fetch": "0.0.11"
   },
   "devDependencies": {
     "open": "^10.0.0",

package/src/WgslEdit.ts

@@ -139,13 +139,14 @@ export class WgslEdit extends HTMLElement {
 
   private _files: Map<string, FileState> = new Map();
   private _activeFile = "";
+  private _rootModuleName: string | undefined;
   private _tabs = true;
   private _lint: LintMode = "on";
   private _fetchLibs = true;
   private _conditions: Conditions = {};
   private _packageName: string | undefined;
   private _libs: WeslBundle[] = [];
-  private _ignorePackages: string[] = ["constants", "test"];
+  private _ignorePackages: string[] = ["constants", "env"];
   private _fetchingPkgs = new Set<string>();
   private _fetchedPkgs = new Set<string>();
   private _snackTimer: ReturnType<typeof setTimeout> | undefined;
@@ -279,10 +280,12 @@ export class WgslEdit extends HTMLElement {
     if (conditions !== undefined) this._conditions = conditions;
     if (packageName !== undefined) this._packageName = packageName;
     if (libs !== undefined) this._libs = libs;
+    if (rootModuleName !== undefined) this._rootModuleName = rootModuleName;
 
     if (weslSrc) {
       this.sources = weslSrc;
-      if (rootModuleName) this.activeFile = toTabName(rootModuleName);
+      const tab = toTabName(rootModuleName ?? this._rootModuleName ?? "");
+      if (tab) this.activeFile = tab;
     }
     this.updateLint();
   }
@@ -290,7 +293,8 @@ export class WgslEdit extends HTMLElement {
   /** Link/compile WESL sources into WGSL. Returns the compiled WGSL string. */
   async link(options?: Partial<LinkParams>): Promise<string> {
     const pkg = this._packageName ?? "package";
-    const rootModuleName = fileToModulePath(this._activeFile, pkg, false);
+    const rootModuleName =
+      this._rootModuleName ?? fileToModulePath(this._activeFile, pkg, false);
     const linked = await link({
       weslSrc: this.sources,
       rootModuleName,
@@ -302,7 +306,22 @@ export class WgslEdit extends HTMLElement {
     return linked.dest;
   }
 
-  /** Currently active file name. */
+  /** Library bundles for linking (set via project). */
+  get libs(): WeslBundle[] {
+    return this._libs;
+  }
+
+  /** Root module for linking (stable across tab switches). */
+  get rootModuleName(): string | undefined {
+    return this._rootModuleName;
+  }
+
+  set rootModuleName(value: string | undefined) {
+    this._rootModuleName = value;
+    this.dispatchChange();
+  }
+
+  /** Currently active file name (selected tab). */
   get activeFile(): string {
     return this._activeFile;
   }
@@ -474,8 +493,13 @@ export class WgslEdit extends HTMLElement {
   }
 
   private dispatchChange(): void {
-    const { source, sources, conditions, _activeFile: activeFile } = this;
-    const detail = { source, sources, activeFile, conditions };
+    const {
+      source,
+      sources,
+      conditions,
+      _rootModuleName: rootModuleName,
+    } = this;
+    const detail = { source, sources, rootModuleName, conditions };
     this.dispatchEvent(new CustomEvent("change", { detail }));
   }