wgsl-renderer 0.3.1 → 0.3.3

package/dist/cjs/index.js

@@ -10,7 +10,6 @@ var RenderPass = class {
 	view;
 	format;
 	renderToCanvas;
-	sampleCount = 1;
 	passResources = [];
 	bindGroups = {};
 	activeBindGroupSet = "default";
@@ -31,7 +30,6 @@ var RenderPass = class {
 		this.view = descriptor.view;
 		this.format = descriptor.format;
 		this.renderToCanvas = descriptor.renderToCanvas;
-		this.sampleCount = descriptor.sampleCount || 1;
 		const actualFormat = descriptor.format || format;
 		const module$1 = this.device.createShaderModule({
 			code: descriptor.shaderCode,
@@ -78,8 +76,7 @@ var RenderPass = class {
 					blend: this.getBlendState()
 				}]
 			},
-			primitive: { topology: "triangle-list" },
-			multisample: { count: this.sampleCount }
+			primitive: { topology: "triangle-list" }
 		});
 		this.bindGroup = null;
 	}
@@ -388,6 +385,16 @@ var PassTextureRef = class PassTextureRef {
 function isPassTextureRef(obj) {
 	return PassTextureRef.is(obj);
 }
+/**
+* Create a texture view suitable for sampling (not for render attachments)
+* This view can include multiple mip levels for shader access
+*/
+function createSamplingView(texture, ref) {
+	return texture.createView({
+		baseMipLevel: 0,
+		mipLevelCount: ref.options?.mipmaps ? texture.mipLevelCount : 1
+	});
+}
 
 //#endregion
 //#region src/index.ts
@@ -399,8 +406,6 @@ var WGSLRenderer = class {
 	textureManager;
 	animationFrameId = null;
 	isResizing = false;
-	supportedSampleCounts = [];
-	testedSampleCounts = /* @__PURE__ */ new Set();
 	constructor(canvas, options) {
 		this.canvas = canvas;
 		this.options = options;
@@ -410,8 +415,6 @@ var WGSLRenderer = class {
 	async init() {
 		this.device = await (await navigator.gpu.requestAdapter()).requestDevice();
 		this.format = navigator.gpu.getPreferredCanvasFormat();
-		this.supportedSampleCounts = [1];
-		this.testedSampleCounts = new Set([1]);
 		const config = Object.assign({
 			device: this.device,
 			format: this.format,
@@ -445,13 +448,6 @@ var WGSLRenderer = class {
 	getDevice() {
 		return this.device;
 	}
-	getSupportedSampleCounts() {
-		return [...this.supportedSampleCounts];
-	}
-	isSampleCountSupported(sampleCount) {
-		if (this.testedSampleCounts.has(sampleCount)) return this.supportedSampleCounts.includes(sampleCount);
-		return this.supportedSampleCounts.includes(sampleCount);
-	}
 	/**
 	* Get texture reference by pass name
 	* Returns a PassTextureRef that will resolve to the actual texture at render time
@@ -476,23 +472,12 @@ var WGSLRenderer = class {
 		const textureName = `pass_${this.passes.indexOf(targetPass)}_output`;
 		let texture = this.textureManager.getTexture(textureName);
 		if (!texture) {
-			const format = ref.options?.format || this.format;
-			const usage = ref.options?.usage || GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.RENDER_ATTACHMENT;
-			const size = this.textureManager.getPixelSize();
-			const requestedSampleCount = ref.options?.sampleCount || 1;
-			const actualSampleCount = this.isSampleCountSupported(requestedSampleCount) ? requestedSampleCount : 1;
-			texture = this.device.createTexture({
-				size: [size.width, size.height],
-				format,
-				usage,
-				sampleCount: actualSampleCount,
-				mipLevelCount: ref.options?.mipLevelCount || 1
-			});
-			this.textureManager.setTexture(textureName, texture);
+			const format = this.passes.find((pass) => pass.name === ref.passName)?.format || this.format;
+			texture = this.textureManager.createTexture(textureName, format, ref.options?.mipLevelCount);
 		}
 		return texture.createView({
 			baseMipLevel: 0,
-			mipLevelCount: ref.options?.mipmaps ? texture.mipLevelCount : 1
+			mipLevelCount: 1
 		});
 	}
 	/**
@@ -502,6 +487,19 @@ var WGSLRenderer = class {
 		return this.passes.find((pass) => pass.name === passName);
 	}
 	/**
+	* Get the raw GPUTexture for a pass (useful for creating custom views)
+	* Note: The returned texture should not be used directly as a render attachment
+	* with mipLevelCount > 1, as that's not allowed by WebGPU.
+	*/
+	getPassTextureRaw(passName) {
+		const targetPass = this.passes.find((pass) => pass.name === passName);
+		if (!targetPass) throw new Error(`Cannot find pass named '${passName}'. Available passes: [${this.passes.map((p) => p.name).join(", ")}]`);
+		const textureName = `pass_${this.passes.indexOf(targetPass)}_output`;
+		const texture = this.textureManager.getTexture(textureName);
+		if (texture) return texture;
+		return null;
+	}
+	/**
 	* Disable a render pass (it will be skipped during rendering)
 	*/
 	disablePass(passName) {
@@ -598,8 +596,7 @@ var WGSLRenderer = class {
 			bindGroupSets: bindGroupSetsCopy,
 			view: descriptor.view,
 			format: descriptor.format,
-			renderToCanvas: descriptor.renderToCanvas,
-			sampleCount: descriptor.sampleCount
+			renderToCanvas: descriptor.renderToCanvas
 		};
 		const pipelineFormat = descriptor.format || this.format;
 		return new RenderPass(internalDescriptor, this.device, pipelineFormat);
@@ -608,10 +605,6 @@ var WGSLRenderer = class {
 	* Add a render pass to the multi-pass pipeline
 	*/
 	addPass(descriptor) {
-		if (descriptor.sampleCount && !this.isSampleCountSupported(descriptor.sampleCount)) {
-			console.warn(`Sample count ${descriptor.sampleCount} is not supported. Using sample count 1 instead.`);
-			descriptor.sampleCount = 1;
-		}
 		const pass = this.createPass(descriptor);
 		pass.passResources = descriptor.resources ?? [];
 		this.passes.push(pass);
@@ -731,57 +724,16 @@ var WGSLRenderer = class {
 			let resolveTarget;
 			const canvasTexture = this.ctx.getCurrentTexture();
 			const isLastPass = i === enabledPasses.length - 1;
-			if (pass.renderToCanvas || isLastPass && !pass.view) if (pass.sampleCount && pass.sampleCount > 1) {
-				const actualSampleCount = this.isSampleCountSupported(pass.sampleCount) ? pass.sampleCount : 1;
-				if (actualSampleCount === 1) renderTarget = canvasTexture.createView();
-				else {
-					renderTarget = this.device.createTexture({
-						size: [canvasTexture.width, canvasTexture.height],
-						format: canvasTexture.format,
-						usage: GPUTextureUsage.RENDER_ATTACHMENT,
-						sampleCount: actualSampleCount
-					}).createView();
-					resolveTarget = canvasTexture.createView();
-				}
-			} else renderTarget = canvasTexture.createView();
+			if (pass.renderToCanvas || isLastPass && !pass.view) renderTarget = canvasTexture.createView();
 			else if (pass.view) renderTarget = pass.view;
 			else {
 				const textureName = `pass_${i}_output`;
 				let texture = this.textureManager.getTexture(textureName);
-				if (texture) {
-					const msaaTexture = this.textureManager.getTexture(`${textureName}_msaa`);
-					const resolveTexture = this.textureManager.getTexture(`${textureName}_resolve`);
-					if (msaaTexture && resolveTexture && pass.sampleCount && pass.sampleCount > 1) {
-						renderTarget = msaaTexture.createView();
-						resolveTarget = resolveTexture.createView();
-					} else renderTarget = texture.createView();
-				} else if (pass.sampleCount && pass.sampleCount > 1) {
-					const actualSampleCount = this.isSampleCountSupported(pass.sampleCount) ? pass.sampleCount : 1;
-					if (actualSampleCount > 1) {
-						texture = this.device.createTexture({
-							size: [this.textureManager.getPixelSize().width, this.textureManager.getPixelSize().height],
-							format: pass.format || this.format,
-							usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.TEXTURE_BINDING,
-							sampleCount: actualSampleCount
-						});
-						const resolveTexture = this.device.createTexture({
-							size: [this.textureManager.getPixelSize().width, this.textureManager.getPixelSize().height],
-							format: pass.format || this.format,
-							usage: GPUTextureUsage.TEXTURE_BINDING,
-							sampleCount: 1
-						});
-						this.textureManager.setTexture(`${textureName}_msaa`, texture);
-						this.textureManager.setTexture(`${textureName}_resolve`, resolveTexture);
-						renderTarget = texture.createView();
-						resolveTarget = resolveTexture.createView();
-					} else {
-						texture = this.textureManager.createTexture(textureName, pass.format || this.format);
-						renderTarget = texture.createView();
-					}
-				} else {
-					texture = this.textureManager.createTexture(textureName, pass.format || this.format);
-					renderTarget = texture.createView();
-				}
+				if (!texture) texture = this.textureManager.createTexture(textureName, pass.format || this.format);
+				renderTarget = texture.createView({
+					baseMipLevel: 0,
+					mipLevelCount: 1
+				});
 			}
 			const renderPass = commandEncoder.beginRenderPass({ colorAttachments: [{
 				view: renderTarget,
@@ -827,4 +779,5 @@ async function createWGSLRenderer(cvs, options) {
 //#endregion
 exports.PassTextureRef = PassTextureRef;
 exports.WGSLRenderer = WGSLRenderer;
+exports.createSamplingView = createSamplingView;
 exports.createWGSLRenderer = createWGSLRenderer;

package/dist/esm/index.d.ts

@@ -6,14 +6,12 @@ declare class PassTextureRef {
   readonly options?: {
     format?: GPUTextureFormat;
     mipmaps?: boolean;
-    sampleCount?: number;
     usage?: GPUTextureUsageFlags;
     mipLevelCount?: number;
   };
   constructor(passName: string, options?: {
     format?: GPUTextureFormat;
     mipmaps?: boolean;
-    sampleCount?: number;
     usage?: GPUTextureUsageFlags;
     mipLevelCount?: number;
   });
@@ -22,11 +20,15 @@ declare class PassTextureRef {
   static create(passName: string, options?: {
     format?: GPUTextureFormat;
     mipmaps?: boolean;
-    sampleCount?: number;
     usage?: GPUTextureUsageFlags;
     mipLevelCount?: number;
   }): PassTextureRef;
 }
+/**
+ * Create a texture view suitable for sampling (not for render attachments)
+ * This view can include multiple mip levels for shader access
+ */
+declare function createSamplingView(texture: GPUTexture, ref: PassTextureRef): GPUTextureView;
 //#endregion
 //#region src/RenderPass.d.ts
 type BindingResource = GPUBindingResource | PassTextureRef;
@@ -56,7 +58,6 @@ interface RenderPassOptions {
   view?: GPUTextureView;
   format?: GPUTextureFormat;
   renderToCanvas?: boolean;
-  sampleCount?: number;
 }
 interface InternalRenderPassDescriptor {
   name: string;
@@ -79,7 +80,6 @@ interface InternalRenderPassDescriptor {
   view?: GPUTextureView;
   format?: GPUTextureFormat;
   renderToCanvas?: boolean;
-  sampleCount?: number;
 }
 declare class RenderPass {
   name: string;
@@ -96,7 +96,6 @@ declare class RenderPass {
   view?: GPUTextureView;
   format?: GPUTextureFormat;
   renderToCanvas?: boolean;
-  sampleCount: number;
   passResources: BindingResource[];
   bindGroups: {
     [setName: string]: GPUBindGroup;
@@ -154,15 +153,11 @@ declare class WGSLRenderer {
   private textureManager;
   private animationFrameId;
   private isResizing;
-  private supportedSampleCounts;
-  private testedSampleCounts;
   constructor(canvas: HTMLCanvasElement, options?: WGSLRendererOptions | undefined);
   init(): Promise<void>;
   resize(width: number, height: number): Promise<void>;
   getContext(): GPUCanvasContext;
   getDevice(): GPUDevice;
-  getSupportedSampleCounts(): number[];
-  isSampleCountSupported(sampleCount: number): boolean;
   /**
    * Get texture reference by pass name
    * Returns a PassTextureRef that will resolve to the actual texture at render time
@@ -173,18 +168,23 @@ declare class WGSLRenderer {
   getPassTexture(passName: string, options?: {
     format?: GPUTextureFormat;
     mipmaps?: boolean;
-    sampleCount?: number;
     usage?: GPUTextureUsageFlags;
     mipLevelCount?: number;
   }): PassTextureRef;
   /**
    * Resolve a PassTextureRef to actual GPUTextureView with validation
    */
-  private resolveTextureRef;
+  resolveTextureRef(ref: PassTextureRef): GPUTextureView;
   /**
    * Get pass by name
    */
   getPassByName(passName: string): RenderPass | undefined;
+  /**
+   * Get the raw GPUTexture for a pass (useful for creating custom views)
+   * Note: The returned texture should not be used directly as a render attachment
+   * with mipLevelCount > 1, as that's not allowed by WebGPU.
+   */
+  getPassTextureRaw(passName: string): GPUTexture | null;
   /**
    * Disable a render pass (it will be skipped during rendering)
    */
@@ -267,4 +267,4 @@ declare class WGSLRenderer {
 }
 declare function createWGSLRenderer(cvs: HTMLCanvasElement, options?: WGSLRendererOptions): Promise<WGSLRenderer>;
 //#endregion
-export { BindingResource, PassTextureRef, RenderPassOptions, WGSLRenderer, createWGSLRenderer };
+export { BindingResource, PassTextureRef, RenderPassOptions, WGSLRenderer, createSamplingView, createWGSLRenderer };

package/dist/esm/index.js

@@ -9,7 +9,6 @@ var RenderPass = class {
 	view;
 	format;
 	renderToCanvas;
-	sampleCount = 1;
 	passResources = [];
 	bindGroups = {};
 	activeBindGroupSet = "default";
@@ -30,7 +29,6 @@ var RenderPass = class {
 		this.view = descriptor.view;
 		this.format = descriptor.format;
 		this.renderToCanvas = descriptor.renderToCanvas;
-		this.sampleCount = descriptor.sampleCount || 1;
 		const actualFormat = descriptor.format || format;
 		const module = this.device.createShaderModule({
 			code: descriptor.shaderCode,
@@ -77,8 +75,7 @@ var RenderPass = class {
 					blend: this.getBlendState()
 				}]
 			},
-			primitive: { topology: "triangle-list" },
-			multisample: { count: this.sampleCount }
+			primitive: { topology: "triangle-list" }
 		});
 		this.bindGroup = null;
 	}
@@ -387,6 +384,16 @@ var PassTextureRef = class PassTextureRef {
 function isPassTextureRef(obj) {
 	return PassTextureRef.is(obj);
 }
+/**
+* Create a texture view suitable for sampling (not for render attachments)
+* This view can include multiple mip levels for shader access
+*/
+function createSamplingView(texture, ref) {
+	return texture.createView({
+		baseMipLevel: 0,
+		mipLevelCount: ref.options?.mipmaps ? texture.mipLevelCount : 1
+	});
+}
 
 //#endregion
 //#region src/index.ts
@@ -398,8 +405,6 @@ var WGSLRenderer = class {
 	textureManager;
 	animationFrameId = null;
 	isResizing = false;
-	supportedSampleCounts = [];
-	testedSampleCounts = /* @__PURE__ */ new Set();
 	constructor(canvas, options) {
 		this.canvas = canvas;
 		this.options = options;
@@ -409,8 +414,6 @@ var WGSLRenderer = class {
 	async init() {
 		this.device = await (await navigator.gpu.requestAdapter()).requestDevice();
 		this.format = navigator.gpu.getPreferredCanvasFormat();
-		this.supportedSampleCounts = [1];
-		this.testedSampleCounts = new Set([1]);
 		const config = Object.assign({
 			device: this.device,
 			format: this.format,
@@ -444,13 +447,6 @@ var WGSLRenderer = class {
 	getDevice() {
 		return this.device;
 	}
-	getSupportedSampleCounts() {
-		return [...this.supportedSampleCounts];
-	}
-	isSampleCountSupported(sampleCount) {
-		if (this.testedSampleCounts.has(sampleCount)) return this.supportedSampleCounts.includes(sampleCount);
-		return this.supportedSampleCounts.includes(sampleCount);
-	}
 	/**
 	* Get texture reference by pass name
 	* Returns a PassTextureRef that will resolve to the actual texture at render time
@@ -475,23 +471,12 @@ var WGSLRenderer = class {
 		const textureName = `pass_${this.passes.indexOf(targetPass)}_output`;
 		let texture = this.textureManager.getTexture(textureName);
 		if (!texture) {
-			const format = ref.options?.format || this.format;
-			const usage = ref.options?.usage || GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.RENDER_ATTACHMENT;
-			const size = this.textureManager.getPixelSize();
-			const requestedSampleCount = ref.options?.sampleCount || 1;
-			const actualSampleCount = this.isSampleCountSupported(requestedSampleCount) ? requestedSampleCount : 1;
-			texture = this.device.createTexture({
-				size: [size.width, size.height],
-				format,
-				usage,
-				sampleCount: actualSampleCount,
-				mipLevelCount: ref.options?.mipLevelCount || 1
-			});
-			this.textureManager.setTexture(textureName, texture);
+			const format = this.passes.find((pass) => pass.name === ref.passName)?.format || this.format;
+			texture = this.textureManager.createTexture(textureName, format, ref.options?.mipLevelCount);
 		}
 		return texture.createView({
 			baseMipLevel: 0,
-			mipLevelCount: ref.options?.mipmaps ? texture.mipLevelCount : 1
+			mipLevelCount: 1
 		});
 	}
 	/**
@@ -501,6 +486,19 @@ var WGSLRenderer = class {
 		return this.passes.find((pass) => pass.name === passName);
 	}
 	/**
+	* Get the raw GPUTexture for a pass (useful for creating custom views)
+	* Note: The returned texture should not be used directly as a render attachment
+	* with mipLevelCount > 1, as that's not allowed by WebGPU.
+	*/
+	getPassTextureRaw(passName) {
+		const targetPass = this.passes.find((pass) => pass.name === passName);
+		if (!targetPass) throw new Error(`Cannot find pass named '${passName}'. Available passes: [${this.passes.map((p) => p.name).join(", ")}]`);
+		const textureName = `pass_${this.passes.indexOf(targetPass)}_output`;
+		const texture = this.textureManager.getTexture(textureName);
+		if (texture) return texture;
+		return null;
+	}
+	/**
 	* Disable a render pass (it will be skipped during rendering)
 	*/
 	disablePass(passName) {
@@ -597,8 +595,7 @@ var WGSLRenderer = class {
 			bindGroupSets: bindGroupSetsCopy,
 			view: descriptor.view,
 			format: descriptor.format,
-			renderToCanvas: descriptor.renderToCanvas,
-			sampleCount: descriptor.sampleCount
+			renderToCanvas: descriptor.renderToCanvas
 		};
 		const pipelineFormat = descriptor.format || this.format;
 		return new RenderPass(internalDescriptor, this.device, pipelineFormat);
@@ -607,10 +604,6 @@ var WGSLRenderer = class {
 	* Add a render pass to the multi-pass pipeline
 	*/
 	addPass(descriptor) {
-		if (descriptor.sampleCount && !this.isSampleCountSupported(descriptor.sampleCount)) {
-			console.warn(`Sample count ${descriptor.sampleCount} is not supported. Using sample count 1 instead.`);
-			descriptor.sampleCount = 1;
-		}
 		const pass = this.createPass(descriptor);
 		pass.passResources = descriptor.resources ?? [];
 		this.passes.push(pass);
@@ -730,57 +723,16 @@ var WGSLRenderer = class {
 			let resolveTarget;
 			const canvasTexture = this.ctx.getCurrentTexture();
 			const isLastPass = i === enabledPasses.length - 1;
-			if (pass.renderToCanvas || isLastPass && !pass.view) if (pass.sampleCount && pass.sampleCount > 1) {
-				const actualSampleCount = this.isSampleCountSupported(pass.sampleCount) ? pass.sampleCount : 1;
-				if (actualSampleCount === 1) renderTarget = canvasTexture.createView();
-				else {
-					renderTarget = this.device.createTexture({
-						size: [canvasTexture.width, canvasTexture.height],
-						format: canvasTexture.format,
-						usage: GPUTextureUsage.RENDER_ATTACHMENT,
-						sampleCount: actualSampleCount
-					}).createView();
-					resolveTarget = canvasTexture.createView();
-				}
-			} else renderTarget = canvasTexture.createView();
+			if (pass.renderToCanvas || isLastPass && !pass.view) renderTarget = canvasTexture.createView();
 			else if (pass.view) renderTarget = pass.view;
 			else {
 				const textureName = `pass_${i}_output`;
 				let texture = this.textureManager.getTexture(textureName);
-				if (texture) {
-					const msaaTexture = this.textureManager.getTexture(`${textureName}_msaa`);
-					const resolveTexture = this.textureManager.getTexture(`${textureName}_resolve`);
-					if (msaaTexture && resolveTexture && pass.sampleCount && pass.sampleCount > 1) {
-						renderTarget = msaaTexture.createView();
-						resolveTarget = resolveTexture.createView();
-					} else renderTarget = texture.createView();
-				} else if (pass.sampleCount && pass.sampleCount > 1) {
-					const actualSampleCount = this.isSampleCountSupported(pass.sampleCount) ? pass.sampleCount : 1;
-					if (actualSampleCount > 1) {
-						texture = this.device.createTexture({
-							size: [this.textureManager.getPixelSize().width, this.textureManager.getPixelSize().height],
-							format: pass.format || this.format,
-							usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.TEXTURE_BINDING,
-							sampleCount: actualSampleCount
-						});
-						const resolveTexture = this.device.createTexture({
-							size: [this.textureManager.getPixelSize().width, this.textureManager.getPixelSize().height],
-							format: pass.format || this.format,
-							usage: GPUTextureUsage.TEXTURE_BINDING,
-							sampleCount: 1
-						});
-						this.textureManager.setTexture(`${textureName}_msaa`, texture);
-						this.textureManager.setTexture(`${textureName}_resolve`, resolveTexture);
-						renderTarget = texture.createView();
-						resolveTarget = resolveTexture.createView();
-					} else {
-						texture = this.textureManager.createTexture(textureName, pass.format || this.format);
-						renderTarget = texture.createView();
-					}
-				} else {
-					texture = this.textureManager.createTexture(textureName, pass.format || this.format);
-					renderTarget = texture.createView();
-				}
+				if (!texture) texture = this.textureManager.createTexture(textureName, pass.format || this.format);
+				renderTarget = texture.createView({
+					baseMipLevel: 0,
+					mipLevelCount: 1
+				});
 			}
 			const renderPass = commandEncoder.beginRenderPass({ colorAttachments: [{
 				view: renderTarget,
@@ -824,4 +776,4 @@ async function createWGSLRenderer(cvs, options) {
 }
 
 //#endregion
-export { PassTextureRef, WGSLRenderer, createWGSLRenderer };
+export { PassTextureRef, WGSLRenderer, createSamplingView, createWGSLRenderer };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wgsl-renderer",
-  "version": "0.3.1",
+  "version": "0.3.3",
   "description": "A multi-pass renderer based on WebGPU and WGSL.",
   "type": "module",
   "main": "./dist/cjs/index.js",