typegpu 0.10.0 → 0.10.2

package/core/texture/textureUtils.js

@@ -0,0 +1,224 @@
+import { getEffectiveSampleTypes, getTextureFormatInfo } from "./textureFormats.js";
+
+//#region src/core/texture/textureUtils.ts
+function getImageSourceDimensions(source) {
+	const { videoWidth, videoHeight } = source;
+	if (videoWidth && videoHeight) return {
+		width: videoWidth,
+		height: videoHeight
+	};
+	const { naturalWidth, naturalHeight } = source;
+	if (naturalWidth && naturalHeight) return {
+		width: naturalWidth,
+		height: naturalHeight
+	};
+	const { codedWidth, codedHeight } = source;
+	if (codedWidth && codedHeight) return {
+		width: codedWidth,
+		height: codedHeight
+	};
+	const { width, height } = source;
+	if (width && height) return {
+		width,
+		height
+	};
+	throw new Error("Cannot determine dimensions of the provided image source.");
+}
+const FULLSCREEN_VERTEX_SHADER = `
+struct VertexOutput {
+  @builtin(position) pos: vec4f,
+  @location(0) uv: vec2f,
+}
+
+@vertex
+fn vs_main(@builtin(vertex_index) i: u32) -> VertexOutput {
+  const pos = array(vec2f(-1, -1), vec2f(3, -1), vec2f(-1, 3));
+  const uv = array(vec2f(0, 1), vec2f(2, 1), vec2f(0, -1));
+  return VertexOutput(vec4f(pos[i], 0, 1), uv[i]);
+}`;
+const SAMPLE_FRAGMENT_SHADER = `
+@group(0) @binding(0) var src: texture_2d<f32>;
+@group(0) @binding(1) var samp: sampler;
+
+@fragment
+fn fs_main(@location(0) uv: vec2f) -> @location(0) vec4f {
+  return textureSample(src, samp, uv);
+}`;
+const GATHER_FRAGMENT_SHADER = `
+@group(0) @binding(0) var src: texture_2d<f32>;
+@group(0) @binding(1) var samp: sampler;
+
+@fragment
+fn fs_main(@location(0) uv: vec2f) -> @location(0) vec4f {
+  let r = textureGather(0, src, samp, uv);
+  let g = textureGather(1, src, samp, uv);
+  let b = textureGather(2, src, samp, uv);
+  let a = textureGather(3, src, samp, uv);
+  return vec4f(dot(r, vec4f(0.25)), dot(g, vec4f(0.25)), dot(b, vec4f(0.25)), dot(a, vec4f(0.25)));
+}`;
+const blitCache = /* @__PURE__ */ new WeakMap();
+function getOrCreateDeviceCache(device) {
+	let cache = blitCache.get(device);
+	if (!cache) {
+		cache = {
+			vertexModule: device.createShaderModule({ code: FULLSCREEN_VERTEX_SHADER }),
+			filterableResources: /* @__PURE__ */ new Map(),
+			layoutResources: /* @__PURE__ */ new Map()
+		};
+		blitCache.set(device, cache);
+	}
+	return cache;
+}
+function getBlitResources(device, filterable, sampleType) {
+	const cache = getOrCreateDeviceCache(device);
+	let filterableRes = cache.filterableResources.get(filterable);
+	if (!filterableRes) {
+		filterableRes = {
+			fragmentModule: device.createShaderModule({ code: filterable ? SAMPLE_FRAGMENT_SHADER : GATHER_FRAGMENT_SHADER }),
+			sampler: device.createSampler(filterable ? {
+				magFilter: "linear",
+				minFilter: "linear"
+			} : {})
+		};
+		cache.filterableResources.set(filterable, filterableRes);
+	}
+	const layoutKey = `${filterable}:${sampleType}`;
+	let layoutRes = cache.layoutResources.get(layoutKey);
+	if (!layoutRes) {
+		const bindGroupLayout = device.createBindGroupLayout({ entries: [{
+			binding: 0,
+			visibility: GPUShaderStage.FRAGMENT,
+			texture: { sampleType }
+		}, {
+			binding: 1,
+			visibility: GPUShaderStage.FRAGMENT,
+			sampler: { type: filterable ? "filtering" : "non-filtering" }
+		}] });
+		layoutRes = {
+			bindGroupLayout,
+			pipelineLayout: device.createPipelineLayout({ bindGroupLayouts: [bindGroupLayout] })
+		};
+		cache.layoutResources.set(layoutKey, layoutRes);
+	}
+	return {
+		vertexModule: cache.vertexModule,
+		...filterableRes,
+		...layoutRes
+	};
+}
+function blit(options) {
+	const { device, source, destination, format, filterable, sampleType } = options;
+	const resources = getBlitResources(device, filterable, sampleType);
+	const pipeline = device.createRenderPipeline({
+		layout: resources.pipelineLayout,
+		vertex: { module: resources.vertexModule },
+		fragment: {
+			module: resources.fragmentModule,
+			targets: [{ format }]
+		},
+		primitive: { topology: "triangle-list" }
+	});
+	const bindGroup = device.createBindGroup({
+		layout: resources.bindGroupLayout,
+		entries: [{
+			binding: 0,
+			resource: source
+		}, {
+			binding: 1,
+			resource: resources.sampler
+		}]
+	});
+	const ownEncoder = !options.encoder;
+	const encoder = options.encoder ?? device.createCommandEncoder();
+	const pass = encoder.beginRenderPass({ colorAttachments: [{
+		view: destination,
+		loadOp: "clear",
+		storeOp: "store"
+	}] });
+	pass.setPipeline(pipeline);
+	pass.setBindGroup(0, bindGroup);
+	pass.draw(3);
+	pass.end();
+	if (ownEncoder) device.queue.submit([encoder.finish()]);
+}
+function clearTextureUtilsCache(device) {
+	blitCache.delete(device);
+}
+function validateBlitFormat(device, format, operation) {
+	const info = getTextureFormatInfo(format);
+	const effectiveSampleTypes = getEffectiveSampleTypes(device, format);
+	const isFloat = effectiveSampleTypes.includes("float");
+	const isUnfilterableFloat = effectiveSampleTypes.includes("unfilterable-float");
+	if (!isFloat && !isUnfilterableFloat) throw new Error(`Cannot ${operation} for format '${format}': only float formats are supported.`);
+	if (!info.canRenderAttachment) throw new Error(`Cannot ${operation} for format '${format}': format does not support render attachments.`);
+	return {
+		filterable: isFloat,
+		sampleType: isFloat ? "float" : "unfilterable-float"
+	};
+}
+function generateTextureMipmaps(device, texture, baseMipLevel = 0, mipLevels) {
+	if (texture.dimension !== "2d") throw new Error("Mipmap generation only supports 2D textures.");
+	const { filterable, sampleType } = validateBlitFormat(device, texture.format, "generate mipmaps");
+	const levels = mipLevels ?? texture.mipLevelCount - baseMipLevel;
+	for (let layer = 0; layer < texture.depthOrArrayLayers; layer++) for (let mip = baseMipLevel; mip < baseMipLevel + levels - 1; mip++) {
+		const viewOptions = (level) => ({
+			dimension: "2d",
+			baseMipLevel: level,
+			mipLevelCount: 1,
+			baseArrayLayer: layer,
+			arrayLayerCount: 1
+		});
+		blit({
+			device,
+			source: texture.createView(viewOptions(mip)),
+			destination: texture.createView(viewOptions(mip + 1)),
+			format: texture.format,
+			filterable,
+			sampleType
+		});
+	}
+}
+function resampleImage(device, targetTexture, image, layer = 0) {
+	if (targetTexture.dimension !== "2d") throw new Error("Resampling only supports 2D textures.");
+	const { filterable } = validateBlitFormat(device, targetTexture.format, "resample");
+	const { width, height } = getImageSourceDimensions(image);
+	const inputTexture = device.createTexture({
+		size: [width, height],
+		format: "rgba8unorm",
+		usage: GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST | GPUTextureUsage.RENDER_ATTACHMENT
+	});
+	device.queue.copyExternalImageToTexture({ source: image }, { texture: inputTexture }, [width, height]);
+	const renderTexture = device.createTexture({
+		size: [targetTexture.width, targetTexture.height],
+		format: targetTexture.format,
+		usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.COPY_SRC
+	});
+	const encoder = device.createCommandEncoder();
+	blit({
+		device,
+		source: inputTexture.createView(),
+		destination: renderTexture.createView(),
+		format: targetTexture.format,
+		filterable,
+		sampleType: "float",
+		encoder
+	});
+	encoder.copyTextureToTexture({ texture: renderTexture }, {
+		texture: targetTexture,
+		origin: {
+			x: 0,
+			y: 0,
+			z: layer
+		}
+	}, {
+		width: targetTexture.width,
+		height: targetTexture.height,
+		depthOrArrayLayers: 1
+	});
+	device.queue.submit([encoder.finish()]);
+	inputTexture.destroy();
+	renderTexture.destroy();
+}
+
+//#endregion
+export { clearTextureUtilsCache, generateTextureMipmaps, getImageSourceDimensions, resampleImage };

