@luma.gl/core 9.2.0-alpha.1 → 9.2.0-alpha.5

package/dist/index.cjs

@@ -37,6 +37,7 @@ __export(dist_exports, {
   DeviceLimits: () => DeviceLimits,
   ExternalTexture: () => ExternalTexture,
   Framebuffer: () => Framebuffer,
+  PipelineLayout: () => PipelineLayout,
   QuerySet: () => QuerySet,
   RenderPass: () => RenderPass,
   RenderPipeline: () => RenderPipeline,
@@ -44,30 +45,31 @@ __export(dist_exports, {
   Sampler: () => Sampler,
   Shader: () => Shader,
   Texture: () => Texture,
+  TextureFormatDecoder: () => TextureFormatDecoder,
   TextureView: () => TextureView,
   TransformFeedback: () => TransformFeedback,
   UniformBlock: () => UniformBlock,
   UniformBufferLayout: () => UniformBufferLayout,
   UniformStore: () => UniformStore,
   VertexArray: () => VertexArray,
-  _BufferLayoutHelper: () => BufferLayoutHelper,
   _getTextureFormatDefinition: () => getTextureFormatDefinition,
   _getTextureFormatTable: () => getTextureFormatTable,
   getAttributeInfosFromLayouts: () => getAttributeInfosFromLayouts,
   getAttributeShaderTypeInfo: () => getAttributeShaderTypeInfo,
-  getDataTypeFromTypedArray: () => getDataTypeFromTypedArray,
+  getDataType: () => getDataType,
   getDataTypeInfo: () => getDataTypeInfo,
+  getNormalizedDataType: () => getNormalizedDataType,
   getScratchArray: () => getScratchArray,
-  getTextureFormatCapabilities: () => getTextureFormatCapabilities,
-  getTextureFormatInfo: () => getTextureFormatInfo,
-  getTypedArrayFromDataType: () => getTypedArrayFromDataType,
+  getTypedArrayConstructor: () => getTypedArrayConstructor,
   getVariableShaderTypeInfo: () => getVariableShaderTypeInfo,
   getVertexFormatFromAttribute: () => getVertexFormatFromAttribute,
   getVertexFormatInfo: () => getVertexFormatInfo,
   log: () => log,
   luma: () => luma,
-  makeNormalizedDataType: () => makeNormalizedDataType,
-  makeVertexFormat: () => makeVertexFormat
+  makeVertexFormat: () => makeVertexFormat,
+  readPixel: () => readPixel,
+  textureFormatDecoder: () => textureFormatDecoder,
+  writePixel: () => writePixel
 });
 module.exports = __toCommonJS(dist_exports);
 
@@ -262,10 +264,6 @@ var _Buffer = class extends Resource {
   clone(props) {
     return this.device.createBuffer({ ...this.props, ...props });
   }
-  /** Read data synchronously. @note WebGL2 only */
-  readSyncWebGL(byteOffset, byteLength) {
-    throw new Error("not implemented");
-  }
   /** A partial CPU-side copy of the data in this buffer, for debugging purposes */
   debugData = new ArrayBuffer(0);
   /** This doesn't handle partial non-zero offset updates correctly */
@@ -308,10 +306,10 @@ __publicField(Buffer2, "defaultProps", {
   byteOffset: 0,
   data: null,
   indexType: "uint16",
-  mappedAtCreation: false
+  onMapped: void 0
 });
 
-// dist/shadertypes/utils/decode-data-types.js
+// dist/shadertypes/data-types/decode-data-types.js
 function getDataTypeInfo(type) {
   const [signedType, primitiveType, byteLength] = NORMALIZED_TYPE_MAP[type];
   const normalized = type.includes("norm");
@@ -326,7 +324,7 @@ function getDataTypeInfo(type) {
     signed
   };
 }
-function makeNormalizedDataType(signedDataType) {
+function getNormalizedDataType(signedDataType) {
   const dataType = signedDataType;
   switch (dataType) {
     case "uint8":
@@ -351,72 +349,117 @@ function alignTo(size, count) {
       return size + (4 - size % 4) % 4;
   }
 }
-function getDataTypeFromTypedArray(arrayOrType) {
-  const type = ArrayBuffer.isView(arrayOrType) ? arrayOrType.constructor : arrayOrType;
-  switch (type) {
-    case Float32Array:
-      return "float32";
-    case Uint16Array:
-      return "uint16";
-    case Uint32Array:
-      return "uint32";
-    case Uint8Array:
-    case Uint8ClampedArray:
-      return "uint8";
-    case Int8Array:
-      return "sint8";
-    case Int16Array:
-      return "sint16";
-    case Int32Array:
-      return "sint32";
-    default:
-      throw new Error(type.constructor.name);
+function getDataType(arrayOrType) {
+  const Constructor = ArrayBuffer.isView(arrayOrType) ? arrayOrType.constructor : arrayOrType;
+  if (Constructor === Uint8ClampedArray) {
+    return "uint8";
+  }
+  const info = Object.values(NORMALIZED_TYPE_MAP).find((entry) => Constructor === entry[4]);
+  if (!info) {
+    throw new Error(Constructor.name);
   }
+  return info[0];
 }
-function getTypedArrayFromDataType(type) {
-  switch (type) {
-    case "f32":
-    case "float32":
-      return Float32Array;
-    case "u32":
-    case "uint32":
-      return Uint32Array;
-    case "i32":
-    case "sint32":
-      return Int32Array;
+function getTypedArrayConstructor(type) {
+  const [, , , , Constructor] = NORMALIZED_TYPE_MAP[type];
+  return Constructor;
+}
+var NORMALIZED_TYPE_MAP = {
+  uint8: ["uint8", "u32", 1, false, Uint8Array],
+  sint8: ["sint8", "i32", 1, false, Int8Array],
+  unorm8: ["uint8", "f32", 1, true, Uint8Array],
+  snorm8: ["sint8", "f32", 1, true, Int8Array],
+  uint16: ["uint16", "u32", 2, false, Uint16Array],
+  sint16: ["sint16", "i32", 2, false, Int16Array],
+  unorm16: ["uint16", "u32", 2, true, Uint16Array],
+  snorm16: ["sint16", "i32", 2, true, Int16Array],
+  float16: ["float16", "f16", 2, false, Uint16Array],
+  float32: ["float32", "f32", 4, false, Float32Array],
+  uint32: ["uint32", "u32", 4, false, Uint32Array],
+  sint32: ["sint32", "i32", 4, false, Int32Array]
+};
+
+// dist/shadertypes/vertex-arrays/decode-vertex-format.js
+function getVertexFormatInfo(format) {
+  let webglOnly;
+  if (format.endsWith("-webgl")) {
+    format.replace("-webgl", "");
+    webglOnly = true;
+  }
+  const [type_, count] = format.split("x");
+  const type = type_;
+  const components = count ? parseInt(count) : 1;
+  const decodedType = getDataTypeInfo(type);
+  const result = {
+    type,
+    components,
+    byteLength: decodedType.byteLength * components,
+    integer: decodedType.integer,
+    signed: decodedType.signed,
+    normalized: decodedType.normalized
+  };
+  if (webglOnly) {
+    result.webglOnly = true;
+  }
+  return result;
+}
+function makeVertexFormat(signedDataType, components, normalized) {
+  const dataType = normalized ? getNormalizedDataType(signedDataType) : signedDataType;
+  switch (dataType) {
+    case "unorm8":
+      if (components === 1) {
+        return "unorm8";
+      }
+      if (components === 3) {
+        return "unorm8x3-webgl";
+      }
+      return `${dataType}x${components}`;
+    case "snorm8":
+    case "uint8":
+    case "sint8":
     case "uint16":
-    case "unorm16":
-      return Uint16Array;
     case "sint16":
+    case "unorm16":
     case "snorm16":
-      return Int16Array;
-    case "uint8":
-    case "unorm8":
-      return Uint8Array;
-    case "sint8":
-    case "snorm8":
-      return Int8Array;
-    case "f16":
+    case "float16":
+      if (components === 1 || components === 3) {
+        throw new Error(`size: ${components}`);
+      }
+      return `${dataType}x${components}`;
     default:
-      throw new Error(type);
+      return components === 1 ? dataType : `${dataType}x${components}`;
   }
 }
-var NORMALIZED_TYPE_MAP = {
-  uint8: ["uint8", "u32", 1, false],
-  sint8: ["sint8", "i32", 1, false],
-  unorm8: ["uint8", "f32", 1, true],
-  snorm8: ["sint8", "f32", 1, true],
-  uint16: ["uint16", "u32", 2, false],
-  sint16: ["sint16", "i32", 2, false],
-  unorm16: ["uint16", "u32", 2, true],
-  snorm16: ["sint16", "i32", 2, true],
-  float16: ["float16", "f16", 2, false],
-  float32: ["float32", "f32", 4, false],
-  uint32: ["uint32", "u32", 4, false],
-  sint32: ["sint32", "i32", 4, false]
-};
+function getVertexFormatFromAttribute(typedArray, size, normalized) {
+  if (!size || size > 4) {
+    throw new Error(`size ${size}`);
+  }
+  const components = size;
+  const signedDataType = getDataType(typedArray);
+  return makeVertexFormat(signedDataType, components, normalized);
+}
+function getCompatibleVertexFormat(opts) {
+  let vertexType;
+  switch (opts.primitiveType) {
+    case "f32":
+      vertexType = "float32";
+      break;
+    case "i32":
+      vertexType = "sint32";
+      break;
+    case "u32":
+      vertexType = "uint32";
+      break;
+    case "f16":
+      return opts.components <= 2 ? "float16x2" : "float16x4";
+  }
+  if (opts.components === 1) {
+    return vertexType;
+  }
+  return `${vertexType}x${opts.components}`;
+}
 
-// dist/shadertypes/utils/texture-format-table.js
+// dist/shadertypes/textures/texture-format-table.js
 var texture_compression_bc = "texture-compression-bc";
 var texture_compression_astc = "texture-compression-astc";
 var texture_compression_etc2 = "texture-compression-etc2";
@@ -441,73 +484,65 @@ function getTextureFormatDefinition(format) {
 function getTextureFormatTable() {
   return TEXTURE_FORMAT_TABLE;
 }
-var TEXTURE_FORMAT_TABLE = {
+var TEXTURE_FORMAT_COLOR_DEPTH_TABLE = {
   // 8-bit formats
   "r8unorm": {},
-  "r8snorm": { render: snorm8_renderable },
-  "r8uint": {},
-  "r8sint": {},
-  // 16-bit formats
   "rg8unorm": {},
-  "rg8snorm": { render: snorm8_renderable },
-  "rg8uint": {},
-  "rg8sint": {},
-  "r16uint": {},
-  "r16sint": {},
-  "r16float": { render: float16_renderable, filter: "float16-filterable-webgl" },
-  "r16unorm-webgl": { f: norm16_renderable },
-  "r16snorm-webgl": { f: snorm16_renderable },
-  // Packed 16-bit formats
-  "rgba4unorm-webgl": { channels: "rgba", bitsPerChannel: [4, 4, 4, 4], packed: true },
-  "rgb565unorm-webgl": { channels: "rgb", bitsPerChannel: [5, 6, 5, 0], packed: true },
-  "rgb5a1unorm-webgl": { channels: "rgba", bitsPerChannel: [5, 5, 5, 1], packed: true },
-  // 24-bit formats
   "rgb8unorm-webgl": {},
-  "rgb8snorm-webgl": {},
-  // 32-bit formats  
   "rgba8unorm": {},
   "rgba8unorm-srgb": {},
+  "r8snorm": { render: snorm8_renderable },
+  "rg8snorm": { render: snorm8_renderable },
+  "rgb8snorm-webgl": {},
   "rgba8snorm": { render: snorm8_renderable },
+  "r8uint": {},
+  "rg8uint": {},
   "rgba8uint": {},
+  "r8sint": {},
+  "rg8sint": {},
   "rgba8sint": {},
-  // 32-bit, reverse colors, webgpu only
   "bgra8unorm": {},
   "bgra8unorm-srgb": {},
+  "r16unorm": { f: norm16_renderable },
+  "rg16unorm": { render: norm16_renderable },
+  "rgb16unorm-webgl": { f: norm16_renderable },
+  // rgb not renderable
+  "rgba16unorm": { render: norm16_renderable },
+  "r16snorm": { f: snorm16_renderable },
+  "rg16snorm": { render: snorm16_renderable },
+  "rgb16snorm-webgl": { f: norm16_renderable },
+  // rgb not renderable
+  "rgba16snorm": { render: snorm16_renderable },
+  "r16uint": {},
   "rg16uint": {},
+  "rgba16uint": {},
+  "r16sint": {},
   "rg16sint": {},
+  "rgba16sint": {},
+  "r16float": { render: float16_renderable, filter: "float16-filterable-webgl" },
   "rg16float": { render: float16_renderable, filter: float16_filterable },
-  "rg16unorm-webgl": { render: norm16_renderable },
-  "rg16snorm-webgl": { render: snorm16_renderable },
+  "rgba16float": { render: float16_renderable, filter: float16_filterable },
   "r32uint": {},
+  "rg32uint": {},
+  "rgba32uint": {},
   "r32sint": {},
+  "rg32sint": {},
+  "rgba32sint": {},
   "r32float": { render: float32_renderable, filter: float32_filterable },
+  "rg32float": { render: false, filter: float32_filterable },
+  "rgb32float-webgl": { render: float32_renderable, filter: float32_filterable },
+  "rgba32float": { render: float32_renderable, filter: float32_filterable },
+  // Packed 16-bit formats
+  "rgba4unorm-webgl": { channels: "rgba", bitsPerChannel: [4, 4, 4, 4], packed: true },
+  "rgb565unorm-webgl": { channels: "rgb", bitsPerChannel: [5, 6, 5, 0], packed: true },
+  "rgb5a1unorm-webgl": { channels: "rgba", bitsPerChannel: [5, 5, 5, 1], packed: true },
   // Packed 32 bit formats
   "rgb9e5ufloat": { channels: "rgb", packed: true, render: rgb9e5ufloat_renderable },
   // , filter: true},
   "rg11b10ufloat": { channels: "rgb", bitsPerChannel: [11, 11, 10, 0], packed: true, p: 1, render: float32_renderable },
   "rgb10a2unorm": { channels: "rgba", bitsPerChannel: [10, 10, 10, 2], packed: true, p: 1 },
   "rgb10a2uint": { channels: "rgba", bitsPerChannel: [10, 10, 10, 2], packed: true, p: 1 },
-  // 48-bit formats
-  "rgb16unorm-webgl": { f: norm16_renderable },
-  // rgb not renderable
-  "rgb16snorm-webgl": { f: norm16_renderable },
-  // rgb not renderable
-  // 64-bit formats
-  "rg32uint": {},
-  "rg32sint": {},
-  "rg32float": { render: false, filter: float32_filterable },
-  "rgba16uint": {},
-  "rgba16sint": {},
-  "rgba16float": { render: float16_renderable, filter: float16_filterable },
-  "rgba16unorm-webgl": { render: norm16_renderable },
-  "rgba16snorm-webgl": { render: snorm16_renderable },
-  // 96-bit formats (deprecated!)
-  "rgb32float-webgl": { render: float32_renderable, filter: float32_filterable },
-  // 128-bit formats
-  "rgba32uint": {},
-  "rgba32sint": {},
-  "rgba32float": { render: float32_renderable, filter: float32_filterable },
-  // Depth/stencil
+  // Depth/stencil Formats
   // Depth and stencil formats
   stencil8: { attachment: "stencil", bitsPerChannel: [8, 0, 0, 0], dataType: "uint8" },
   "depth16unorm": { attachment: "depth", bitsPerChannel: [16, 0, 0, 0], dataType: "uint16" },
@@ -516,7 +551,9 @@ var TEXTURE_FORMAT_TABLE = {
   // The depth component of the "depth24plus" and "depth24plus-stencil8" formats may be implemented as either a 24-bit depth value or a "depth32float" value.
   "depth24plus-stencil8": { attachment: "depth-stencil", bitsPerChannel: [24, 8, 0, 0], packed: true },
   // "depth32float-stencil8" feature
-  "depth32float-stencil8": { attachment: "depth-stencil", bitsPerChannel: [32, 8, 0, 0], packed: true },
+  "depth32float-stencil8": { attachment: "depth-stencil", bitsPerChannel: [32, 8, 0, 0], packed: true }
+};
+var TEXTURE_FORMAT_COMPRESSED_TABLE = {
   // BC compressed formats: check device.features.has("texture-compression-bc");
   "bc1-rgb-unorm-webgl": { f: texture_compression_bc },
   "bc1-rgb-unorm-srgb-webgl": { f: texture_compression_bc },
@@ -587,8 +624,12 @@ var TEXTURE_FORMAT_TABLE = {
   "atc-rgba-unorm-webgl": { f: texture_compression_atc_webgl },
   "atc-rgbai-unorm-webgl": { f: texture_compression_atc_webgl }
 };
+var TEXTURE_FORMAT_TABLE = {
+  ...TEXTURE_FORMAT_COLOR_DEPTH_TABLE,
+  ...TEXTURE_FORMAT_COMPRESSED_TABLE
+};
 
-// dist/shadertypes/utils/decode-texture-format.js
+// dist/shadertypes/textures/texture-format-decoder.js
 var COMPRESSED_TEXTURE_FORMAT_PREFIXES = [
   "bc1",
   "bc2",
@@ -605,12 +646,51 @@ var COMPRESSED_TEXTURE_FORMAT_PREFIXES = [
   "pvrtc"
 ];
 var RGB_FORMAT_REGEX = /^(r|rg|rgb|rgba|bgra)([0-9]*)([a-z]*)(-srgb)?(-webgl)?$/;
-function isTextureFormatCompressed(format) {
-  return COMPRESSED_TEXTURE_FORMAT_PREFIXES.some((prefix) => format.startsWith(prefix));
-}
+var TextureFormatDecoder = class {
+  /** Returns information about a texture format, e.g. attatchment type, components, byte length and flags (integer, signed, normalized) */
+  getInfo(format) {
+    return getTextureFormatInfo(format);
+  }
+  /** Checks if a texture format is color */
+  isColor(format) {
+    return format.startsWith("rgba") || format.startsWith("bgra") || format.startsWith("rgb");
+  }
+  /** Checks if a texture format is depth or stencil */
+  isDepthStencil(format) {
+    return format.startsWith("depth") || format.startsWith("stencil");
+  }
+  /** Checks if a texture format is compressed */
+  isCompressed(format) {
+    return COMPRESSED_TEXTURE_FORMAT_PREFIXES.some((prefix) => format.startsWith(prefix));
+  }
+  /**
+   * Returns the "static" capabilities of a texture format.
+   * @note Needs to be checked against current device
+   */
+  getCapabilities(format) {
+    const info = getTextureFormatDefinition(format);
+    const formatCapabilities = {
+      format,
+      create: info.f ?? true,
+      render: info.render ?? true,
+      filter: info.filter ?? true,
+      blend: info.blend ?? true,
+      store: info.store ?? true
+    };
+    const formatInfo = getTextureFormatInfo(format);
+    const isDepthStencil = format.startsWith("depth") || format.startsWith("stencil");
+    const isSigned = formatInfo == null ? void 0 : formatInfo.signed;
+    const isInteger = formatInfo == null ? void 0 : formatInfo.integer;
+    const isWebGLSpecific = formatInfo == null ? void 0 : formatInfo.webgl;
+    formatCapabilities.render &&= !isSigned;
+    formatCapabilities.filter &&= !isDepthStencil && !isSigned && !isInteger && !isWebGLSpecific;
+    return formatCapabilities;
+  }
+};
+var textureFormatDecoder = new TextureFormatDecoder();
 function getTextureFormatInfo(format) {
   let formatInfo = getTextureFormatInfoUsingTable(format);
-  if (isTextureFormatCompressed(format)) {
+  if (textureFormatDecoder.isCompressed(format)) {
     formatInfo.channels = "rgb";
     formatInfo.components = 3;
     formatInfo.bytesPerPixel = 1;
@@ -664,25 +744,6 @@ function getTextureFormatInfo(format) {
   }
   return formatInfo;
 }
-function getTextureFormatCapabilities(format) {
-  const info = getTextureFormatDefinition(format);
-  const formatCapabilities = {
-    format,
-    create: info.f ?? true,
-    render: info.render ?? true,
-    filter: info.filter ?? true,
-    blend: info.blend ?? true,
-    store: info.store ?? true
-  };
-  const formatInfo = getTextureFormatInfo(format);
-  const isDepthStencil = format.startsWith("depth") || format.startsWith("stencil");
-  const isSigned = formatInfo == null ? void 0 : formatInfo.signed;
-  const isInteger = formatInfo == null ? void 0 : formatInfo.integer;
-  const isWebGLSpecific = formatInfo == null ? void 0 : formatInfo.webgl;
-  formatCapabilities.render &&= !isSigned;
-  formatCapabilities.filter &&= !isDepthStencil && !isSigned && !isInteger && !isWebGLSpecific;
-  return formatCapabilities;
-}
 function getTextureFormatInfoUsingTable(format) {
   var _a;
   const info = getTextureFormatDefinition(format);
@@ -766,9 +827,8 @@ var _Device = class {
   get [Symbol.toStringTag]() {
     return "Device";
   }
-  constructor(props) {
-    this.props = { ..._Device.defaultProps, ...props };
-    this.id = this.props.id || uid(this[Symbol.toStringTag].toLowerCase());
+  toString() {
+    return `Device(${this.id})`;
   }
   /** id of this device, primarily for debugging */
   id;
@@ -780,12 +840,24 @@ var _Device = class {
   statsManager = lumaStats;
   /** An abstract timestamp used for change tracking */
   timestamp = 0;
+  /** True if this device has been reused during device creation (app has multiple references) */
+  _reused = false;
   /** Used by other luma.gl modules to store data on the device */
   _lumaData = {};
   _textureCaps = {};
+  constructor(props) {
+    this.props = { ..._Device.defaultProps, ...props };
+    this.id = this.props.id || uid(this[Symbol.toStringTag].toLowerCase());
+  }
+  getVertexFormatInfo(format) {
+    return getVertexFormatInfo(format);
+  }
+  isVertexFormatSupported(format) {
+    return true;
+  }
   /** Returns information about a texture format, such as data type, channels, bits per channel, compression etc */
   getTextureFormatInfo(format) {
-    return getTextureFormatInfo(format);
+    return textureFormatDecoder.getInfo(format);
   }
   /** Determines what operations are supported on a texture format on this particular device (checks against supported device features) */
   getTextureFormatCapabilities(format) {
@@ -824,7 +896,7 @@ var _Device = class {
   }
   /** Check if a specific texture format is GPU compressed */
   isTextureFormatCompressed(format) {
-    return isTextureFormatCompressed(format);
+    return textureFormatDecoder.isCompressed(format);
   }
   // DEBUG METHODS
   pushDebugGroup(groupLabel) {
@@ -850,12 +922,40 @@ var _Device = class {
   incrementTimestamp() {
     return this.timestamp++;
   }
-  /** Report error (normally called for unhandled device errors) */
-  reportError(error, context) {
+  /**
+   * Reports Device errors in a way that optimizes for developer experience / debugging.
+   * - Logs so that the console error links directly to the source code that generated the error.
+   * - Includes the object that reported the error in the log message, even if the error is asynchronous.
+   *
+   * Conventions when calling reportError():
+   * - Always call the returned function - to ensure error is logged, at the error site
+   * - Follow with a call to device.debug() - to ensure that the debugger breaks at the error site
+   *
+   * @param error - the error to report. If needed, just create a new Error object with the appropriate message.
+   * @param context - pass `this` as context, otherwise it may not be available in the debugger for async errors.
+   * @returns the logger function returned by device.props.onError() so that it can be called from the error site.
+   *
+   * @example
+   *   device.reportError(new Error(...), this)();
+   *   device.debug();
+   */
+  reportError(error, context, ...args) {
+    const isHandled = this.props.onError(error, context);
+    if (!isHandled) {
+      return log.error(error.message, context, ...args);
+    }
+    return () => {
+    };
+  }
+  /** Break in the debugger - if device.props.debug is true */
+  debug() {
     if (this.props.debug) {
       debugger;
+    } else {
+      const message = `'Type luma.log.set({debug: true}) in console to enable debug breakpoints',
+or create a device with the 'debug: true' prop.`;
+      log.once(0, message)();
     }
-    this.props.onError(error, context);
   }
   /** Returns the default / primary canvas context. Throws an error if no canvas context is available (a WebGPU compute device) */
   getDefaultCanvasContext() {
@@ -908,8 +1008,12 @@ var _Device = class {
     throw new Error("not implemented");
   }
   // IMPLEMENTATION
+  /** Helper to get the canvas context props */
+  static _getCanvasContextProps(props) {
+    return props.createCanvasContext === true ? {} : props.createCanvasContext;
+  }
   _getDeviceTextureFormatCapabilities(format) {
-    const genericCapabilities = getTextureFormatCapabilities(format);
+    const genericCapabilities = textureFormatDecoder.getCapabilities(format);
     const checkFeature = (feature) => (typeof feature === "string" ? this.features.has(feature) : feature) ?? true;
     const supported = checkFeature(genericCapabilities.create);
     return {
@@ -927,13 +1031,17 @@ var _Device = class {
       props = { data: props };
     }
     const newProps = { ...props };
-    if ((props.usage || 0) & Buffer2.INDEX && !props.indexType) {
-      if (props.data instanceof Uint32Array) {
-        newProps.indexType = "uint32";
-      } else if (props.data instanceof Uint16Array) {
-        newProps.indexType = "uint16";
-      } else {
-        log.warn("indices buffer content must be of type uint16 or uint32")();
+    const usage = props.usage || 0;
+    if (usage & Buffer2.INDEX) {
+      if (!props.indexType) {
+        if (props.data instanceof Uint32Array) {
+          newProps.indexType = "uint32";
+        } else if (props.data instanceof Uint16Array) {
+          newProps.indexType = "uint16";
+        }
+      }
+      if (!newProps.indexType) {
+        throw new Error("indices buffer content must be of type uint16 or uint32");
       }
     }
     return newProps;
@@ -948,11 +1056,16 @@ __publicField(Device, "defaultProps", {
   // WebGL specific
   webgl: {},
   // Callbacks
-  onError: (error, context) => log.error(error.message, context)(),
+  // eslint-disable-next-line handle-callback-err
+  onError: (error, context) => {
+  },
   onResize: (context, info) => {
     const [width, height] = context.getDevicePixelSize();
-    const [prevWidth, prevHeight] = info.oldPixelSize;
-    log.log(1, `${context} Resized ${prevWidth}x${prevHeight} => ${width}x${height}px`)();
+    log.log(1, `${context} resized => ${width}x${height}px`)();
+  },
+  onPositionChange: (context, info) => {
+    const [left, top] = context.getPosition();
+    log.log(1, `${context} repositioned => ${left},${top}`)();
   },
   onVisibilityChange: (context) => log.log(1, `${context} Visibility changed ${context.isVisible}`)(),
   onDevicePixelRatioChange: (context, info) => log.log(1, `${context} DPR changed ${info.oldRatio} => ${context.devicePixelRatio}`)(),
@@ -966,6 +1079,7 @@ __publicField(Device, "defaultProps", {
   // Note: log setting is queried by the spector.js code
   debugSpectorJSUrl: void 0,
   // Experimental
+  _reuseDevices: false,
   _requestMaxLimits: true,
   _cacheShaders: false,
   _cachePipelines: false,
@@ -997,7 +1111,7 @@ var _Luma = class {
   VERSION = (
     // Version detection using build plugin
     // @ts-expect-error no-undef
-    true ? "9.2.0-alpha.1" : "running from source"
+    true ? "9.2.0-alpha.5" : "running from source"
   );
   spector;
   preregisteredAdapters = /* @__PURE__ */ new Map();
@@ -1214,6 +1328,8 @@ var _CanvasContext = class {
   _initializedResolvers = withResolvers();
   _resizeObserver;
   _intersectionObserver;
+  _position;
+  destroyed = false;
   toString() {
     return `${this[Symbol.toStringTag]}(${this.id})`;
   }
@@ -1250,6 +1366,7 @@ var _CanvasContext = class {
     this.drawingBufferWidth = this.canvas.width;
     this.drawingBufferHeight = this.canvas.height;
     this.devicePixelRatio = globalThis.devicePixelRatio || 1;
+    this._position = [0, 0];
     if (_CanvasContext.isHTMLCanvas(this.canvas)) {
       this._intersectionObserver = new IntersectionObserver((entries) => this._handleIntersection(entries));
       this._intersectionObserver.observe(this.canvas);
@@ -1260,8 +1377,14 @@ var _CanvasContext = class {
         this._resizeObserver.observe(this.canvas, { box: "content-box" });
       }
       setTimeout(() => this._observeDevicePixelRatio(), 0);
+      if (this.props.trackPosition) {
+        this._trackPosition();
+      }
     }
   }
+  destroy() {
+    this.destroyed = true;
+  }
   // SIZE METHODS
   /**
    * Returns the size covered by the canvas in CSS pixels
@@ -1271,6 +1394,9 @@ var _CanvasContext = class {
   getCSSSize() {
     return [this.cssWidth, this.cssHeight];
   }
+  getPosition() {
+    return this._position;
+  }
   /**
    * Returns the size covered by the canvas in actual device pixels.
    * @note This can be different from the 'CSS' size of a canvas due to DPR scaling, and rounding to integer pixels
@@ -1379,7 +1505,10 @@ var _CanvasContext = class {
     this.devicePixelWidth = Math.max(1, Math.min(devicePixelWidth, maxDevicePixelWidth));
     this.devicePixelHeight = Math.max(1, Math.min(devicePixelHeight, maxDevicePixelHeight));
     if (this.props.autoResize) {
-      if (this.props.useDevicePixels) {
+      if (typeof this.props.useDevicePixels === "number") {
+        const dpr = this.props.useDevicePixels;
+        this.setDrawingBufferSize(this.cssWidth * dpr, this.cssHeight * dpr);
+      } else if (this.props.useDevicePixels) {
         this.setDrawingBufferSize(this.devicePixelWidth, this.devicePixelHeight);
       } else {
         this.setDrawingBufferSize(this.cssWidth, this.cssHeight);
@@ -1388,15 +1517,46 @@ var _CanvasContext = class {
     }
     this._initializedResolvers.resolve();
     this.isInitialized = true;
+    this.updatePosition();
     this.device.props.onResize(this, { oldPixelSize });
   }
   /** Monitor DPR changes */
   _observeDevicePixelRatio() {
     const oldRatio = this.devicePixelRatio;
     this.devicePixelRatio = window.devicePixelRatio;
+    this.updatePosition();
     this.device.props.onDevicePixelRatioChange(this, { oldRatio });
     matchMedia(`(resolution: ${this.devicePixelRatio}dppx)`).addEventListener("change", () => this._observeDevicePixelRatio(), { once: true });
   }
+  /** Start tracking positions with a timer */
+  _trackPosition(intervalMs = 100) {
+    const intervalId = setInterval(() => {
+      if (this.destroyed) {
+        clearInterval(intervalId);
+      } else {
+        this.updatePosition();
+      }
+    }, intervalMs);
+  }
+  /**
+   * Calculated the absolute position of the canvas
+   * @note - getBoundingClientRect() is normally cheap but can be expensive
+   * if called before browser has finished a reflow. Should not be the case here.
+   */
+  updatePosition() {
+    var _a, _b, _c;
+    const newRect = (_a = this.htmlCanvas) == null ? void 0 : _a.getBoundingClientRect();
+    if (newRect) {
+      const position = [newRect.left, newRect.top];
+      this._position ??= position;
+      const positionChanged = position[0] !== this._position[0] || position[1] !== this._position[1];
+      if (positionChanged) {
+        const oldPosition = this._position;
+        this._position = position;
+        (_c = (_b = this.device.props).onPositionChange) == null ? void 0 : _c.call(_b, this, { oldPosition });
+      }
+    }
+  }
 };
 var CanvasContext = _CanvasContext;
 __publicField(CanvasContext, "defaultProps", {
@@ -1409,7 +1569,8 @@ __publicField(CanvasContext, "defaultProps", {
   container: null,
   visible: true,
   alphaMode: "opaque",
-  colorSpace: "srgb"
+  colorSpace: "srgb",
+  trackPosition: false
 });
 function getContainer(container) {
   if (typeof container === "string") {
@@ -2194,7 +2355,7 @@ __publicField(CommandBuffer, "defaultProps", {
   ...Resource.defaultProps
 });
 
-// dist/shadertypes/utils/decode-shader-types.js
+// dist/shadertypes/data-types/decode-shader-types.js
 function getVariableShaderTypeInfo(format) {
   const decoded = UNIFORM_FORMATS[format];
   return decoded;
@@ -2347,86 +2508,6 @@ var WGSL_VARIABLE_TYPE_ALIAS_MAP = {
   mat4x4h: "mat4x4<f16>"
 };
 
-// dist/shadertypes/utils/decode-vertex-format.js
-function getVertexFormatInfo(format) {
-  let webglOnly;
-  if (format.endsWith("-webgl")) {
-    format.replace("-webgl", "");
-    webglOnly = true;
-  }
-  const [type_, count] = format.split("x");
-  const type = type_;
-  const components = count ? parseInt(count) : 1;
-  const decodedType = getDataTypeInfo(type);
-  const result = {
-    type,
-    components,
-    byteLength: decodedType.byteLength * components,
-    integer: decodedType.integer,
-    signed: decodedType.signed,
-    normalized: decodedType.normalized
-  };
-  if (webglOnly) {
-    result.webglOnly = true;
-  }
-  return result;
-}
-function makeVertexFormat(signedDataType, components, normalized) {
-  const dataType = normalized ? makeNormalizedDataType(signedDataType) : signedDataType;
-  switch (dataType) {
-    case "unorm8":
-      if (components === 1) {
-        return "unorm8-webgl";
-      }
-      if (components === 3) {
-        return "unorm8x3-webgl";
-      }
-      return `${dataType}x${components}`;
-    case "snorm8":
-    case "uint8":
-    case "sint8":
-    case "uint16":
-    case "sint16":
-    case "unorm16":
-    case "snorm16":
-    case "float16":
-      if (components === 1 || components === 3) {
-        throw new Error(`size: ${components}`);
-      }
-      return `${dataType}x${components}`;
-    default:
-      return components === 1 ? dataType : `${dataType}x${components}`;
-  }
-}
-function getVertexFormatFromAttribute(typedArray, size, normalized) {
-  if (!size || size > 4) {
-    throw new Error(`size ${size}`);
-  }
-  const components = size;
-  const signedDataType = getDataTypeFromTypedArray(typedArray);
-  return makeVertexFormat(signedDataType, components, normalized);
-}
-function getCompatibleVertexFormat(opts) {
-  let vertexType;
-  switch (opts.primitiveType) {
-    case "f32":
-      vertexType = "float32";
-      break;
-    case "i32":
-      vertexType = "sint32";
-      break;
-    case "u32":
-      vertexType = "uint32";
-      break;
-    case "f16":
-      return opts.components <= 2 ? "float16x2" : "float16x4";
-  }
-  if (opts.components === 1) {
-    return vertexType;
-  }
-  return `${vertexType}x${opts.components}`;
-}
-
 // dist/adapter-utils/get-attribute-from-layouts.js
 function getAttributeInfosFromLayouts(shaderLayout, bufferLayout) {
   const attributeInfos = {};
@@ -2566,7 +2647,7 @@ var _VertexArray = class extends Resource {
   // DEPRECATED METHODS
   /** @deprecated Set constant attributes (WebGL only) */
   setConstantWebGL(location, value) {
-    throw new Error("constant attributes not supported");
+    this.device.reportError(new Error("constant attributes not supported"), this)();
   }
 };
 var VertexArray = _VertexArray;
@@ -2608,6 +2689,24 @@ __publicField(QuerySet, "defaultProps", {
   count: void 0
 });
 
+// dist/adapter/resources/pipeline-layout.js
+var _PipelineLayout = class extends Resource {
+  get [Symbol.toStringTag]() {
+    return "PipelineLayout";
+  }
+  constructor(device, props) {
+    super(device, props, _PipelineLayout.defaultProps);
+  }
+};
+var PipelineLayout = _PipelineLayout;
+__publicField(PipelineLayout, "defaultProps", {
+  ...Resource.defaultProps,
+  shaderLayout: {
+    attributes: [],
+    bindings: []
+  }
+});
+
 // dist/utils/array-utils-flat.js
 var arrayBuffer;
 function getScratchArrayBuffer(byteLength) {
@@ -2639,11 +2738,12 @@ var UniformBufferLayout = class {
   /** number of bytes needed for buffer allocation */
   byteLength;
   /** Create a new UniformBufferLayout given a map of attributes. */
-  constructor(uniformTypes) {
+  constructor(uniformTypes, uniformSizes = {}) {
     let size = 0;
     for (const [key, uniformType] of Object.entries(uniformTypes)) {
       const typeAndComponents = getVariableShaderTypeInfo(uniformType);
-      const { type, components: count } = typeAndComponents;
+      const { type, components } = typeAndComponents;
+      const count = components * ((uniformSizes == null ? void 0 : uniformSizes[key]) ?? 1);
       size = alignTo(size, count);
       const offset = size;
       size += count;
@@ -2655,8 +2755,7 @@ var UniformBufferLayout = class {
   }
   /** Get the data for the complete buffer */
   getData(uniformValues) {
-    const bufferSize = Math.max(this.byteLength, minBufferSize);
-    const arrayBuffer2 = getScratchArrayBuffer(bufferSize);
+    const arrayBuffer2 = getScratchArrayBuffer(this.byteLength);
     const typedArrays = {
       i32: new Int32Array(arrayBuffer2),
       u32: new Uint32Array(arrayBuffer2),
@@ -2686,7 +2785,7 @@ var UniformBufferLayout = class {
         typedArray.set(value, offset);
       }
     }
-    return new Uint8Array(arrayBuffer2);
+    return new Uint8Array(arrayBuffer2, 0, this.byteLength);
   }
   /** Does this layout have a field with specified name */
   has(name2) {
@@ -2791,7 +2890,7 @@ var UniformStore = class {
   constructor(blocks) {
     for (const [bufferName, block] of Object.entries(blocks)) {
       const uniformBufferName = bufferName;
-      const uniformBufferLayout = new UniformBufferLayout(block.uniformTypes || {});
+      const uniformBufferLayout = new UniformBufferLayout(block.uniformTypes ?? {}, block.uniformSizes ?? {});
       this.uniformBufferLayouts.set(uniformBufferName, uniformBufferLayout);
       const uniformBlock = new UniformBlock({ name: bufferName });
       uniformBlock.setUniforms(block.defaultUniforms || {});
@@ -2885,31 +2984,85 @@ var UniformStore = class {
   }
 };
 
-// dist/adapter-utils/buffer-layout-helper.js
-var BufferLayoutHelper = class {
-  bufferLayouts;
-  constructor(bufferLayouts) {
-    this.bufferLayouts = bufferLayouts;
+// dist/shadertypes/textures/pixel-utils.js
+function readPixel(pixelData, x, y, bitsPerChannel) {
+  if (x < 0 || x >= pixelData.width || y < 0 || y >= pixelData.height) {
+    throw new Error("Coordinates out of bounds.");
+  }
+  const byteOffset = y * pixelData.bytesPerRow + x * pixelData.bytesPerPixel;
+  const pixelDataView = new DataView(pixelData.arrayBuffer, byteOffset, pixelData.bytesPerPixel);
+  let bitOffsetWithinPixel = 0;
+  const channels = [];
+  for (let i = 0; i < 4; i++) {
+    const bits = bitsPerChannel[i];
+    if (bits <= 0) {
+      channels.push(0);
+    } else {
+      const channelValue = readBitsFromDataView(pixelDataView, bitOffsetWithinPixel, bits);
+      channels.push(channelValue);
+      bitOffsetWithinPixel += bits;
+    }
+  }
+  return [channels[0], channels[1], channels[2], channels[3]];
+}
+function writePixel(dataView, bitOffset, bitsPerChannel, pixel) {
+  let currentBitOffset = bitOffset;
+  for (let channel = 0; channel < 4; channel++) {
+    const bits = bitsPerChannel[channel];
+    const maxValue = (1 << bits) - 1;
+    const channelValue = pixel[channel] & maxValue;
+    writeBitsToDataView(dataView, currentBitOffset, bits, channelValue);
+    currentBitOffset += bits;
   }
-  getBufferLayout(name2) {
-    return this.bufferLayouts.find((layout) => layout.name === name2) || null;
+}
+function readBitsFromDataView(dataView, bitOffset, bitCount) {
+  if (bitOffset % 8 === 0) {
+    const byteOffset = bitOffset / 8;
+    if (bitCount === 8 && byteOffset + 1 <= dataView.byteLength) {
+      return dataView.getUint8(byteOffset);
+    } else if (bitCount === 16 && byteOffset + 2 <= dataView.byteLength) {
+      return dataView.getUint16(byteOffset, false);
+    } else if (bitCount === 32 && byteOffset + 4 <= dataView.byteLength) {
+      return dataView.getUint32(byteOffset, false);
+    }
+  }
+  let value = 0;
+  for (let i = 0; i < bitCount; i++) {
+    const overallBitIndex = bitOffset + i;
+    const byteIndex = Math.floor(overallBitIndex / 8);
+    const bitIndex = overallBitIndex % 8;
+    const byteValue = dataView.getUint8(byteIndex);
+    const bit = byteValue >> 7 - bitIndex & 1;
+    value = value << 1 | bit;
   }
-  /** Get attribute names from a BufferLayout */
-  getAttributeNamesForBuffer(bufferLayout) {
-    var _a;
-    return bufferLayout.attributes ? (_a = bufferLayout.attributes) == null ? void 0 : _a.map((layout) => layout.attribute) : [bufferLayout.name];
-  }
-  mergeBufferLayouts(bufferLayouts1, bufferLayouts2) {
-    const mergedLayouts = [...bufferLayouts1];
-    for (const attribute of bufferLayouts2) {
-      const index = mergedLayouts.findIndex((attribute2) => attribute2.name === attribute.name);
-      if (index < 0) {
-        mergedLayouts.push(attribute);
-      } else {
-        mergedLayouts[index] = attribute;
-      }
+  return value;
+}
+function writeBitsToDataView(dataView, bitOffset, bitCount, value) {
+  if (bitOffset % 8 === 0) {
+    const byteOffset = bitOffset / 8;
+    if (bitCount === 8 && byteOffset + 1 <= dataView.byteLength) {
+      dataView.setUint8(byteOffset, value & 255);
+      return;
+    } else if (bitCount === 16 && byteOffset + 2 <= dataView.byteLength) {
+      dataView.setUint16(byteOffset, value & 65535, false);
+      return;
+    } else if (bitCount === 32 && byteOffset + 4 <= dataView.byteLength) {
+      dataView.setUint32(byteOffset, value, false);
+      return;
     }
-    return mergedLayouts;
   }
-};
+  for (let i = 0; i < bitCount; i++) {
+    const overallBitIndex = bitOffset + i;
+    const byteIndex = Math.floor(overallBitIndex / 8);
+    const bitIndex = overallBitIndex % 8;
+    const mask = 1 << 7 - bitIndex;
+    const bitValue = value >> bitCount - 1 - i & 1;
+    let currentByte = dataView.getUint8(byteIndex);
+    currentByte &= ~mask;
+    if (bitValue) {
+      currentByte |= mask;
+    }
+    dataView.setUint8(byteIndex, currentByte);
+  }
+}
 //# sourceMappingURL=index.cjs.map