@luma.gl/webgpu 9.0.0-alpha.9 → 9.0.0-beta.10

package/dist/dist.dev.js

@@ -0,0 +1,1664 @@
+(function webpackUniversalModuleDefinition(root, factory) {
+  if (typeof exports === 'object' && typeof module === 'object')
+    module.exports = factory();
+  else if (typeof define === 'function' && define.amd) define([], factory);
+        else if (typeof exports === 'object') exports['luma'] = factory();
+  else root['luma'] = factory();})(globalThis, function () {
+var __exports__ = (() => {
+  var __create = Object.create;
+  var __defProp = Object.defineProperty;
+  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+  var __getOwnPropNames = Object.getOwnPropertyNames;
+  var __getProtoOf = Object.getPrototypeOf;
+  var __hasOwnProp = Object.prototype.hasOwnProperty;
+  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+  var __commonJS = (cb, mod) => function __require() {
+    return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
+  };
+  var __export = (target, all) => {
+    for (var name in all)
+      __defProp(target, name, { get: all[name], enumerable: true });
+  };
+  var __copyProps = (to, from, except, desc) => {
+    if (from && typeof from === "object" || typeof from === "function") {
+      for (let key of __getOwnPropNames(from))
+        if (!__hasOwnProp.call(to, key) && key !== except)
+          __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+    }
+    return to;
+  };
+  var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+  var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+    // If the importer is in node compatibility mode or this is not an ESM
+    // file that has been converted to a CommonJS file using a Babel-
+    // compatible transform (i.e. "__esModule" has not been set), then set
+    // "default" to the CommonJS "module.exports" for node compatibility.
+    isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+    mod
+  ));
+  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+  var __publicField = (obj, key, value) => {
+    __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+    return value;
+  };
+
+  // external-global-plugin:@luma.gl/core
+  var require_core = __commonJS({
+    "external-global-plugin:@luma.gl/core"(exports, module) {
+      module.exports = globalThis.luma;
+    }
+  });
+
+  // bundle.ts
+  var bundle_exports = {};
+  __export(bundle_exports, {
+    WebGPUBuffer: () => WebGPUBuffer,
+    WebGPUDevice: () => WebGPUDevice,
+    WebGPUSampler: () => WebGPUSampler,
+    WebGPUShader: () => WebGPUShader,
+    WebGPUTexture: () => WebGPUTexture
+  });
+  __reExport(bundle_exports, __toESM(require_core(), 1));
+
+  // src/adapter/webgpu-device.ts
+  var import_core17 = __toESM(require_core(), 1);
+
+  // src/adapter/resources/webgpu-buffer.ts
+  var import_core = __toESM(require_core(), 1);
+  function getByteLength(props) {
+    return props.byteLength || props.data?.byteLength || 0;
+  }
+  var WebGPUBuffer = class extends import_core.Buffer {
+    device;
+    handle;
+    byteLength;
+    constructor(device, props) {
+      super(device, props);
+      this.device = device;
+      this.byteLength = getByteLength(props);
+      const mapBuffer = Boolean(props.data);
+      const size = Math.ceil(this.byteLength / 4) * 4;
+      this.handle = this.props.handle || this.device.handle.createBuffer({
+        size,
+        // usage defaults to vertex
+        usage: this.props.usage || GPUBufferUsage.VERTEX | GPUBufferUsage.COPY_DST,
+        mappedAtCreation: this.props.mappedAtCreation || mapBuffer,
+        label: this.props.id
+      });
+      if (props.data) {
+        this._writeMapped(props.data);
+      }
+      if (mapBuffer && !props.mappedAtCreation) {
+        this.handle.unmap();
+      }
+    }
+    destroy() {
+      this.handle?.destroy();
+      this.handle = null;
+    }
+    // WebGPU provides multiple ways to write a buffer...
+    write(data, byteOffset = 0) {
+      this.device.handle.queue.writeBuffer(
+        this.handle,
+        byteOffset,
+        data.buffer,
+        data.byteOffset,
+        data.byteLength
+      );
+    }
+    async readAsync(byteOffset = 0, byteLength = this.byteLength) {
+      const tempBuffer = new WebGPUBuffer(this.device, {
+        usage: import_core.Buffer.MAP_READ | import_core.Buffer.COPY_DST,
+        byteLength
+      });
+      const commandEncoder = this.device.handle.createCommandEncoder();
+      commandEncoder.copyBufferToBuffer(this.handle, byteOffset, tempBuffer.handle, 0, byteLength);
+      this.device.handle.queue.submit([commandEncoder.finish()]);
+      await tempBuffer.handle.mapAsync(GPUMapMode.READ, byteOffset, byteLength);
+      const arrayBuffer = tempBuffer.handle.getMappedRange().slice(0);
+      tempBuffer.handle.unmap();
+      tempBuffer.destroy();
+      return new Uint8Array(arrayBuffer);
+    }
+    _writeMapped(typedArray) {
+      const arrayBuffer = this.handle.getMappedRange();
+      new typedArray.constructor(arrayBuffer).set(typedArray);
+    }
+    // WEBGPU API
+    mapAsync(mode, offset = 0, size) {
+      return this.handle.mapAsync(mode, offset, size);
+    }
+    getMappedRange(offset = 0, size) {
+      return this.handle.getMappedRange(offset, size);
+    }
+    unmap() {
+      this.handle.unmap();
+    }
+  };
+
+  // src/adapter/resources/webgpu-texture.ts
+  var import_core4 = __toESM(require_core(), 1);
+
+  // src/adapter/helpers/convert-texture-format.ts
+  function getWebGPUTextureFormat(format) {
+    if (format.includes("webgl")) {
+      throw new Error("webgl-only format");
+    }
+    return format;
+  }
+
+  // src/adapter/resources/webgpu-sampler.ts
+  var import_core2 = __toESM(require_core(), 1);
+  var WebGPUSampler = class extends import_core2.Sampler {
+    device;
+    handle;
+    constructor(device, props) {
+      super(device, props);
+      this.device = device;
+      const samplerProps = { ...this.props };
+      if (samplerProps.type !== "comparison-sampler") {
+        delete samplerProps.compare;
+      }
+      this.handle = this.handle || this.device.handle.createSampler(samplerProps);
+      this.handle.label = this.props.id;
+    }
+    destroy() {
+      this.handle = null;
+    }
+  };
+
+  // src/adapter/resources/webgpu-texture-view.ts
+  var import_core3 = __toESM(require_core(), 1);
+  var WebGPUTextureView = class extends import_core3.TextureView {
+    device;
+    handle;
+    texture;
+    constructor(device, props) {
+      super(device, props);
+      this.device = device;
+      this.texture = props.texture;
+      this.handle = this.handle || this.texture.handle.createView({
+        format: props.format || this.texture.format,
+        dimension: props.dimension || this.texture.dimension,
+        aspect: props.aspect,
+        baseMipLevel: props.baseMipLevel,
+        mipLevelCount: props.mipLevelCount,
+        // GPUIntegerCoordinate;
+        baseArrayLayer: props.baseArrayLayer,
+        // GPUIntegerCoordinate;
+        arrayLayerCount: props.arrayLayerCount
+        // GPUIntegerCoordinate;
+      });
+      this.handle.label = this.props.id;
+    }
+    destroy() {
+      this.handle = null;
+    }
+  };
+
+  // src/adapter/resources/webgpu-texture.ts
+  var BASE_DIMENSIONS = {
+    "1d": "1d",
+    "2d": "2d",
+    "2d-array": "2d",
+    cube: "2d",
+    "cube-array": "2d",
+    "3d": "3d"
+  };
+  var WebGPUTexture = class extends import_core4.Texture {
+    device;
+    handle;
+    height = 1;
+    width = 1;
+    sampler;
+    view;
+    // static async createFromImageURL(src, usage = 0) {
+    //   const img = document.createElement('img');
+    //   img.src = src;
+    //   await img.decode();
+    //   return WebGPUTexture(img, usage);
+    // }
+    constructor(device, props) {
+      super(device, props);
+      this.device = device;
+      if (props.data instanceof Promise) {
+        props.data.then((resolvedImageData) => {
+          this.props = { ...props, data: resolvedImageData };
+          this.initialize(this.props);
+        });
+        return;
+      }
+      this.initialize(props);
+    }
+    destroy() {
+      this.handle?.destroy();
+      this.handle = null;
+    }
+    createView(props) {
+      return new WebGPUTextureView(this.device, { ...props, texture: this });
+    }
+    initialize(props) {
+      this.handle = this.props.handle || this.createHandle();
+      this.handle.label ||= this.id;
+      if (this.props.data) {
+        this.setData({ data: this.props.data });
+      }
+      this.width = this.handle.width;
+      this.height = this.handle.height;
+      this.sampler = props.sampler instanceof WebGPUSampler ? props.sampler : new WebGPUSampler(this.device, props.sampler);
+      this.view = new WebGPUTextureView(this.device, { ...this.props, texture: this });
+    }
+    createHandle() {
+      const width = this.props.width || this.props.data?.width || 1;
+      const height = this.props.height || this.props.data?.height || 1;
+      return this.device.handle.createTexture({
+        label: this.id,
+        size: {
+          width,
+          height,
+          depthOrArrayLayers: this.props.depth
+        },
+        dimension: BASE_DIMENSIONS[this.props.dimension],
+        format: getWebGPUTextureFormat(this.props.format),
+        usage: this.props.usage,
+        mipLevelCount: this.props.mipLevels,
+        sampleCount: this.props.samples
+      });
+    }
+    /**
+     * Set default sampler
+     * Accept a sampler instance or set of props;
+     */
+    setSampler(sampler) {
+      this.sampler = sampler instanceof WebGPUSampler ? sampler : new WebGPUSampler(this.device, sampler);
+      return this;
+    }
+    setData(options) {
+      return this.setImage({ source: options.data });
+    }
+    /** Set image */
+    setImage(options) {
+      const {
+        source,
+        width = options.source.width,
+        height = options.source.height,
+        depth = 1,
+        sourceX = 0,
+        sourceY = 0,
+        mipLevel = 0,
+        x = 0,
+        y = 0,
+        z = 0,
+        aspect = "all",
+        colorSpace = "srgb",
+        premultipliedAlpha = false
+      } = options;
+      this.device.handle.queue.copyExternalImageToTexture(
+        // source: GPUImageCopyExternalImage
+        {
+          source,
+          origin: [sourceX, sourceY]
+        },
+        // destination: GPUImageCopyTextureTagged
+        {
+          texture: this.handle,
+          origin: [x, y, z],
+          mipLevel,
+          aspect,
+          colorSpace,
+          premultipliedAlpha
+        },
+        // copySize: GPUExtent3D
+        [width, height, depth]
+      );
+      return { width, height };
+    }
+    // WebGPU specific
+    /*
+      async readPixels() {
+        const readbackBuffer = device.createBuffer({
+            usage: Buffer.COPY_DST | Buffer.MAP_READ,
+            size: 4 * textureWidth * textureHeight,
+        });
+    
+        // Copy data from the texture to the buffer.
+        const encoder = device.createCommandEncoder();
+        encoder.copyTextureToBuffer(
+            { texture },
+            { buffer, rowPitch: textureWidth * 4 },
+            [textureWidth, textureHeight],
+        );
+        device.submit([encoder.finish()]);
+    
+        // Get the data on the CPU.
+        await buffer.mapAsync(GPUMapMode.READ);
+        saveScreenshot(buffer.getMappedRange());
+        buffer.unmap();
+      }
+    
+      setImageData(imageData, usage): this {
+        let data = null;
+    
+        const bytesPerRow = Math.ceil((img.width * 4) / 256) * 256;
+        if (bytesPerRow == img.width * 4) {
+          data = imageData.data;
+        } else {
+          data = new Uint8Array(bytesPerRow * img.height);
+          let imagePixelIndex = 0;
+          for (let y = 0; y < img.height; ++y) {
+            for (let x = 0; x < img.width; ++x) {
+              const i = x * 4 + y * bytesPerRow;
+              data[i] = imageData.data[imagePixelIndex];
+              data[i + 1] = imageData.data[imagePixelIndex + 1];
+              data[i + 2] = imageData.data[imagePixelIndex + 2];
+              data[i + 3] = imageData.data[imagePixelIndex + 3];
+              imagePixelIndex += 4;
+            }
+          }
+        }
+        return this;
+      }
+    
+      setData(data): this {
+        const textureDataBuffer = this.device.handle.createBuffer({
+          size: data.byteLength,
+          usage: Buffer.COPY_DST | Buffer.COPY_SRC,
+          mappedAtCreation: true
+        });
+        new Uint8Array(textureDataBuffer.getMappedRange()).set(data);
+        textureDataBuffer.unmap();
+    
+        this.setBuffer(textureDataBuffer);
+    
+        textureDataBuffer.destroy();
+        return this;
+      }
+    
+      setBuffer(textureDataBuffer, {bytesPerRow}): this {
+        const commandEncoder = this.device.handle.createCommandEncoder();
+        commandEncoder.copyBufferToTexture(
+          {
+            buffer: textureDataBuffer,
+            bytesPerRow
+          },
+          {
+            texture: this.handle
+          },
+          {
+            width,
+            height,
+            depth
+          }
+        );
+    
+        this.device.handle.defaultQueue.submit([commandEncoder.finish()]);
+        return this;
+      }
+      */
+  };
+
+  // src/adapter/resources/webgpu-external-texture.ts
+  var import_core5 = __toESM(require_core(), 1);
+  var WebGPUExternalTexture = class extends import_core5.ExternalTexture {
+    device;
+    handle;
+    sampler;
+    constructor(device, props) {
+      super(device, props);
+      this.device = device;
+      this.handle = this.props.handle || this.device.handle.importExternalTexture({
+        source: props.source,
+        colorSpace: props.colorSpace
+      });
+      this.sampler = null;
+    }
+    destroy() {
+      this.handle = null;
+    }
+    /** Set default sampler */
+    setSampler(sampler) {
+      this.sampler = sampler instanceof WebGPUSampler ? sampler : new WebGPUSampler(this.device, sampler);
+      return this;
+    }
+  };
+
+  // src/adapter/resources/webgpu-shader.ts
+  var import_core6 = __toESM(require_core(), 1);
+  var WebGPUShader = class extends import_core6.Shader {
+    device;
+    handle;
+    constructor(device, props) {
+      super(device, props);
+      this.device = device;
+      this.device.handle.pushErrorScope("validation");
+      this.handle = this.props.handle || this.createHandle();
+      this.handle.label = this.props.id;
+      this._checkCompilationError(this.device.handle.popErrorScope());
+    }
+    async _checkCompilationError(errorScope) {
+      const error = await errorScope;
+      if (error) {
+        this.debugShader();
+        const shaderLog = await this.getCompilationInfo();
+        import_core6.log.error(`Shader compilation error: ${error.message}`, shaderLog)();
+        throw new Error(`Shader compilation error: ${error.message}`);
+      }
+    }
+    destroy() {
+      this.handle = null;
+    }
+    /** Returns compilation info for this shader */
+    async getCompilationInfo() {
+      const compilationInfo = await this.handle.getCompilationInfo();
+      return compilationInfo.messages;
+    }
+    // PRIVATE METHODS
+    createHandle() {
+      const { source } = this.props;
+      const isGLSL = source.includes("#version");
+      if (this.props.language === "glsl" || isGLSL) {
+        throw new Error("GLSL shaders are not supported in WebGPU");
+      }
+      return this.device.handle.createShaderModule({ code: source });
+    }
+  };
+
+  // src/adapter/resources/webgpu-render-pipeline.ts
+  var import_core9 = __toESM(require_core(), 1);
+
+  // src/adapter/helpers/webgpu-parameters.ts
+  function addDepthStencil(descriptor) {
+    descriptor.depthStencil = descriptor.depthStencil || {
+      // required, set something
+      format: "depth24plus",
+      stencilFront: {},
+      stencilBack: {},
+      // TODO can this cause trouble? Should we set to WebGPU defaults? Are there defaults?
+      depthWriteEnabled: false,
+      depthCompare: "less-equal"
+    };
+    return descriptor.depthStencil;
+  }
+  var PARAMETER_TABLE = {
+    // RASTERIZATION PARAMETERS
+    cullMode: (parameter, value, descriptor) => {
+      descriptor.primitive = descriptor.primitive || {};
+      descriptor.primitive.cullMode = value;
+    },
+    frontFace: (parameter, value, descriptor) => {
+      descriptor.primitive = descriptor.primitive || {};
+      descriptor.primitive.frontFace = value;
+    },
+    // DEPTH
+    depthWriteEnabled: (parameter, value, descriptor) => {
+      const depthStencil = addDepthStencil(descriptor);
+      depthStencil.depthWriteEnabled = value;
+    },
+    depthCompare: (parameter, value, descriptor) => {
+      const depthStencil = addDepthStencil(descriptor);
+      depthStencil.depthCompare = value;
+    },
+    depthFormat: (parameter, value, descriptor) => {
+      const depthStencil = addDepthStencil(descriptor);
+      depthStencil.format = value;
+    },
+    depthBias: (parameter, value, descriptor) => {
+      const depthStencil = addDepthStencil(descriptor);
+      depthStencil.depthBias = value;
+    },
+    depthBiasSlopeScale: (parameter, value, descriptor) => {
+      const depthStencil = addDepthStencil(descriptor);
+      depthStencil.depthBiasSlopeScale = value;
+    },
+    depthBiasClamp: (parameter, value, descriptor) => {
+      const depthStencil = addDepthStencil(descriptor);
+      depthStencil.depthBiasClamp = value;
+    },
+    // STENCIL
+    stencilReadMask: (parameter, value, descriptor) => {
+      const depthStencil = addDepthStencil(descriptor);
+      depthStencil.stencilReadMask = value;
+    },
+    stencilWriteMask: (parameter, value, descriptor) => {
+      const depthStencil = addDepthStencil(descriptor);
+      depthStencil.stencilWriteMask = value;
+    },
+    stencilCompare: (parameter, value, descriptor) => {
+      const depthStencil = addDepthStencil(descriptor);
+      depthStencil.stencilFront.compare = value;
+      depthStencil.stencilBack.compare = value;
+    },
+    stencilPassOperation: (parameter, value, descriptor) => {
+      const depthStencil = addDepthStencil(descriptor);
+      depthStencil.stencilFront.passOp = value;
+      depthStencil.stencilBack.passOp = value;
+    },
+    stencilFailOperation: (parameter, value, descriptor) => {
+      const depthStencil = addDepthStencil(descriptor);
+      depthStencil.stencilFront.failOp = value;
+      depthStencil.stencilBack.failOp = value;
+    },
+    stencilDepthFailOperation: (parameter, value, descriptor) => {
+      const depthStencil = addDepthStencil(descriptor);
+      depthStencil.stencilFront.depthFailOp = value;
+      depthStencil.stencilBack.depthFailOp = value;
+    },
+    // MULTISAMPLE
+    sampleCount: (parameter, value, descriptor) => {
+      descriptor.multisample = descriptor.multisample || {};
+      descriptor.multisample.count = value;
+    },
+    sampleMask: (parameter, value, descriptor) => {
+      descriptor.multisample = descriptor.multisample || {};
+      descriptor.multisample.mask = value;
+    },
+    sampleAlphaToCoverageEnabled: (parameter, value, descriptor) => {
+      descriptor.multisample = descriptor.multisample || {};
+      descriptor.multisample.alphaToCoverageEnabled = value;
+    },
+    // COLOR
+    colorMask: (parameter, value, descriptor) => {
+      const targets = addColorState(descriptor);
+      targets[0].writeMask = value;
+    },
+    blendColorOperation: (parameter, value, descriptor) => {
+      addColorState(descriptor);
+    }
+    /*
+      blendColorSrcTarget: (parameter, value, descriptor: GPURenderPipelineDescriptor) => {
+        addColorState(descriptor);
+        targets[0].blend = targets[0].blend || {};
+        targets[0].blend.color = targets[0].blend.color || {};
+        targets[0].blend.color.srcTarget = value;
+      },
+    
+      blendColorDstTarget: (parameter, value, descriptor: GPURenderPipelineDescriptor) => {
+        addColorState(descriptor);
+        targets[0].blend = targets[0].blend || {};
+        targets[0].blend.color = targets[0].blend.color || {};
+        targets[0].blend.color.dstTarget = value;
+      },
+    
+      blendAlphaOperation: (parameter, value, descriptor: GPURenderPipelineDescriptor) => {
+        addColorState(descriptor);
+        targets[0].blend = targets[0].blend || {};
+        targets[0].blend.alpha = targets[0].blend.alpha || {};
+        targets[0].blend.alpha.operation = value;
+      },
+    
+      blendAlphaSrcTarget: (parameter, value, descriptor: GPURenderPipelineDescriptor) => {
+        addColorState(descriptor);
+        targets[0].blend = targets[0].blend || {};
+        targets[0].blend.alpha = targets[0].blend.alpha || {};
+        targets[0].blend.alpha.srcTarget = value;
+      },
+    
+      blendAlphaDstTarget: (parameter, value, descriptor: GPURenderPipelineDescriptor) => {
+        addColorState(descriptor);
+        targets[0].blend = targets[0].blend || {};
+        targets[0].blend.alpha = targets[0].blend.alpha || {};
+        targets[0].blend.alpha.dstTarget = value;
+      },
+      */
+  };
+  var DEFAULT_PIPELINE_DESCRIPTOR = {
+    // depthStencil: {
+    //   stencilFront: {},
+    //   stencilBack: {},
+    //   // depthWriteEnabled: true,
+    //   // depthCompare: 'less',
+    //   // format: 'depth24plus-stencil8',
+    // },
+    primitive: {
+      cullMode: "back",
+      topology: "triangle-list"
+    },
+    vertex: {
+      module: void 0,
+      entryPoint: "main"
+    },
+    fragment: {
+      module: void 0,
+      entryPoint: "main",
+      targets: [
+        // { format: props.color0Format || 'bgra8unorm' }
+      ]
+    },
+    layout: "auto"
+  };
+  function applyParametersToRenderPipelineDescriptor(pipelineDescriptor, parameters = {}) {
+    Object.assign(pipelineDescriptor, { ...DEFAULT_PIPELINE_DESCRIPTOR, ...pipelineDescriptor });
+    setParameters(pipelineDescriptor, parameters);
+  }
+  function setParameters(pipelineDescriptor, parameters) {
+    for (const [key, value] of Object.entries(parameters)) {
+      const setterFunction = PARAMETER_TABLE[key];
+      if (!setterFunction) {
+        throw new Error(`Illegal parameter ${key}`);
+      }
+      setterFunction(key, value, pipelineDescriptor);
+    }
+  }
+  function addColorState(descriptor) {
+    descriptor.fragment.targets = descriptor.fragment?.targets || [];
+    if (!Array.isArray(descriptor.fragment?.targets)) {
+      throw new Error("colorstate");
+    }
+    if (descriptor.fragment?.targets?.length === 0) {
+      descriptor.fragment.targets?.push({});
+    }
+    return descriptor.fragment?.targets;
+  }
+
+  // src/adapter/helpers/get-bind-group.ts
+  var import_core7 = __toESM(require_core(), 1);
+  function getBindGroup(device, bindGroupLayout, shaderLayout, bindings) {
+    const entries = getBindGroupEntries(bindings, shaderLayout);
+    return device.createBindGroup({
+      layout: bindGroupLayout,
+      entries
+    });
+  }
+  function getShaderLayoutBinding(shaderLayout, bindingName) {
+    const bindingLayout = shaderLayout.bindings.find(
+      (binding) => binding.name === bindingName || `${binding.name}uniforms` === bindingName.toLocaleLowerCase()
+    );
+    if (!bindingLayout) {
+      import_core7.log.warn(`Binding ${bindingName} not set: Not found in shader layout.`)();
+    }
+    return bindingLayout;
+  }
+  function getBindGroupEntries(bindings, shaderLayout) {
+    const entries = [];
+    for (const [bindingName, value] of Object.entries(bindings)) {
+      const bindingLayout = getShaderLayoutBinding(shaderLayout, bindingName);
+      if (bindingLayout) {
+        entries.push(getBindGroupEntry(value, bindingLayout.location));
+      }
+    }
+    return entries;
+  }
+  function getBindGroupEntry(binding, index) {
+    if (binding instanceof import_core7.Buffer) {
+      return {
+        binding: index,
+        resource: {
+          buffer: (0, import_core7.cast)(binding).handle
+        }
+      };
+    }
+    if (binding instanceof import_core7.Sampler) {
+      return {
+        binding: index,
+        resource: (0, import_core7.cast)(binding).handle
+      };
+    } else if (binding instanceof import_core7.Texture) {
+      return {
+        binding: index,
+        resource: (0, import_core7.cast)(binding).handle.createView({ label: "bind-group-auto-created" })
+      };
+    }
+    throw new Error("invalid binding");
+  }
+
+  // src/adapter/helpers/get-vertex-buffer-layout.ts
+  var import_core8 = __toESM(require_core(), 1);
+  function getWebGPUVertexFormat(format) {
+    if (format.endsWith("-webgl")) {
+      throw new Error(`WebGPU does not support vertex format ${format}`);
+    }
+    return format;
+  }
+  function getVertexBufferLayout(shaderLayout, bufferLayout) {
+    const vertexBufferLayouts = [];
+    const usedAttributes = /* @__PURE__ */ new Set();
+    for (const mapping of bufferLayout) {
+      const vertexAttributes = [];
+      let stepMode = "vertex";
+      let byteStride = 0;
+      if (mapping.attributes) {
+        for (const attributeMapping of mapping.attributes) {
+          const attributeName = attributeMapping.attribute;
+          const attributeLayout = findAttributeLayout(shaderLayout, attributeName, usedAttributes);
+          stepMode = attributeLayout.stepMode || (attributeLayout.name.startsWith("instance") ? "instance" : "vertex");
+          vertexAttributes.push({
+            format: getWebGPUVertexFormat(attributeMapping.format || mapping.format),
+            offset: attributeMapping.byteOffset,
+            shaderLocation: attributeLayout.location
+          });
+          byteStride += (0, import_core8.decodeVertexFormat)(mapping.format).byteLength;
+        }
+      } else {
+        const attributeLayout = findAttributeLayout(shaderLayout, mapping.name, usedAttributes);
+        if (!attributeLayout) {
+          continue;
+        }
+        byteStride = (0, import_core8.decodeVertexFormat)(mapping.format).byteLength;
+        stepMode = attributeLayout.stepMode || (attributeLayout.name.startsWith("instance") ? "instance" : "vertex");
+        vertexAttributes.push({
+          format: getWebGPUVertexFormat(mapping.format),
+          // We only support 0 offset for non-interleaved buffer layouts
+          offset: 0,
+          shaderLocation: attributeLayout.location
+        });
+      }
+      vertexBufferLayouts.push({
+        arrayStride: mapping.byteStride || byteStride,
+        stepMode,
+        attributes: vertexAttributes
+      });
+    }
+    for (const attribute of shaderLayout.attributes) {
+      if (!usedAttributes.has(attribute.name)) {
+        vertexBufferLayouts.push({
+          arrayStride: (0, import_core8.decodeVertexFormat)("float32x3").byteLength,
+          stepMode: attribute.stepMode || (attribute.name.startsWith("instance") ? "instance" : "vertex"),
+          attributes: [
+            {
+              format: getWebGPUVertexFormat("float32x3"),
+              offset: 0,
+              shaderLocation: attribute.location
+            }
+          ]
+        });
+      }
+    }
+    return vertexBufferLayouts;
+  }
+  function findAttributeLayout(shaderLayout, name, attributeNames) {
+    const attribute = shaderLayout.attributes.find((attribute2) => attribute2.name === name);
+    if (!attribute) {
+      import_core8.log.warn(`Unknown attribute ${name}`)();
+      return null;
+    }
+    if (attributeNames.has(name)) {
+      throw new Error(`Duplicate attribute ${name}`);
+    }
+    attributeNames.add(name);
+    return attribute;
+  }
+
+  // src/adapter/resources/webgpu-render-pipeline.ts
+  var WebGPURenderPipeline = class extends import_core9.RenderPipeline {
+    device;
+    handle;
+    vs;
+    fs = null;
+    /** For internal use to create BindGroups */
+    _bindings;
+    _bindGroupLayout = null;
+    _bindGroup = null;
+    constructor(device, props) {
+      super(device, props);
+      this.device = device;
+      this.handle = this.props.handle;
+      if (!this.handle) {
+        const descriptor = this._getRenderPipelineDescriptor();
+        import_core9.log.groupCollapsed(1, `new WebGPURenderPipeline(${this.id})`)();
+        import_core9.log.probe(1, JSON.stringify(descriptor, null, 2))();
+        import_core9.log.groupEnd(1)();
+        this.handle = this.device.handle.createRenderPipeline(descriptor);
+      }
+      this.handle.label = this.props.id;
+      this.vs = (0, import_core9.cast)(props.vs);
+      this.fs = (0, import_core9.cast)(props.fs);
+      this._bindings = { ...this.props.bindings };
+    }
+    destroy() {
+      this.handle = null;
+    }
+    /**
+     * @todo Use renderpass.setBindings() ?
+     * @todo Do we want to expose BindGroups in the API and remove this?
+     */
+    setBindings(bindings) {
+      Object.assign(this._bindings, bindings);
+    }
+    /** @todo - should this be moved to renderpass? */
+    draw(options) {
+      const webgpuRenderPass = options.renderPass;
+      webgpuRenderPass.handle.setPipeline(this.handle);
+      const bindGroup = this._getBindGroup();
+      if (bindGroup) {
+        webgpuRenderPass.handle.setBindGroup(0, bindGroup);
+      }
+      options.vertexArray.bindBeforeRender(options.renderPass);
+      if (options.indexCount) {
+        webgpuRenderPass.handle.drawIndexed(
+          options.indexCount,
+          options.instanceCount,
+          options.firstIndex,
+          options.baseVertex,
+          options.firstInstance
+        );
+      } else {
+        webgpuRenderPass.handle.draw(
+          options.vertexCount || 0,
+          options.instanceCount || 1,
+          // If 0, nothing will be drawn
+          options.firstInstance
+        );
+      }
+      options.vertexArray.unbindAfterRender(options.renderPass);
+      return true;
+    }
+    /** Return a bind group created by setBindings */
+    _getBindGroup() {
+      if (this.props.shaderLayout.bindings.length === 0) {
+        return null;
+      }
+      this._bindGroupLayout = this._bindGroupLayout || this.handle.getBindGroupLayout(0);
+      this._bindGroup = this._bindGroup || getBindGroup(
+        this.device.handle,
+        this._bindGroupLayout,
+        this.props.shaderLayout,
+        this._bindings
+      );
+      return this._bindGroup;
+    }
+    /**
+     * Populate the complex WebGPU GPURenderPipelineDescriptor
+     */
+    _getRenderPipelineDescriptor() {
+      const vertex = {
+        module: (0, import_core9.cast)(this.props.vs).handle,
+        entryPoint: this.props.vertexEntryPoint || "main",
+        buffers: getVertexBufferLayout(this.props.shaderLayout, this.props.bufferLayout)
+      };
+      const fragment = {
+        module: (0, import_core9.cast)(this.props.fs).handle,
+        entryPoint: this.props.fragmentEntryPoint || "main",
+        targets: [
+          {
+            // TODO exclamation mark hack!
+            format: getWebGPUTextureFormat(this.device?.canvasContext?.format)
+          }
+        ]
+      };
+      switch (this.props.topology) {
+        case "triangle-fan-webgl":
+        case "line-loop-webgl":
+          throw new Error(`WebGPU does not support primitive topology ${this.props.topology}`);
+        default:
+      }
+      const descriptor = {
+        vertex,
+        fragment,
+        primitive: {
+          topology: this.props.topology
+        },
+        layout: "auto"
+      };
+      applyParametersToRenderPipelineDescriptor(descriptor, this.props.parameters);
+      return descriptor;
+    }
+  };
+
+  // src/adapter/resources/webgpu-framebuffer.ts
+  var import_core10 = __toESM(require_core(), 1);
+  var WebGPUFramebuffer = class extends import_core10.Framebuffer {
+    device;
+    constructor(device, props) {
+      super(device, props);
+      this.device = device;
+      this.autoCreateAttachmentTextures();
+    }
+  };
+
+  // src/adapter/resources/webgpu-compute-pipeline.ts
+  var import_core11 = __toESM(require_core(), 1);
+  var WebGPUComputePipeline = class extends import_core11.ComputePipeline {
+    device;
+    handle;
+    /** For internal use to create BindGroups */
+    _bindGroupLayout = null;
+    _bindGroup = null;
+    /** For internal use to create BindGroups */
+    _bindings = {};
+    constructor(device, props) {
+      super(device, props);
+      this.device = device;
+      const webgpuShader = this.props.shader;
+      this.handle = this.props.handle || this.device.handle.createComputePipeline({
+        label: this.props.id,
+        compute: {
+          module: webgpuShader.handle,
+          entryPoint: this.props.entryPoint,
+          constants: this.props.constants
+        },
+        layout: "auto"
+      });
+    }
+    /**
+     * @todo Use renderpass.setBindings() ?
+     * @todo Do we want to expose BindGroups in the API and remove this?
+     */
+    setBindings(bindings) {
+      Object.assign(this._bindings, bindings);
+    }
+    /** Return a bind group created by setBindings */
+    _getBindGroup() {
+      this._bindGroupLayout = this._bindGroupLayout || this.handle.getBindGroupLayout(0);
+      this._bindGroup = this._bindGroup || getBindGroup(
+        this.device.handle,
+        this._bindGroupLayout,
+        this.props.shaderLayout,
+        this._bindings
+      );
+      return this._bindGroup;
+    }
+  };
+
+  // src/adapter/resources/webgpu-render-pass.ts
+  var import_core12 = __toESM(require_core(), 1);
+  var WebGPURenderPass = class extends import_core12.RenderPass {
+    device;
+    handle;
+    /** Active pipeline */
+    pipeline = null;
+    constructor(device, props = {}) {
+      super(device, props);
+      this.device = device;
+      const framebuffer = props.framebuffer || device.canvasContext.getCurrentFramebuffer();
+      const renderPassDescriptor = this.getRenderPassDescriptor(framebuffer);
+      const webgpuQuerySet = props.timestampQuerySet;
+      if (webgpuQuerySet) {
+        renderPassDescriptor.occlusionQuerySet = webgpuQuerySet.handle;
+      }
+      if (device.features.has("timestamp-query")) {
+        const webgpuQuerySet2 = props.timestampQuerySet;
+        renderPassDescriptor.timestampWrites = webgpuQuerySet2 ? {
+          querySet: webgpuQuerySet2.handle,
+          beginningOfPassWriteIndex: props.beginTimestampIndex,
+          endOfPassWriteIndex: props.endTimestampIndex
+        } : void 0;
+      }
+      this.handle = this.props.handle || device.commandEncoder.beginRenderPass(renderPassDescriptor);
+      this.handle.label = this.props.id;
+      import_core12.log.groupCollapsed(3, `new WebGPURenderPass(${this.id})`)();
+      import_core12.log.probe(3, JSON.stringify(renderPassDescriptor, null, 2))();
+      import_core12.log.groupEnd(3)();
+    }
+    destroy() {
+    }
+    end() {
+      this.handle.end();
+    }
+    setPipeline(pipeline) {
+      this.pipeline = (0, import_core12.cast)(pipeline);
+      this.handle.setPipeline(this.pipeline.handle);
+    }
+    /** Sets an array of bindings (uniform buffers, samplers, textures, ...) */
+    setBindings(bindings) {
+      this.pipeline?.setBindings(bindings);
+      const bindGroup = this.pipeline?._getBindGroup();
+      if (bindGroup) {
+        this.handle.setBindGroup(0, bindGroup);
+      }
+    }
+    setIndexBuffer(buffer, indexFormat, offset = 0, size) {
+      this.handle.setIndexBuffer((0, import_core12.cast)(buffer).handle, indexFormat, offset, size);
+    }
+    setVertexBuffer(slot, buffer, offset = 0) {
+      this.handle.setVertexBuffer(slot, (0, import_core12.cast)(buffer).handle, offset);
+    }
+    draw(options) {
+      if (options.indexCount) {
+        this.handle.drawIndexed(
+          options.indexCount,
+          options.instanceCount,
+          options.firstIndex,
+          options.baseVertex,
+          options.firstInstance
+        );
+      } else {
+        this.handle.draw(
+          options.vertexCount || 0,
+          options.instanceCount || 1,
+          options.firstIndex,
+          options.firstInstance
+        );
+      }
+    }
+    drawIndirect() {
+    }
+    setParameters(parameters) {
+      const { blendConstant, stencilReference, scissorRect, viewport } = parameters;
+      if (blendConstant) {
+        this.handle.setBlendConstant(blendConstant);
+      }
+      if (stencilReference) {
+        this.handle.setStencilReference(stencilReference);
+      }
+      if (scissorRect) {
+        this.handle.setScissorRect(scissorRect[0], scissorRect[1], scissorRect[2], scissorRect[3]);
+      }
+      if (viewport) {
+        this.handle.setViewport(
+          viewport[0],
+          viewport[1],
+          viewport[2],
+          viewport[3],
+          viewport[4],
+          viewport[5]
+        );
+      }
+    }
+    pushDebugGroup(groupLabel) {
+      this.handle.pushDebugGroup(groupLabel);
+    }
+    popDebugGroup() {
+      this.handle.popDebugGroup();
+    }
+    insertDebugMarker(markerLabel) {
+      this.handle.insertDebugMarker(markerLabel);
+    }
+    beginOcclusionQuery(queryIndex) {
+      this.handle.beginOcclusionQuery(queryIndex);
+    }
+    endOcclusionQuery() {
+      this.handle.endOcclusionQuery();
+    }
+    // executeBundles(bundles: Iterable<GPURenderBundle>): void;
+    // INTERNAL
+    /**
+     * Partial render pass descriptor. Used by WebGPURenderPass.
+     * @returns attachments fields of a renderpass descriptor.
+     */
+    getRenderPassDescriptor(framebuffer) {
+      const renderPassDescriptor = {
+        colorAttachments: []
+      };
+      renderPassDescriptor.colorAttachments = framebuffer.colorAttachments.map((colorAttachment) => ({
+        // clear values
+        loadOp: this.props.clearColor !== false ? "clear" : "load",
+        colorClearValue: this.props.clearColor || [0, 0, 0, 0],
+        storeOp: this.props.discard ? "discard" : "store",
+        // ...colorAttachment,
+        view: colorAttachment.handle
+      }));
+      if (framebuffer.depthStencilAttachment) {
+        renderPassDescriptor.depthStencilAttachment = {
+          view: framebuffer.depthStencilAttachment.handle
+        };
+        const { depthStencilAttachment } = renderPassDescriptor;
+        if (this.props.depthReadOnly) {
+          depthStencilAttachment.depthReadOnly = true;
+        }
+        depthStencilAttachment.depthClearValue = this.props.clearDepth || 0;
+        const hasDepthAspect = true;
+        if (hasDepthAspect) {
+          depthStencilAttachment.depthLoadOp = this.props.clearDepth !== false ? "clear" : "load";
+          depthStencilAttachment.depthStoreOp = "store";
+        }
+        const hasStencilAspect = false;
+        if (hasStencilAspect) {
+          depthStencilAttachment.stencilLoadOp = this.props.clearStencil !== false ? "clear" : "load";
+          depthStencilAttachment.stencilStoreOp = "store";
+        }
+      }
+      return renderPassDescriptor;
+    }
+  };
+
+  // src/adapter/resources/webgpu-compute-pass.ts
+  var import_core13 = __toESM(require_core(), 1);
+  var WebGPUComputePass = class extends import_core13.ComputePass {
+    device;
+    handle;
+    _webgpuPipeline = null;
+    constructor(device, props) {
+      super(device, props);
+      this.device = device;
+      let timestampWrites;
+      if (device.features.has("timestamp-query")) {
+        const webgpuQuerySet = props.timestampQuerySet;
+        if (webgpuQuerySet) {
+          timestampWrites = {
+            querySet: webgpuQuerySet.handle,
+            beginningOfPassWriteIndex: props.beginTimestampIndex,
+            endOfPassWriteIndex: props.endTimestampIndex
+          };
+        }
+      }
+      this.handle = this.props.handle || device.commandEncoder?.beginComputePass({
+        label: this.props.id,
+        timestampWrites
+      });
+    }
+    /** @note no WebGPU destroy method, just gc */
+    destroy() {
+    }
+    end() {
+      this.handle.end();
+    }
+    setPipeline(pipeline) {
+      const wgpuPipeline = pipeline;
+      this.handle.setPipeline(wgpuPipeline.handle);
+      this._webgpuPipeline = wgpuPipeline;
+      this.setBindings([]);
+    }
+    /**
+     * Sets an array of bindings (uniform buffers, samplers, textures, ...)
+     * TODO - still some API confusion - does this method go here or on the pipeline?
+     */
+    setBindings(bindings) {
+      const bindGroup = this._webgpuPipeline._getBindGroup();
+      this.handle.setBindGroup(0, bindGroup);
+    }
+    /**
+     * Dispatch work to be performed with the current ComputePipeline.
+     * @param x X dimension of the grid of work groups to dispatch.
+     * @param y Y dimension of the grid of work groups to dispatch.
+     * @param z Z dimension of the grid of work groups to dispatch.
+     */
+    dispatch(x, y, z) {
+      this.handle.dispatchWorkgroups(x, y, z);
+    }
+    /**
+     * Dispatch work to be performed with the current ComputePipeline.
+     *
+     * Buffer must be a tightly packed block of three 32-bit unsigned integer values (12 bytes total), given in the same order as the arguments for dispatch()
+     * @param indirectBuffer
+     * @param indirectOffset offset in buffer to the beginning of the dispatch data.
+     */
+    dispatchIndirect(indirectBuffer, indirectByteOffset = 0) {
+      const webgpuBuffer = indirectBuffer;
+      this.handle.dispatchWorkgroupsIndirect(webgpuBuffer.handle, indirectByteOffset);
+    }
+    pushDebugGroup(groupLabel) {
+      this.handle.pushDebugGroup(groupLabel);
+    }
+    popDebugGroup() {
+      this.handle.popDebugGroup();
+    }
+    insertDebugMarker(markerLabel) {
+      this.handle.insertDebugMarker(markerLabel);
+    }
+  };
+
+  // src/adapter/resources/webgpu-vertex-array.ts
+  var import_core14 = __toESM(require_core(), 1);
+
+  // ../../node_modules/@probe.gl/env/dist/lib/is-electron.js
+  function isElectron(mockUserAgent) {
+    if (typeof window !== "undefined" && typeof window.process === "object" && // @ts-expect-error
+    window.process.type === "renderer") {
+      return true;
+    }
+    if (typeof process !== "undefined" && typeof process.versions === "object" && // eslint-disable-next-line
+    Boolean(process.versions["electron"])) {
+      return true;
+    }
+    const realUserAgent = typeof navigator === "object" && typeof navigator.userAgent === "string" && navigator.userAgent;
+    const userAgent = mockUserAgent || realUserAgent;
+    if (userAgent && userAgent.indexOf("Electron") >= 0) {
+      return true;
+    }
+    return false;
+  }
+
+  // ../../node_modules/@probe.gl/env/dist/lib/is-browser.js
+  function isBrowser() {
+    const isNode = (
+      // @ts-expect-error
+      typeof process === "object" && String(process) === "[object process]" && !process.browser
+    );
+    return !isNode || isElectron();
+  }
+
+  // ../../node_modules/@probe.gl/env/dist/lib/globals.js
+  var self_ = globalThis.self || globalThis.window || globalThis.global;
+  var window_ = globalThis.window || globalThis.self || globalThis.global;
+  var document_ = globalThis.document || {};
+  var process_ = globalThis.process || {};
+  var console_ = globalThis.console;
+  var navigator_ = globalThis.navigator || {};
+
+  // ../../node_modules/@probe.gl/env/dist/lib/get-browser.js
+  var window2 = globalThis;
+  function getBrowser(mockUserAgent) {
+    if (!mockUserAgent && !isBrowser()) {
+      return "Node";
+    }
+    if (isElectron(mockUserAgent)) {
+      return "Electron";
+    }
+    const userAgent = mockUserAgent || navigator_.userAgent || "";
+    if (userAgent.indexOf("Edge") > -1) {
+      return "Edge";
+    }
+    const isMSIE = userAgent.indexOf("MSIE ") !== -1;
+    const isTrident = userAgent.indexOf("Trident/") !== -1;
+    if (isMSIE || isTrident) {
+      return "IE";
+    }
+    if (window2.chrome) {
+      return "Chrome";
+    }
+    if (window2.safari) {
+      return "Safari";
+    }
+    if (window2.mozInnerScreenX) {
+      return "Firefox";
+    }
+    return "Unknown";
+  }
+
+  // src/adapter/resources/webgpu-vertex-array.ts
+  var WebGPUVertexArray = class extends import_core14.VertexArray {
+    get [Symbol.toStringTag]() {
+      return "WebGPUVertexArray";
+    }
+    device;
+    /** Vertex Array is a helper class under WebGPU */
+    handle;
+    // Create a VertexArray
+    constructor(device, props) {
+      super(device, props);
+      this.device = device;
+    }
+    destroy() {
+    }
+    /**
+     * Set an elements buffer, for indexed rendering.
+     * Must be a Buffer bound to buffer with usage bit Buffer.INDEX set.
+     */
+    setIndexBuffer(buffer) {
+      this.indexBuffer = buffer;
+    }
+    /** Set a bufferSlot in vertex attributes array to a buffer, enables the bufferSlot, sets divisor */
+    setBuffer(bufferSlot, buffer) {
+      this.attributes[bufferSlot] = buffer;
+    }
+    bindBeforeRender(renderPass, firstIndex, indexCount) {
+      const webgpuRenderPass = renderPass;
+      const webgpuIndexBuffer = this.indexBuffer;
+      if (webgpuIndexBuffer?.handle) {
+        import_core14.log.warn("setting index buffer", webgpuIndexBuffer?.handle, webgpuIndexBuffer?.indexType)();
+        webgpuRenderPass.handle.setIndexBuffer(
+          webgpuIndexBuffer?.handle,
+          webgpuIndexBuffer?.indexType
+        );
+      }
+      for (let location = 0; location < this.maxVertexAttributes; location++) {
+        const webgpuBuffer = this.attributes[location];
+        if (webgpuBuffer?.handle) {
+          import_core14.log.warn(`setting vertex buffer ${location}`, webgpuBuffer?.handle)();
+          webgpuRenderPass.handle.setVertexBuffer(location, webgpuBuffer?.handle);
+        }
+      }
+    }
+    unbindAfterRender(renderPass) {
+    }
+    // DEPRECATED METHODS
+    /**
+     * @deprecated is this even an issue for WebGPU?
+     * Attribute 0 can not be disable on most desktop OpenGL based browsers
+     */
+    static isConstantAttributeZeroSupported(device) {
+      return getBrowser() === "Chrome";
+    }
+  };
+
+  // src/adapter/webgpu-canvas-context.ts
+  var import_core15 = __toESM(require_core(), 1);
+  var WebGPUCanvasContext = class extends import_core15.CanvasContext {
+    device;
+    gpuCanvasContext;
+    /** Format of returned textures: "bgra8unorm", "rgba8unorm", "rgba16float". */
+    format = navigator.gpu.getPreferredCanvasFormat();
+    /** Default stencil format for depth textures */
+    depthStencilFormat = "depth24plus";
+    depthStencilAttachment = null;
+    constructor(device, adapter, props) {
+      super(props);
+      this.device = device;
+      this.width = -1;
+      this.height = -1;
+      this._setAutoCreatedCanvasId(`${this.device.id}-canvas`);
+      this.gpuCanvasContext = this.canvas.getContext("webgpu");
+      this.format = "bgra8unorm";
+    }
+    /** Destroy any textures produced while configured and remove the context configuration. */
+    destroy() {
+      this.gpuCanvasContext.unconfigure();
+    }
+    /** Update framebuffer with properly resized "swap chain" texture views */
+    getCurrentFramebuffer() {
+      this.update();
+      const currentColorAttachment = this.getCurrentTexture();
+      this.width = currentColorAttachment.width;
+      this.height = currentColorAttachment.height;
+      this._createDepthStencilAttachment();
+      return new WebGPUFramebuffer(this.device, {
+        colorAttachments: [currentColorAttachment],
+        depthStencilAttachment: this.depthStencilAttachment
+      });
+    }
+    /** Resizes and updates render targets if necessary */
+    update() {
+      const [width, height] = this.getPixelSize();
+      const sizeChanged = width !== this.width || height !== this.height;
+      if (sizeChanged) {
+        this.width = width;
+        this.height = height;
+        if (this.depthStencilAttachment) {
+          this.depthStencilAttachment.destroy();
+          this.depthStencilAttachment = null;
+        }
+        this.gpuCanvasContext.configure({
+          device: this.device.handle,
+          format: getWebGPUTextureFormat(this.format),
+          // Can be used to define e.g. -srgb views
+          // viewFormats: [...]
+          colorSpace: this.props.colorSpace,
+          alphaMode: this.props.alphaMode
+        });
+        import_core15.log.log(1, `Resized to ${this.width}x${this.height}px`)();
+      }
+    }
+    resize(options) {
+      this.update();
+    }
+    /** Wrap the current canvas context texture in a luma.gl texture */
+    getCurrentTexture() {
+      return this.device._createTexture({
+        id: `${this.id}#color-texture`,
+        handle: this.gpuCanvasContext.getCurrentTexture(),
+        format: this.format
+      });
+    }
+    /** We build render targets on demand (i.e. not when size changes but when about to render) */
+    _createDepthStencilAttachment() {
+      if (!this.depthStencilAttachment) {
+        this.depthStencilAttachment = this.device.createTexture({
+          id: `${this.id}#depth-stencil-texture`,
+          format: this.depthStencilFormat,
+          width: this.width,
+          height: this.height,
+          usage: GPUTextureUsage.RENDER_ATTACHMENT
+        });
+      }
+      return this.depthStencilAttachment;
+    }
+  };
+
+  // src/adapter/resources/webgpu-query-set.ts
+  var import_core16 = __toESM(require_core(), 1);
+  var WebGPUQuerySet = class extends import_core16.QuerySet {
+    device;
+    handle;
+    constructor(device, props) {
+      super(device, props);
+      this.device = device;
+      this.handle = this.props.handle || this.device.handle.createQuerySet({
+        type: this.props.type,
+        count: this.props.count
+      });
+      this.handle.label = this.props.id;
+    }
+    destroy() {
+      this.handle?.destroy();
+      this.handle = null;
+    }
+  };
+
+  // src/adapter/webgpu-device.ts
+  var _WebGPUDevice = class extends import_core17.Device {
+    /** type of this device */
+    type = "webgpu";
+    /** The underlying WebGPU device */
+    handle;
+    /* The underlying WebGPU adapter */
+    adapter;
+    /* The underlying WebGPU adapter's info */
+    adapterInfo;
+    features;
+    info;
+    limits;
+    lost;
+    canvasContext = null;
+    _isLost = false;
+    commandEncoder = null;
+    renderPass = null;
+    /** Check if WebGPU is available */
+    static isSupported() {
+      return Boolean(typeof navigator !== "undefined" && navigator.gpu);
+    }
+    static async create(props) {
+      if (!navigator.gpu) {
+        throw new Error(
+          "WebGPU not available. Open in Chrome Canary and turn on chrome://flags/#enable-unsafe-webgpu"
+        );
+      }
+      import_core17.log.groupCollapsed(1, "WebGPUDevice created")();
+      const adapter = await navigator.gpu.requestAdapter({
+        powerPreference: "high-performance"
+        // forceSoftware: false
+      });
+      if (!adapter) {
+        throw new Error("Failed to request WebGPU adapter");
+      }
+      const adapterInfo = await adapter.requestAdapterInfo();
+      import_core17.log.probe(2, "Adapter available", adapterInfo)();
+      const requiredFeatures = [];
+      const requiredLimits = {};
+      if (props.requestMaxLimits) {
+        requiredFeatures.push(...Array.from(adapter.features));
+        for (const key in adapter.limits) {
+          requiredLimits[key] = adapter.limits[key];
+        }
+        delete requiredLimits.minSubgroupSize;
+        delete requiredLimits.maxSubgroupSize;
+      }
+      const gpuDevice = await adapter.requestDevice({
+        requiredFeatures,
+        requiredLimits
+      });
+      import_core17.log.probe(1, "GPUDevice available")();
+      if (typeof props.canvas === "string") {
+        await import_core17.CanvasContext.pageLoaded;
+        import_core17.log.probe(1, "DOM is loaded")();
+      }
+      const device = new _WebGPUDevice(gpuDevice, adapter, adapterInfo, props);
+      import_core17.log.probe(
+        1,
+        "Device created. For more info, set chrome://flags/#enable-webgpu-developer-features"
+      )();
+      import_core17.log.table(1, device.info)();
+      import_core17.log.groupEnd(1)();
+      return device;
+    }
+    constructor(device, adapter, adapterInfo, props) {
+      super({ ...props, id: props.id || (0, import_core17.uid)("webgpu-device") });
+      this.handle = device;
+      this.adapter = adapter;
+      this.adapterInfo = adapterInfo;
+      this.info = this._getInfo();
+      this.features = this._getFeatures();
+      this.limits = this.handle.limits;
+      this.lost = new Promise(async (resolve) => {
+        const lostInfo = await this.handle.lost;
+        this._isLost = true;
+        resolve({ reason: "destroyed", message: lostInfo.message });
+      });
+      this.canvasContext = new WebGPUCanvasContext(this, this.adapter, {
+        canvas: props.canvas,
+        height: props.height,
+        width: props.width,
+        container: props.container
+      });
+    }
+    // TODO
+    // Load the glslang module now so that it is available synchronously when compiling shaders
+    // const {glsl = true} = props;
+    // this.glslang = glsl && await loadGlslangModule();
+    destroy() {
+      this.handle.destroy();
+    }
+    isTextureFormatSupported(format) {
+      return !format.includes("webgl");
+    }
+    /** @todo implement proper check? */
+    isTextureFormatFilterable(format) {
+      return this.isTextureFormatSupported(format) && !format.startsWith("depth") && !format.startsWith("stencil");
+    }
+    /** @todo implement proper check? */
+    isTextureFormatRenderable(format) {
+      return this.isTextureFormatSupported(format);
+    }
+    get isLost() {
+      return this._isLost;
+    }
+    createBuffer(props) {
+      const newProps = this._getBufferProps(props);
+      return new WebGPUBuffer(this, newProps);
+    }
+    _createTexture(props) {
+      return new WebGPUTexture(this, props);
+    }
+    createExternalTexture(props) {
+      return new WebGPUExternalTexture(this, props);
+    }
+    createShader(props) {
+      return new WebGPUShader(this, props);
+    }
+    createSampler(props) {
+      return new WebGPUSampler(this, props);
+    }
+    createRenderPipeline(props) {
+      return new WebGPURenderPipeline(this, props);
+    }
+    createFramebuffer(props) {
+      return new WebGPUFramebuffer(this, props);
+    }
+    createComputePipeline(props) {
+      return new WebGPUComputePipeline(this, props);
+    }
+    createVertexArray(props) {
+      return new WebGPUVertexArray(this, props);
+    }
+    // WebGPU specifics
+    /**
+     * Allows a render pass to begin against a canvas context
+     * @todo need to support a "Framebuffer" equivalent (aka preconfigured RenderPassDescriptors?).
+     */
+    beginRenderPass(props) {
+      this.commandEncoder = this.commandEncoder || this.handle.createCommandEncoder();
+      return new WebGPURenderPass(this, props);
+    }
+    beginComputePass(props) {
+      this.commandEncoder = this.commandEncoder || this.handle.createCommandEncoder();
+      return new WebGPUComputePass(this, props);
+    }
+    // createCommandEncoder(props: CommandEncoderProps): WebGPUCommandEncoder {
+    //   return new WebGPUCommandEncoder(this, props);
+    // }
+    createTransformFeedback(props) {
+      throw new Error("Transform feedback not supported in WebGPU");
+    }
+    createQuerySet(props) {
+      return new WebGPUQuerySet(this, props);
+    }
+    createCanvasContext(props) {
+      return new WebGPUCanvasContext(this, this.adapter, props);
+    }
+    submit() {
+      const commandBuffer = this.commandEncoder?.finish();
+      if (commandBuffer) {
+        this.handle.queue.submit([commandBuffer]);
+      }
+      this.commandEncoder = null;
+    }
+    // PRIVATE METHODS
+    _getInfo() {
+      const [driver, driverVersion] = (this.adapterInfo.driver || "").split(" Version ");
+      const vendor = this.adapterInfo.vendor || this.adapter.__brand || "unknown";
+      const renderer = driver || "";
+      const version = driverVersion || "";
+      const gpu = vendor === "apple" ? "apple" : "unknown";
+      const gpuArchitecture = this.adapterInfo.architecture || "unknown";
+      const gpuBackend = this.adapterInfo.backend || "unknown";
+      const gpuType = (this.adapterInfo.type || "").split(" ")[0].toLowerCase() || "unknown";
+      return {
+        type: "webgpu",
+        vendor,
+        renderer,
+        version,
+        gpu,
+        gpuType,
+        gpuBackend,
+        gpuArchitecture,
+        shadingLanguage: "wgsl",
+        shadingLanguageVersion: 100
+      };
+    }
+    _getFeatures() {
+      const features = new Set(this.handle.features);
+      if (features.has("depth-clamping")) {
+        features.delete("depth-clamping");
+        features.add("depth-clip-control");
+      }
+      if (features.has("texture-compression-bc")) {
+        features.add("texture-compression-bc5-webgl");
+      }
+      const WEBGPU_ALWAYS_FEATURES = [
+        "timer-query-webgl",
+        "compilation-status-async-webgl",
+        "float32-renderable-webgl",
+        "float16-renderable-webgl",
+        "norm16-renderable-webgl",
+        "texture-filterable-anisotropic-webgl",
+        "shader-noperspective-interpolation-webgl"
+      ];
+      for (const feature of WEBGPU_ALWAYS_FEATURES) {
+        features.add(feature);
+      }
+      return new import_core17.DeviceFeatures(Array.from(features), this.props.disabledFeatures);
+    }
+    copyExternalImageToTexture(options) {
+      const {
+        source,
+        sourceX = 0,
+        sourceY = 0,
+        texture,
+        mipLevel = 0,
+        aspect = "all",
+        colorSpace = "display-p3",
+        premultipliedAlpha = false,
+        // destinationX,
+        // destinationY,
+        // desitnationZ,
+        width = texture.width,
+        height = texture.height,
+        depth = 1
+      } = options;
+      const webGpuTexture = texture;
+      this.handle?.queue.copyExternalImageToTexture(
+        // source: GPUImageCopyExternalImage
+        {
+          source,
+          origin: [sourceX, sourceY]
+        },
+        // destination: GPUImageCopyTextureTagged
+        {
+          texture: webGpuTexture.handle,
+          origin: [0, 0, 0],
+          // [x, y, z],
+          mipLevel,
+          aspect,
+          colorSpace,
+          premultipliedAlpha
+        },
+        // copySize: GPUExtent3D
+        [width, height, depth]
+      );
+    }
+  };
+  var WebGPUDevice = _WebGPUDevice;
+  __publicField(WebGPUDevice, "type", "webgpu");
+  return __toCommonJS(bundle_exports);
+})();
+      return __exports__;
+      });