package/core/texture/usageExtension.d.ts

@@ -0,0 +1,21 @@
+import { StorageFlag } from "../../extension.js";
+import { TextureProps } from "./textureProps.js";
+import { StorageTextureFormats } from "./textureFormats.js";
+
+//#region src/core/texture/usageExtension.d.ts
+interface SampledFlag {
+  usableAsSampled: true;
+}
+interface RenderFlag {
+  usableAsRender: true;
+}
+type LiteralToExtensionMap = {
+  storage: StorageFlag;
+  sampled: SampledFlag;
+  render: RenderFlag;
+};
+type AllowedUsages<TProps extends TextureProps> = 'sampled' | 'render' | (TProps['format'] extends StorageTextureFormats ? 'storage' : never);
+declare function isUsableAsSampled<T>(value: T): value is T & SampledFlag;
+declare function isUsableAsRender<T>(value: T): value is T & RenderFlag;
+//#endregion
+export { AllowedUsages, LiteralToExtensionMap, RenderFlag, SampledFlag, isUsableAsRender, isUsableAsSampled };

package/core/texture/usageExtension.js

@@ -0,0 +1,21 @@
+import { getName } from "../../shared/meta.js";
+
+//#region src/core/texture/usageExtension.ts
+function isUsableAsSampled(value) {
+	return !!value?.usableAsSampled;
+}
+function isUsableAsRender(value) {
+	return !!value?.usableAsRender;
+}
+/**
+* @category Errors
+*/
+var NotSampledError = class NotSampledError extends Error {
+	constructor(value) {
+		super(`Resource '${getName(value) ?? "<unnamed>"}' cannot be bound as 'sampled'. Use .$usage('sampled') to allow it.`);
+		Object.setPrototypeOf(this, NotSampledError.prototype);
+	}
+};
+
+//#endregion
+export { NotSampledError, isUsableAsRender, isUsableAsSampled };

package/core/unroll/tgpuUnroll.d.ts

@@ -0,0 +1,13 @@
+import { $internal } from "../../shared/symbols.js";
+import "../../data/snippet.js";
+import { GPUCallable } from "../../types.js";
+
+//#region src/core/unroll/tgpuUnroll.d.ts
+/**
+ * Marks an iterable to be unrolled by the wgslGenerator.
+ */
+declare const unroll: (<T extends Iterable<unknown>>(value: T) => T) & GPUCallable<[value: Iterable<unknown>]> & {
+  [$internal]: true;
+};
+//#endregion
+export { unroll };

package/core/unroll/tgpuUnroll.js

@@ -0,0 +1,36 @@
+import { $gpuCallable, $internal, $resolve } from "../../shared/symbols.js";
+import { setName } from "../../shared/meta.js";
+import { snip } from "../../data/snippet.js";
+import { stitch } from "../resolve/stitch.js";
+
+//#region src/core/unroll/tgpuUnroll.ts
+/**
+* The result of calling `tgpu.unroll(...)`. The code responsible for
+* generating shader code can check if the value of a snippet is
+* an instance of `UnrollableIterable`, and act accordingly.
+*/
+var UnrollableIterable = class {
+	[$internal] = true;
+	constructor(snippet) {
+		this.snippet = snippet;
+	}
+	[$resolve](_ctx) {
+		return snip(stitch`${this.snippet}`, this.snippet.dataType, this.snippet.origin);
+	}
+};
+/**
+* Marks an iterable to be unrolled by the wgslGenerator.
+*/
+const unroll = (() => {
+	const impl = ((value) => value);
+	setName(impl, "unroll");
+	impl.toString = () => "unroll";
+	impl[$internal] = true;
+	impl[$gpuCallable] = { call(_ctx, [value]) {
+		return snip(new UnrollableIterable(value), value.dataType, value.origin);
+	} };
+	return impl;
+})();
+
+//#endregion
+export { UnrollableIterable, unroll };

package/core/valueProxyUtils.js

@@ -0,0 +1,44 @@
+import { $internal, $ownSnippet, $resolve } from "../shared/symbols.js";
+import { getOwnSnippet } from "../types.js";
+import { getGPUValue } from "../getGPUValue.js";
+import { accessProp } from "../tgsl/accessProp.js";
+import { accessIndex } from "../tgsl/accessIndex.js";
+
+//#region src/core/valueProxyUtils.ts
+const valueProxyHandler = { get(target, prop) {
+	if (prop in target) return Reflect.get(target, prop);
+	if (prop === "toString" || prop === Symbol.toStringTag || prop === Symbol.toPrimitive) return () => target.toString();
+	if (typeof prop === "symbol") return;
+	const targetSnippet = getOwnSnippet(target);
+	const index = Number(prop);
+	if (!Number.isNaN(index)) {
+		const accessed = accessIndex(targetSnippet, index);
+		if (!accessed) return;
+		return new Proxy({
+			[$internal]: true,
+			[$resolve]: (ctx) => ctx.resolve(accessed.value, accessed.dataType),
+			[$ownSnippet]: accessed,
+			toString: () => `${String(target)}[${prop}]`
+		}, valueProxyHandler);
+	}
+	const accessed = accessProp(targetSnippet, String(prop));
+	if (!accessed) return;
+	return new Proxy({
+		[$internal]: true,
+		[$resolve]: (ctx) => ctx.resolve(accessed.value, accessed.dataType),
+		[$ownSnippet]: accessed,
+		toString: () => `${String(target)}.${prop}`
+	}, valueProxyHandler);
+} };
+function getGpuValueRecursively(value) {
+	let unwrapped = value;
+	while (true) {
+		const gpuValue = getGPUValue(unwrapped);
+		if (!gpuValue) break;
+		unwrapped = gpuValue;
+	}
+	return unwrapped;
+}
+
+//#endregion
+export { getGpuValueRecursively, valueProxyHandler };

package/core/variable/tgpuVariable.d.ts

@@ -0,0 +1,38 @@
+import { TgpuNamable } from "../../shared/meta.js";
+import { $gpuValueOf, $internal } from "../../shared/symbols.js";
+import { BaseData } from "../../data/wgslTypes.js";
+import { InferGPU } from "../../shared/repr.js";
+import { AnyData } from "../../data/dataTypes.js";
+
+//#region src/core/variable/tgpuVariable.d.ts
+type VariableScope = 'private' | 'workgroup';
+interface TgpuVar<TScope extends VariableScope = VariableScope, TDataType extends BaseData = BaseData> extends TgpuNamable {
+  readonly resourceType: 'var';
+  readonly [$gpuValueOf]: InferGPU<TDataType>;
+  /**
+   * @deprecated Use `.$` instead, works the same way.
+   */
+  value: InferGPU<TDataType>;
+  $: InferGPU<TDataType>;
+  readonly [$internal]: {
+    /** Makes it differentiable on the type level. Does not exist at runtime. */dataType?: TDataType; /** Makes it differentiable on the type level. Does not exist at runtime. */
+    scope?: TScope;
+  };
+}
+/**
+ * Defines a variable scoped to each entry function (private).
+ *
+ * @param dataType The schema of the held data's type
+ * @param initialValue If not provided, the variable will be initialized to the dataType's "zero-value".
+ */
+declare function privateVar<TDataType extends AnyData>(dataType: TDataType, initialValue?: InferGPU<TDataType>): TgpuVar<'private', TDataType>;
+/**
+ * Defines a variable scoped to the whole workgroup, shared between entry functions
+ * of the same invocation.
+ *
+ * @param dataType The schema of the held data's type
+ */
+declare function workgroupVar<TDataType extends AnyData>(dataType: TDataType): TgpuVar<'workgroup', TDataType>;
+declare function isVariable(value: unknown): value is TgpuVar;
+//#endregion
+export { TgpuVar, VariableScope, isVariable, privateVar, workgroupVar };

package/core/variable/tgpuVariable.js

@@ -0,0 +1,101 @@
+import { $gpuValueOf, $internal, $ownSnippet, $resolve } from "../../shared/symbols.js";
+import { getName, setName } from "../../shared/meta.js";
+import { isNaturallyEphemeral } from "../../data/wgslTypes.js";
+import { snip } from "../../data/snippet.js";
+import { IllegalVarAccessError } from "../../errors.js";
+import { getExecMode, isInsideTgpuFn } from "../../execMode.js";
+import { assertExhaustive } from "../../shared/utilityTypes.js";
+import { valueProxyHandler } from "../valueProxyUtils.js";
+
+//#region src/core/variable/tgpuVariable.ts
+/**
+* Defines a variable scoped to each entry function (private).
+*
+* @param dataType The schema of the held data's type
+* @param initialValue If not provided, the variable will be initialized to the dataType's "zero-value".
+*/
+function privateVar(dataType, initialValue) {
+	return new TgpuVarImpl("private", dataType, initialValue);
+}
+/**
+* Defines a variable scoped to the whole workgroup, shared between entry functions
+* of the same invocation.
+*
+* @param dataType The schema of the held data's type
+*/
+function workgroupVar(dataType) {
+	return new TgpuVarImpl("workgroup", dataType);
+}
+function isVariable(value) {
+	return value instanceof TgpuVarImpl;
+}
+var TgpuVarImpl = class {
+	[$internal] = {};
+	resourceType;
+	#scope;
+	#dataType;
+	#initialValue;
+	constructor(scope, dataType, initialValue) {
+		this.resourceType = "var";
+		this.#scope = scope;
+		this.#dataType = dataType;
+		this.#initialValue = initialValue;
+	}
+	[$resolve](ctx) {
+		const id = ctx.getUniqueName(this);
+		const pre = `var<${this.#scope}> ${id}: ${ctx.resolve(this.#dataType).value}`;
+		if (this.#initialValue) ctx.addDeclaration(`${pre} = ${ctx.resolve(this.#initialValue, this.#dataType).value};`);
+		else ctx.addDeclaration(`${pre};`);
+		return snip(id, this.#dataType, isNaturallyEphemeral(this.#dataType) ? "runtime" : this.#scope);
+	}
+	$name(label) {
+		setName(this, label);
+		return this;
+	}
+	toString() {
+		return `var:${getName(this) ?? "<unnamed>"}`;
+	}
+	get [$gpuValueOf]() {
+		const dataType = this.#dataType;
+		const origin = isNaturallyEphemeral(dataType) ? "runtime" : this.#scope;
+		return new Proxy({
+			[$internal]: true,
+			get [$ownSnippet]() {
+				return snip(this, dataType, origin);
+			},
+			[$resolve]: (ctx) => ctx.resolve(this),
+			toString: () => `var:${getName(this) ?? "<unnamed>"}.$`
+		}, valueProxyHandler);
+	}
+	get $() {
+		const mode = getExecMode();
+		const insideTgpuFn = isInsideTgpuFn();
+		if (mode.type === "normal") throw new IllegalVarAccessError(insideTgpuFn ? `Cannot access variable '${getName(this) ?? "<unnamed>"}'. TypeGPU functions that depends on GPU resources need to be part of a compute dispatch, draw call or simulation` : "TypeGPU variables are inaccessible during normal JS execution. If you wanted to simulate GPU behavior, try `tgpu.simulate()`");
+		if (mode.type === "codegen") return this[$gpuValueOf];
+		if (mode.type === "simulate") {
+			if (!mode.vars[this.#scope].has(this)) mode.vars[this.#scope].set(this, this.#initialValue);
+			return mode.vars[this.#scope].get(this);
+		}
+		return assertExhaustive(mode, "tgpuVariable.ts#TgpuVarImpl/$");
+	}
+	set $(value) {
+		const mode = getExecMode();
+		const insideTgpuFn = isInsideTgpuFn();
+		if (mode.type === "normal") throw new IllegalVarAccessError(insideTgpuFn ? `Cannot access ${String(this)}. TypeGPU functions that depends on GPU resources need to be part of a compute dispatch, draw call or simulation` : "TypeGPU variables are inaccessible during normal JS execution. If you wanted to simulate GPU behavior, try `tgpu.simulate()`");
+		if (mode.type === "codegen") throw new Error("Unreachable tgpuVariable.ts#TgpuVarImpl/$");
+		if (mode.type === "simulate") {
+			mode.vars[this.#scope].set(this, value);
+			return;
+		}
+		assertExhaustive(mode, "tgpuVariable.ts#TgpuVarImpl/$");
+	}
+	get value() {
+		return this.$;
+	}
+	set value(v) {
+		this.$ = v;
+	}
+};
+
+//#endregion
+export { isVariable, privateVar, workgroupVar };

package/core/vertexLayout/connectAttributesToShader.js

@@ -0,0 +1,59 @@
+import { getCustomLocation, isData } from "../../data/dataTypes.js";
+import { isBuiltin } from "../../data/attributes.js";
+
+//#region src/core/vertexLayout/connectAttributesToShader.ts
+function isAttribute(value) {
+	return typeof value?.format === "string";
+}
+function connectAttributesToShader(shaderInputLayout, attributes) {
+	const usedVertexLayouts = [];
+	if (isData(shaderInputLayout)) {
+		if (!isAttribute(attributes)) throw new Error("Shader expected a single attribute, not a record of attributes to be passed in.");
+		usedVertexLayouts.push(attributes._layout);
+		return {
+			usedVertexLayouts,
+			bufferDefinitions: [{
+				arrayStride: attributes._layout.stride,
+				stepMode: attributes._layout.stepMode,
+				attributes: [{
+					format: attributes.format,
+					offset: attributes.offset,
+					shaderLocation: getCustomLocation(shaderInputLayout) ?? 0
+				}]
+			}]
+		};
+	}
+	const bufferDefinitions = [];
+	const layoutToAttribListMap = /* @__PURE__ */ new WeakMap();
+	let nextShaderLocation = 0;
+	for (const [key, member] of Object.entries(shaderInputLayout)) {
+		if (isBuiltin(member)) continue;
+		const matchingAttribute = attributes[key];
+		if (!matchingAttribute) throw new Error(`An attribute by the name of '${key}' was not provided to the shader.`);
+		const layout = matchingAttribute._layout;
+		let attribList = layoutToAttribListMap.get(layout);
+		if (!attribList) {
+			usedVertexLayouts.push(layout);
+			attribList = [];
+			bufferDefinitions.push({
+				arrayStride: layout.stride,
+				stepMode: layout.stepMode,
+				attributes: attribList
+			});
+			layoutToAttribListMap.set(layout, attribList);
+		}
+		nextShaderLocation = getCustomLocation(member) ?? nextShaderLocation;
+		attribList.push({
+			format: matchingAttribute.format,
+			offset: matchingAttribute.offset,
+			shaderLocation: nextShaderLocation++
+		});
+	}
+	return {
+		usedVertexLayouts,
+		bufferDefinitions
+	};
+}
+
+//#endregion
+export { connectAttributesToShader, isAttribute };

package/core/vertexLayout/vertexAttribute.d.ts

@@ -0,0 +1,29 @@
+import { KindToAcceptedAttribMap, KindToDefaultFormatMap, TgpuVertexAttrib, VertexFormat } from "../../shared/vertexFormat.js";
+import { FormatToWGSLType } from "../../data/vertexFormatData.js";
+import { Decorated, WgslArray, WgslStruct } from "../../data/wgslTypes.js";
+import { Disarray, LooseDecorated, Unstruct } from "../../data/dataTypes.js";
+
+//#region src/core/vertexLayout/vertexAttribute.d.ts
+/**
+ * The array can hold T, where T is a single/multi-component numeric, or a struct with members of type T.
+ * Examples of valid array members:
+ * - Vec3f,
+ * - unorm8x2
+ * - WgslStruct<{ a: Vec3f, b: unorm8x2 }>
+ * - WgslStruct<{ nested: WgslStruct<{ a: Vec3f }> }>
+ */
+type DataToContainedAttribs<T> = T extends WgslStruct | Unstruct ? { [Key in keyof T['propTypes']]: DataToContainedAttribs<T['propTypes'][Key]> } : T extends {
+  type: VertexFormat;
+} ? TgpuVertexAttrib<T['type']> : T extends {
+  type: keyof KindToDefaultFormatMap;
+} ? TgpuVertexAttrib<KindToDefaultFormatMap[T['type']]> : T extends Decorated<infer TInner> ? DataToContainedAttribs<TInner> : T extends LooseDecorated<infer TInner> ? DataToContainedAttribs<TInner> : never;
+/**
+ * Interprets an array as a set of vertex attributes.
+ */
+type ArrayToContainedAttribs<T extends WgslArray | Disarray> = DataToContainedAttribs<T['elementType']>;
+type LayoutToAllowedAttribs<T> = T extends {
+  type: keyof KindToAcceptedAttribMap;
+} ? KindToAcceptedAttribMap[T['type']] : T extends Record<string, unknown> ? { [Key in keyof T]: LayoutToAllowedAttribs<T[Key]> } : never;
+type AttribRecordToDefaultDataTypes<T extends Record<string, TgpuVertexAttrib>> = { [Key in keyof T]: FormatToWGSLType<T[Key]['format']> };
+//#endregion
+export { ArrayToContainedAttribs, AttribRecordToDefaultDataTypes, LayoutToAllowedAttribs };

package/core/vertexLayout/vertexLayout.d.ts

@@ -0,0 +1,19 @@
+import { TgpuNamable } from "../../shared/meta.js";
+import { $internal } from "../../shared/symbols.js";
+import { ArrayToContainedAttribs } from "./vertexAttribute.js";
+import { WgslArray } from "../../data/wgslTypes.js";
+import { Disarray } from "../../data/dataTypes.js";
+
+//#region src/core/vertexLayout/vertexLayout.d.ts
+interface TgpuVertexLayout<TData extends WgslArray | Disarray = WgslArray | Disarray> extends TgpuNamable {
+  readonly [$internal]: true;
+  readonly resourceType: 'vertex-layout';
+  readonly stride: number;
+  readonly stepMode: 'vertex' | 'instance';
+  readonly attrib: ArrayToContainedAttribs<TData>;
+  readonly vertexLayout: GPUVertexBufferLayout;
+  schemaForCount(n: number): TData;
+}
+declare function vertexLayout<TData extends WgslArray | Disarray>(schemaForCount: (count: number) => TData, stepMode?: 'vertex' | 'instance'): TgpuVertexLayout<TData>;
+//#endregion
+export { TgpuVertexLayout, vertexLayout };