@vivi2d/web 0.1.0-alpha.0

package/dist/WebGPURenderer-xmqgPtcF.js

@@ -0,0 +1,1632 @@
+import { x as E, i as l, al as ae, D as P, S as T, e as S, c as ue, d as ce, a as L, a1 as U, ao as C, C as y, f as de, J as he, V as A, M as D, v as k, T as w, A as pe, u as le, a6 as B, q as fe } from "./index-CW8mx7yF.js";
+import { g as F } from "./getTextureBatchBindGroup-BYhXfZM4.js";
+import { G as O, j as ge, b as me, i as I, f as _e, r as H, k as be, c as ye, S as xe } from "./RenderTargetSystem-BCowAg_f.js";
+import { G as Ge, e as Pe, b as Be, l as Se, t as Te } from "./GpuStencilModesToPixi-c2lsBIrd.js";
+import { C as M } from "./CanvasPool-CASccukD.js";
+const G = E.for2d();
+class W {
+  start(e, t, r) {
+    const s = e.renderer, i = s.encoder, n = r.gpuProgram;
+    this._shader = r, this._geometry = t, i.setGeometry(t, n), G.blendMode = "normal", s.pipeline.getPipeline(
+      t,
+      n,
+      G
+    );
+    const o = s.globalUniforms.bindGroup;
+    i.resetBindGroup(1), i.setBindGroup(0, o, n);
+  }
+  execute(e, t) {
+    const r = this._shader.gpuProgram, s = e.renderer, i = s.encoder;
+    if (!t.bindGroup) {
+      const u = t.textures;
+      t.bindGroup = F(
+        u.textures,
+        u.count,
+        s.limits.maxBatchableTextures
+      );
+    }
+    G.blendMode = t.blendMode;
+    const n = s.bindGroup.getBindGroup(
+      t.bindGroup,
+      r,
+      1
+    ), o = s.pipeline.getPipeline(
+      this._geometry,
+      r,
+      G,
+      t.topology
+    );
+    t.bindGroup._touch(s.gc.now, s.tick), i.setPipeline(o), i.renderPassEncoder.setBindGroup(1, n), i.renderPassEncoder.drawIndexed(t.size, 1, t.start);
+  }
+}
+W.extension = {
+  type: [
+    l.WebGPUPipesAdaptor
+  ],
+  name: "batch"
+};
+class V {
+  constructor(e) {
+    this._hash = /* @__PURE__ */ Object.create(null), this._renderer = e;
+  }
+  contextChange(e) {
+    this._gpu = e;
+  }
+  getBindGroup(e, t, r) {
+    return e._updateKey(), this._hash[e._key] || this._createBindGroup(e, t, r);
+  }
+  _createBindGroup(e, t, r) {
+    const s = this._gpu.device, i = t.layout[r], n = [], o = this._renderer;
+    for (const f in i) {
+      const h = e.resources[f] ?? e.resources[i[f]];
+      let p;
+      if (h._resourceType === "uniformGroup") {
+        const d = h;
+        o.ubo.updateUniformGroup(d);
+        const g = d.buffer;
+        p = {
+          buffer: o.buffer.getGPUBuffer(g),
+          offset: 0,
+          size: g.descriptor.size
+        };
+      } else if (h._resourceType === "buffer") {
+        const d = h;
+        p = {
+          buffer: o.buffer.getGPUBuffer(d),
+          offset: 0,
+          size: d.descriptor.size
+        };
+      } else if (h._resourceType === "bufferResource") {
+        const d = h;
+        p = {
+          buffer: o.buffer.getGPUBuffer(d.buffer),
+          offset: d.offset,
+          size: d.size
+        };
+      } else if (h._resourceType === "textureSampler") {
+        const d = h;
+        p = o.texture.getGpuSampler(d);
+      } else if (h._resourceType === "textureSource") {
+        const d = h;
+        p = o.texture.getTextureView(d);
+      }
+      n.push({
+        binding: i[f],
+        resource: p
+      });
+    }
+    const u = o.shader.getProgramData(t).bindGroups[r], c = s.createBindGroup({
+      layout: u,
+      entries: n
+    });
+    return this._hash[e._key] = c, c;
+  }
+  destroy() {
+    this._hash = null, this._renderer = null;
+  }
+}
+V.extension = {
+  type: [
+    l.WebGPUSystem
+  ],
+  name: "bindGroup"
+};
+class Ce {
+  constructor(e) {
+    this.gpuBuffer = e;
+  }
+  destroy() {
+    this.gpuBuffer.destroy(), this.gpuBuffer = null;
+  }
+}
+class N {
+  constructor(e) {
+    this._renderer = e, this._managedBuffers = new O({
+      renderer: e,
+      type: "resource",
+      onUnload: this.onBufferUnload.bind(this),
+      name: "gpuBuffer"
+    });
+  }
+  contextChange(e) {
+    this._gpu = e;
+  }
+  getGPUBuffer(e) {
+    var t;
+    return e._gcLastUsed = this._renderer.gc.now, ((t = e._gpuData[this._renderer.uid]) == null ? void 0 : t.gpuBuffer) || this.createGPUBuffer(e);
+  }
+  updateBuffer(e) {
+    const t = this.getGPUBuffer(e), r = e.data;
+    return e._updateID && r && (e._updateID = 0, this._gpu.device.queue.writeBuffer(
+      t,
+      0,
+      r.buffer,
+      0,
+      // round to the nearest 4 bytes
+      (e._updateSize || r.byteLength) + 3 & -4
+    )), t;
+  }
+  /** dispose all WebGL resources of all managed buffers */
+  destroyAll() {
+    this._managedBuffers.removeAll();
+  }
+  onBufferUnload(e) {
+    e.off("update", this.updateBuffer, this), e.off("change", this.onBufferChange, this);
+  }
+  createGPUBuffer(e) {
+    const t = this._gpu.device.createBuffer(e.descriptor);
+    return e._updateID = 0, e._resourceId = ae("resource"), e.data && (ge(
+      e.data.buffer,
+      t.getMappedRange(),
+      e.data.byteOffset,
+      e.data.byteLength
+    ), t.unmap()), e._gpuData[this._renderer.uid] = new Ce(t), this._managedBuffers.add(e) && (e.on("update", this.updateBuffer, this), e.on("change", this.onBufferChange, this)), t;
+  }
+  onBufferChange(e) {
+    this._managedBuffers.remove(e), e._updateID = 0, this.createGPUBuffer(e);
+  }
+  destroy() {
+    this._managedBuffers.destroy(), this._renderer = null, this._gpu = null;
+  }
+}
+N.extension = {
+  type: [
+    l.WebGPUSystem
+  ],
+  name: "buffer"
+};
+class ve {
+  constructor({ minUniformOffsetAlignment: e }) {
+    this._minUniformOffsetAlignment = 256, this.byteIndex = 0, this._minUniformOffsetAlignment = e, this.data = new Float32Array(65535);
+  }
+  clear() {
+    this.byteIndex = 0;
+  }
+  addEmptyGroup(e) {
+    if (e > this._minUniformOffsetAlignment / 4)
+      throw new Error(`UniformBufferBatch: array is too large: ${e * 4}`);
+    const t = this.byteIndex;
+    let r = t + e * 4;
+    if (r = Math.ceil(r / this._minUniformOffsetAlignment) * this._minUniformOffsetAlignment, r > this.data.length * 4)
+      throw new Error("UniformBufferBatch: ubo batch got too big");
+    return this.byteIndex = r, t;
+  }
+  addGroup(e) {
+    const t = this.addEmptyGroup(e.length);
+    for (let r = 0; r < e.length; r++)
+      this.data[t / 4 + r] = e[r];
+    return t;
+  }
+  destroy() {
+    this.data = null;
+  }
+}
+class z {
+  constructor(e) {
+    this._colorMaskCache = 15, this._renderer = e;
+  }
+  setMask(e) {
+    this._colorMaskCache !== e && (this._colorMaskCache = e, this._renderer.pipeline.setColorMask(e));
+  }
+  destroy() {
+    this._renderer = null, this._colorMaskCache = null;
+  }
+}
+z.extension = {
+  type: [
+    l.WebGPUSystem
+  ],
+  name: "colorMask"
+};
+class v {
+  /**
+   * @param {WebGPURenderer} renderer - The renderer this System works for.
+   */
+  constructor(e) {
+    this._renderer = e;
+  }
+  async init(e) {
+    return this._initPromise ? this._initPromise : (this._initPromise = (e.gpu ? Promise.resolve(e.gpu) : this._createDeviceAndAdaptor(e)).then((t) => {
+      this.gpu = t, this._renderer.runners.contextChange.emit(this.gpu);
+    }), this._initPromise);
+  }
+  /**
+   * Handle the context change event
+   * @param gpu
+   */
+  contextChange(e) {
+    this._renderer.gpu = e;
+  }
+  /**
+   * Helper class to create a WebGL Context
+   * @param {object} options - An options object that gets passed in to the canvas element containing the
+   *    context attributes
+   * @see https://developer.mozilla.org/en/docs/Web/API/HTMLCanvasElement/getContext
+   * @returns {WebGLRenderingContext} the WebGL context
+   */
+  async _createDeviceAndAdaptor(e) {
+    const t = await P.get().getNavigator().gpu.requestAdapter({
+      powerPreference: e.powerPreference,
+      forceFallbackAdapter: e.forceFallbackAdapter
+    }), r = [
+      "texture-compression-bc",
+      "texture-compression-astc",
+      "texture-compression-etc2"
+    ].filter((i) => t.features.has(i)), s = await t.requestDevice({
+      requiredFeatures: r
+    });
+    return { adapter: t, device: s };
+  }
+  destroy() {
+    this.gpu = null, this._renderer = null;
+  }
+}
+v.extension = {
+  type: [
+    l.WebGPUSystem
+  ],
+  name: "device"
+};
+v.defaultOptions = {
+  /**
+   * {@link WebGPUOptions.powerPreference}
+   * @default default
+   */
+  powerPreference: void 0,
+  /**
+   * Force the use of the fallback adapter
+   * @default false
+   */
+  forceFallbackAdapter: !1
+};
+class j {
+  constructor(e) {
+    this._boundBindGroup = /* @__PURE__ */ Object.create(null), this._boundVertexBuffer = /* @__PURE__ */ Object.create(null), this._renderer = e;
+  }
+  renderStart() {
+    this.commandFinished = new Promise((e) => {
+      this._resolveCommandFinished = e;
+    }), this.commandEncoder = this._renderer.gpu.device.createCommandEncoder();
+  }
+  beginRenderPass(e) {
+    this.endRenderPass(), this._clearCache(), this.renderPassEncoder = this.commandEncoder.beginRenderPass(e.descriptor);
+  }
+  endRenderPass() {
+    this.renderPassEncoder && this.renderPassEncoder.end(), this.renderPassEncoder = null;
+  }
+  setViewport(e) {
+    this.renderPassEncoder.setViewport(e.x, e.y, e.width, e.height, 0, 1);
+  }
+  setPipelineFromGeometryProgramAndState(e, t, r, s) {
+    const i = this._renderer.pipeline.getPipeline(e, t, r, s);
+    this.setPipeline(i);
+  }
+  setPipeline(e) {
+    this._boundPipeline !== e && (this._boundPipeline = e, this.renderPassEncoder.setPipeline(e));
+  }
+  _setVertexBuffer(e, t) {
+    this._boundVertexBuffer[e] !== t && (this._boundVertexBuffer[e] = t, this.renderPassEncoder.setVertexBuffer(e, this._renderer.buffer.updateBuffer(t)));
+  }
+  _setIndexBuffer(e) {
+    if (this._boundIndexBuffer === e) return;
+    this._boundIndexBuffer = e;
+    const t = e.data.BYTES_PER_ELEMENT === 2 ? "uint16" : "uint32";
+    this.renderPassEncoder.setIndexBuffer(this._renderer.buffer.updateBuffer(e), t);
+  }
+  resetBindGroup(e) {
+    this._boundBindGroup[e] = null;
+  }
+  setBindGroup(e, t, r) {
+    if (this._boundBindGroup[e] === t) return;
+    this._boundBindGroup[e] = t, t._touch(this._renderer.gc.now, this._renderer.tick);
+    const s = this._renderer.bindGroup.getBindGroup(t, r, e);
+    this.renderPassEncoder.setBindGroup(e, s);
+  }
+  setGeometry(e, t) {
+    const r = this._renderer.pipeline.getBufferNamesToBind(e, t);
+    for (const s in r)
+      this._setVertexBuffer(parseInt(s, 10), e.attributes[r[s]].buffer);
+    e.indexBuffer && this._setIndexBuffer(e.indexBuffer);
+  }
+  _setShaderBindGroups(e, t) {
+    for (const r in e.groups) {
+      const s = e.groups[r];
+      t || this._syncBindGroup(s), this.setBindGroup(r, s, e.gpuProgram);
+    }
+  }
+  _syncBindGroup(e) {
+    for (const t in e.resources) {
+      const r = e.resources[t];
+      r.isUniformGroup && this._renderer.ubo.updateUniformGroup(r);
+    }
+  }
+  draw(e) {
+    const { geometry: t, shader: r, state: s, topology: i, size: n, start: o, instanceCount: u, skipSync: c } = e;
+    this.setPipelineFromGeometryProgramAndState(t, r.gpuProgram, s, i), this.setGeometry(t, r.gpuProgram), this._setShaderBindGroups(r, c), t.indexBuffer ? this.renderPassEncoder.drawIndexed(
+      n || t.indexBuffer.data.length,
+      u ?? t.instanceCount,
+      o || 0
+    ) : this.renderPassEncoder.draw(n || t.getSize(), u ?? t.instanceCount, o || 0);
+  }
+  finishRenderPass() {
+    this.renderPassEncoder && (this.renderPassEncoder.end(), this.renderPassEncoder = null);
+  }
+  postrender() {
+    this.finishRenderPass(), this._gpu.device.queue.submit([this.commandEncoder.finish()]), this._resolveCommandFinished(), this.commandEncoder = null;
+  }
+  // restores a render pass if finishRenderPass was called
+  // not optimised as really used for debugging!
+  // used when we want to stop drawing and log a texture..
+  restoreRenderPass() {
+    const e = this._renderer.renderTarget.adaptor.getDescriptor(
+      this._renderer.renderTarget.renderTarget,
+      !1,
+      [0, 0, 0, 1],
+      this._renderer.renderTarget.mipLevel,
+      this._renderer.renderTarget.layer
+    );
+    this.renderPassEncoder = this.commandEncoder.beginRenderPass(e);
+    const t = this._boundPipeline, r = { ...this._boundVertexBuffer }, s = this._boundIndexBuffer, i = { ...this._boundBindGroup };
+    this._clearCache();
+    const n = this._renderer.renderTarget.viewport;
+    this.renderPassEncoder.setViewport(n.x, n.y, n.width, n.height, 0, 1), this.setPipeline(t);
+    for (const o in r)
+      this._setVertexBuffer(o, r[o]);
+    for (const o in i)
+      this.setBindGroup(o, i[o], null);
+    this._setIndexBuffer(s);
+  }
+  _clearCache() {
+    for (let e = 0; e < 16; e++)
+      this._boundBindGroup[e] = null, this._boundVertexBuffer[e] = null;
+    this._boundIndexBuffer = null, this._boundPipeline = null;
+  }
+  destroy() {
+    this._renderer = null, this._gpu = null, this._boundBindGroup = null, this._boundVertexBuffer = null, this._boundIndexBuffer = null, this._boundPipeline = null;
+  }
+  contextChange(e) {
+    this._gpu = e;
+  }
+}
+j.extension = {
+  type: [l.WebGPUSystem],
+  name: "encoder",
+  priority: 1
+};
+class K {
+  constructor(e) {
+    this._renderer = e;
+  }
+  contextChange() {
+    this.maxTextures = this._renderer.device.gpu.device.limits.maxSampledTexturesPerShaderStage, this.maxBatchableTextures = this.maxTextures;
+  }
+  destroy() {
+  }
+}
+K.extension = {
+  type: [
+    l.WebGPUSystem
+  ],
+  name: "limits"
+};
+class q {
+  constructor(e) {
+    this._renderTargetStencilState = /* @__PURE__ */ Object.create(null), this._renderer = e, e.renderTarget.onRenderTargetChange.add(this);
+  }
+  onRenderTargetChange(e) {
+    let t = this._renderTargetStencilState[e.uid];
+    t || (t = this._renderTargetStencilState[e.uid] = {
+      stencilMode: T.DISABLED,
+      stencilReference: 0
+    }), this._activeRenderTarget = e, this.setStencilMode(t.stencilMode, t.stencilReference);
+  }
+  setStencilMode(e, t) {
+    const r = this._renderTargetStencilState[this._activeRenderTarget.uid];
+    r.stencilMode = e, r.stencilReference = t;
+    const s = this._renderer;
+    s.pipeline.setStencilMode(e), s.encoder.renderPassEncoder.setStencilReference(t);
+  }
+  destroy() {
+    this._renderer.renderTarget.onRenderTargetChange.remove(this), this._renderer = null, this._activeRenderTarget = null, this._renderTargetStencilState = null;
+  }
+}
+q.extension = {
+  type: [
+    l.WebGPUSystem
+  ],
+  name: "stencil"
+};
+const b = 128;
+class Y {
+  constructor(e) {
+    this._bindGroupHash = /* @__PURE__ */ Object.create(null), this._buffers = [], this._bindGroups = [], this._bufferResources = [], this._renderer = e, this._batchBuffer = new ve({ minUniformOffsetAlignment: b });
+    const t = 256 / b;
+    for (let r = 0; r < t; r++) {
+      let s = S.UNIFORM | S.COPY_DST;
+      r === 0 && (s |= S.COPY_SRC), this._buffers.push(new ue({
+        data: this._batchBuffer.data,
+        usage: s
+      }));
+    }
+  }
+  renderEnd() {
+    this._uploadBindGroups(), this._resetBindGroups();
+  }
+  _resetBindGroups() {
+    this._bindGroupHash = /* @__PURE__ */ Object.create(null), this._batchBuffer.clear();
+  }
+  // just works for single bind groups for now
+  getUniformBindGroup(e, t) {
+    if (!t && this._bindGroupHash[e.uid])
+      return this._bindGroupHash[e.uid];
+    this._renderer.ubo.ensureUniformGroup(e);
+    const r = e.buffer.data, s = this._batchBuffer.addEmptyGroup(r.length);
+    return this._renderer.ubo.syncUniformGroup(e, this._batchBuffer.data, s / 4), this._bindGroupHash[e.uid] = this._getBindGroup(s / b), this._bindGroupHash[e.uid];
+  }
+  getUboResource(e) {
+    this._renderer.ubo.updateUniformGroup(e);
+    const t = e.buffer.data, r = this._batchBuffer.addGroup(t);
+    return this._getBufferResource(r / b);
+  }
+  getArrayBindGroup(e) {
+    const t = this._batchBuffer.addGroup(e);
+    return this._getBindGroup(t / b);
+  }
+  getArrayBufferResource(e) {
+    const r = this._batchBuffer.addGroup(e) / b;
+    return this._getBufferResource(r);
+  }
+  _getBufferResource(e) {
+    if (!this._bufferResources[e]) {
+      const t = this._buffers[e % 2];
+      this._bufferResources[e] = new ce({
+        buffer: t,
+        offset: (e / 2 | 0) * 256,
+        size: b
+      });
+    }
+    return this._bufferResources[e];
+  }
+  _getBindGroup(e) {
+    if (!this._bindGroups[e]) {
+      const t = new L({
+        0: this._getBufferResource(e)
+      });
+      this._bindGroups[e] = t;
+    }
+    return this._bindGroups[e];
+  }
+  _uploadBindGroups() {
+    const e = this._renderer.buffer, t = this._buffers[0];
+    t.update(this._batchBuffer.byteIndex), e.updateBuffer(t);
+    const r = this._renderer.gpu.device.createCommandEncoder();
+    for (let s = 1; s < this._buffers.length; s++) {
+      const i = this._buffers[s];
+      r.copyBufferToBuffer(
+        e.getGPUBuffer(t),
+        b,
+        e.getGPUBuffer(i),
+        0,
+        this._batchBuffer.byteIndex
+      );
+    }
+    this._renderer.gpu.device.queue.submit([r.finish()]);
+  }
+  destroy() {
+    var e;
+    for (let t = 0; t < this._bindGroups.length; t++)
+      (e = this._bindGroups[t]) == null || e.destroy();
+    this._bindGroups = null, this._bindGroupHash = null;
+    for (let t = 0; t < this._buffers.length; t++)
+      this._buffers[t].destroy();
+    this._buffers = null;
+    for (let t = 0; t < this._bufferResources.length; t++)
+      this._bufferResources[t].destroy();
+    this._bufferResources = null, this._batchBuffer.destroy(), this._renderer = null;
+  }
+}
+Y.extension = {
+  type: [
+    l.WebGPUPipes
+  ],
+  name: "uniformBatch"
+};
+const Ue = {
+  "point-list": 0,
+  "line-list": 1,
+  "line-strip": 2,
+  "triangle-list": 3,
+  "triangle-strip": 4
+};
+function we(a, e, t, r, s) {
+  return a << 24 | e << 16 | t << 10 | r << 5 | s;
+}
+function Me(a, e, t, r, s) {
+  return t << 8 | a << 5 | r << 3 | s << 1 | e;
+}
+class X {
+  constructor(e) {
+    this._moduleCache = /* @__PURE__ */ Object.create(null), this._bufferLayoutsCache = /* @__PURE__ */ Object.create(null), this._bindingNamesCache = /* @__PURE__ */ Object.create(null), this._pipeCache = /* @__PURE__ */ Object.create(null), this._pipeStateCaches = /* @__PURE__ */ Object.create(null), this._colorMask = 15, this._multisampleCount = 1, this._colorTargetCount = 1, this._renderer = e;
+  }
+  contextChange(e) {
+    this._gpu = e, this.setStencilMode(T.DISABLED), this._updatePipeHash();
+  }
+  setMultisampleCount(e) {
+    this._multisampleCount !== e && (this._multisampleCount = e, this._updatePipeHash());
+  }
+  setRenderTarget(e) {
+    this._multisampleCount = e.msaaSamples, this._depthStencilAttachment = e.descriptor.depthStencilAttachment ? 1 : 0, this._colorTargetCount = e.colorTargetCount, this._updatePipeHash();
+  }
+  setColorMask(e) {
+    this._colorMask !== e && (this._colorMask = e, this._updatePipeHash());
+  }
+  setStencilMode(e) {
+    this._stencilMode !== e && (this._stencilMode = e, this._stencilState = Ge[e], this._updatePipeHash());
+  }
+  setPipeline(e, t, r, s) {
+    const i = this.getPipeline(e, t, r);
+    s.setPipeline(i);
+  }
+  getPipeline(e, t, r, s) {
+    e._layoutKey || (Pe(e, t.attributeData), this._generateBufferKey(e)), s || (s = e.topology);
+    const i = we(
+      e._layoutKey,
+      t._layoutKey,
+      r.data,
+      r._blendModeId,
+      Ue[s]
+    );
+    return this._pipeCache[i] ? this._pipeCache[i] : (this._pipeCache[i] = this._createPipeline(e, t, r, s), this._pipeCache[i]);
+  }
+  _createPipeline(e, t, r, s) {
+    const i = this._gpu.device, n = this._createVertexBufferLayouts(e, t), o = this._renderer.state.getColorTargets(r, this._colorTargetCount), u = this._stencilMode === T.RENDERING_MASK_ADD ? 0 : this._colorMask;
+    for (let p = 0; p < o.length; p++)
+      o[p].writeMask = u;
+    const c = this._renderer.shader.getProgramData(t).pipeline, f = {
+      // TODO later check if its helpful to create..
+      // layout,
+      vertex: {
+        module: this._getModule(t.vertex.source),
+        entryPoint: t.vertex.entryPoint,
+        // geometry..
+        buffers: n
+      },
+      fragment: {
+        module: this._getModule(t.fragment.source),
+        entryPoint: t.fragment.entryPoint,
+        targets: o
+      },
+      primitive: {
+        topology: s,
+        cullMode: r.cullMode
+      },
+      layout: c,
+      multisample: {
+        count: this._multisampleCount
+      },
+      // depthStencil,
+      label: "PIXI Pipeline"
+    };
+    return this._depthStencilAttachment && (f.depthStencil = {
+      ...this._stencilState,
+      format: "depth24plus-stencil8",
+      depthWriteEnabled: r.depthTest,
+      depthCompare: r.depthTest ? "less" : "always"
+    }), i.createRenderPipeline(f);
+  }
+  _getModule(e) {
+    return this._moduleCache[e] || this._createModule(e);
+  }
+  _createModule(e) {
+    const t = this._gpu.device;
+    return this._moduleCache[e] = t.createShaderModule({
+      code: e
+    }), this._moduleCache[e];
+  }
+  _generateBufferKey(e) {
+    const t = [];
+    let r = 0;
+    const s = Object.keys(e.attributes).sort();
+    for (let n = 0; n < s.length; n++) {
+      const o = e.attributes[s[n]];
+      t[r++] = o.offset, t[r++] = o.format, t[r++] = o.stride, t[r++] = o.instance;
+    }
+    const i = t.join("|");
+    return e._layoutKey = U(i, "geometry"), e._layoutKey;
+  }
+  _generateAttributeLocationsKey(e) {
+    const t = [];
+    let r = 0;
+    const s = Object.keys(e.attributeData).sort();
+    for (let n = 0; n < s.length; n++) {
+      const o = e.attributeData[s[n]];
+      t[r++] = o.location;
+    }
+    const i = t.join("|");
+    return e._attributeLocationsKey = U(i, "programAttributes"), e._attributeLocationsKey;
+  }
+  /**
+   * Returns a hash of buffer names mapped to bind locations.
+   * This is used to bind the correct buffer to the correct location in the shader.
+   * @param geometry - The geometry where to get the buffer names
+   * @param program - The program where to get the buffer names
+   * @returns An object of buffer names mapped to the bind location.
+   */
+  getBufferNamesToBind(e, t) {
+    const r = e._layoutKey << 16 | t._attributeLocationsKey;
+    if (this._bindingNamesCache[r]) return this._bindingNamesCache[r];
+    const s = this._createVertexBufferLayouts(e, t), i = /* @__PURE__ */ Object.create(null), n = t.attributeData;
+    for (let o = 0; o < s.length; o++) {
+      const c = Object.values(s[o].attributes)[0].shaderLocation;
+      for (const f in n)
+        if (n[f].location === c) {
+          i[o] = f;
+          break;
+        }
+    }
+    return this._bindingNamesCache[r] = i, i;
+  }
+  _createVertexBufferLayouts(e, t) {
+    t._attributeLocationsKey || this._generateAttributeLocationsKey(t);
+    const r = e._layoutKey << 16 | t._attributeLocationsKey;
+    if (this._bufferLayoutsCache[r])
+      return this._bufferLayoutsCache[r];
+    const s = [];
+    return e.buffers.forEach((i) => {
+      const n = {
+        arrayStride: 0,
+        stepMode: "vertex",
+        attributes: []
+      }, o = n.attributes;
+      for (const u in t.attributeData) {
+        const c = e.attributes[u];
+        (c.divisor ?? 1) !== 1 && C(`Attribute ${u} has an invalid divisor value of '${c.divisor}'. WebGPU only supports a divisor value of 1`), c.buffer === i && (n.arrayStride = c.stride, n.stepMode = c.instance ? "instance" : "vertex", o.push({
+          shaderLocation: t.attributeData[u].location,
+          offset: c.offset,
+          format: c.format
+        }));
+      }
+      o.length && s.push(n);
+    }), this._bufferLayoutsCache[r] = s, s;
+  }
+  _updatePipeHash() {
+    const e = Me(
+      this._stencilMode,
+      this._multisampleCount,
+      this._colorMask,
+      this._depthStencilAttachment,
+      this._colorTargetCount
+    );
+    this._pipeStateCaches[e] || (this._pipeStateCaches[e] = /* @__PURE__ */ Object.create(null)), this._pipeCache = this._pipeStateCaches[e];
+  }
+  destroy() {
+    this._renderer = null, this._bufferLayoutsCache = null;
+  }
+}
+X.extension = {
+  type: [l.WebGPUSystem],
+  name: "pipeline"
+};
+class Re {
+  constructor() {
+    this.contexts = [], this.msaaTextures = [], this.msaaSamples = 1;
+  }
+}
+class Ee {
+  init(e, t) {
+    this._renderer = e, this._renderTargetSystem = t;
+  }
+  copyToTexture(e, t, r, s, i) {
+    const n = this._renderer, o = this._getGpuColorTexture(
+      e
+    ), u = n.texture.getGpuSource(
+      t.source
+    );
+    return n.encoder.commandEncoder.copyTextureToTexture(
+      {
+        texture: o,
+        origin: r
+      },
+      {
+        texture: u,
+        origin: i
+      },
+      s
+    ), t;
+  }
+  startRenderPass(e, t = !0, r, s, i = 0, n = 0) {
+    var f, h;
+    const u = this._renderTargetSystem.getGpuRenderTarget(e);
+    if (n !== 0 && ((f = u.msaaTextures) != null && f.length))
+      throw new Error("[RenderTargetSystem] Rendering to array layers is not supported with MSAA render targets.");
+    if (i > 0 && ((h = u.msaaTextures) != null && h.length))
+      throw new Error("[RenderTargetSystem] Rendering to mip levels is not supported with MSAA render targets.");
+    const c = this.getDescriptor(e, t, r, i, n);
+    u.descriptor = c, this._renderer.pipeline.setRenderTarget(u), this._renderer.encoder.beginRenderPass(u), this._renderer.encoder.setViewport(s);
+  }
+  finishRenderPass() {
+    this._renderer.encoder.endRenderPass();
+  }
+  /**
+   * returns the gpu texture for the first color texture in the render target
+   * mainly used by the filter manager to get copy the texture for blending
+   * @param renderTarget
+   * @returns a gpu texture
+   */
+  _getGpuColorTexture(e) {
+    const t = this._renderTargetSystem.getGpuRenderTarget(e);
+    return t.contexts[0] ? t.contexts[0].getCurrentTexture() : this._renderer.texture.getGpuSource(
+      e.colorTextures[0].source
+    );
+  }
+  getDescriptor(e, t, r, s = 0, i = 0) {
+    typeof t == "boolean" && (t = t ? y.ALL : y.NONE);
+    const n = this._renderTargetSystem, o = n.getGpuRenderTarget(e), u = e.colorTextures.map(
+      (h, p) => {
+        const d = o.contexts[p];
+        let g, m;
+        if (d) {
+          if (i !== 0)
+            throw new Error("[RenderTargetSystem] Rendering to array layers is not supported for canvas targets.");
+          g = d.getCurrentTexture().createView();
+        } else
+          g = this._renderer.texture.getGpuSource(h).createView({
+            // Render attachments must be 2d views; for array/cube textures we select a single layer.
+            dimension: "2d",
+            baseMipLevel: s,
+            mipLevelCount: 1,
+            baseArrayLayer: i,
+            arrayLayerCount: 1
+          });
+        o.msaaTextures[p] && (m = g, g = this._renderer.texture.getTextureView(
+          o.msaaTextures[p]
+        ));
+        const x = t & y.COLOR ? "clear" : "load";
+        return r ?? (r = n.defaultClearColor), {
+          view: g,
+          resolveTarget: m,
+          clearValue: r,
+          storeOp: "store",
+          loadOp: x
+        };
+      }
+    );
+    let c;
+    if ((e.stencil || e.depth) && !e.depthStencilTexture && (e.ensureDepthStencilTexture(), e.depthStencilTexture.source.sampleCount = o.msaa ? 4 : 1), e.depthStencilTexture) {
+      const h = t & y.STENCIL ? "clear" : "load", p = t & y.DEPTH ? "clear" : "load";
+      c = {
+        view: this._renderer.texture.getGpuSource(e.depthStencilTexture.source).createView({
+          dimension: "2d",
+          baseMipLevel: s,
+          mipLevelCount: 1,
+          baseArrayLayer: i,
+          arrayLayerCount: 1
+        }),
+        stencilStoreOp: "store",
+        stencilLoadOp: h,
+        depthClearValue: 1,
+        depthLoadOp: p,
+        depthStoreOp: "store"
+      };
+    }
+    return {
+      colorAttachments: u,
+      depthStencilAttachment: c
+    };
+  }
+  clear(e, t = !0, r, s, i = 0, n = 0) {
+    if (!t) return;
+    const { gpu: o, encoder: u } = this._renderer, c = o.device;
+    if (u.commandEncoder === null) {
+      const h = c.createCommandEncoder(), p = this.getDescriptor(e, t, r, i, n), d = h.beginRenderPass(p);
+      d.setViewport(s.x, s.y, s.width, s.height, 0, 1), d.end();
+      const g = h.finish();
+      c.queue.submit([g]);
+    } else
+      this.startRenderPass(e, t, r, s, i, n);
+  }
+  initGpuRenderTarget(e) {
+    e.isRoot = !0;
+    const t = new Re();
+    return t.colorTargetCount = e.colorTextures.length, e.colorTextures.forEach((r, s) => {
+      if (r instanceof de) {
+        const i = r.resource.getContext(
+          "webgpu"
+        ), n = r.transparent ? "premultiplied" : "opaque";
+        try {
+          i.configure({
+            device: this._renderer.gpu.device,
+            usage: GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST | GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.COPY_SRC,
+            format: "bgra8unorm",
+            alphaMode: n
+          });
+        } catch (o) {
+          console.error(o);
+        }
+        t.contexts[s] = i;
+      }
+      if (t.msaa = r.source.antialias, r.source.antialias) {
+        const i = new he({
+          width: 0,
+          height: 0,
+          sampleCount: 4,
+          arrayLayerCount: r.source.arrayLayerCount
+        });
+        t.msaaTextures[s] = i;
+      }
+    }), t.msaa && (t.msaaSamples = 4, e.depthStencilTexture && (e.depthStencilTexture.source.sampleCount = 4)), t;
+  }
+  destroyGpuRenderTarget(e) {
+    e.contexts.forEach((t) => {
+      t.unconfigure();
+    }), e.msaaTextures.forEach((t) => {
+      t.destroy();
+    }), e.msaaTextures.length = 0, e.contexts.length = 0;
+  }
+  ensureDepthStencilTexture(e) {
+    const t = this._renderTargetSystem.getGpuRenderTarget(e);
+    e.depthStencilTexture && t.msaa && (e.depthStencilTexture.source.sampleCount = 4);
+  }
+  resizeGpuRenderTarget(e) {
+    const t = this._renderTargetSystem.getGpuRenderTarget(e);
+    t.width = e.width, t.height = e.height, t.msaa && e.colorTextures.forEach((r, s) => {
+      const i = t.msaaTextures[s];
+      i == null || i.resize(
+        r.source.width,
+        r.source.height,
+        r.source._resolution
+      );
+    });
+  }
+}
+class $ extends me {
+  constructor(e) {
+    super(e), this.adaptor = new Ee(), this.adaptor.init(e, this);
+  }
+}
+$.extension = {
+  type: [l.WebGPUSystem],
+  name: "renderTarget"
+};
+class J {
+  constructor() {
+    this._gpuProgramData = /* @__PURE__ */ Object.create(null);
+  }
+  contextChange(e) {
+    this._gpu = e;
+  }
+  getProgramData(e) {
+    return this._gpuProgramData[e._layoutKey] || this._createGPUProgramData(e);
+  }
+  _createGPUProgramData(e) {
+    const t = this._gpu.device, r = e.gpuLayout.map((i) => t.createBindGroupLayout({ entries: i })), s = { bindGroupLayouts: r };
+    return this._gpuProgramData[e._layoutKey] = {
+      bindGroups: r,
+      pipeline: t.createPipelineLayout(s)
+    }, this._gpuProgramData[e._layoutKey];
+  }
+  destroy() {
+    this._gpu = null, this._gpuProgramData = null;
+  }
+}
+J.extension = {
+  type: [
+    l.WebGPUSystem
+  ],
+  name: "shader"
+};
+const _ = {};
+_.normal = {
+  alpha: {
+    srcFactor: "one",
+    dstFactor: "one-minus-src-alpha",
+    operation: "add"
+  },
+  color: {
+    srcFactor: "one",
+    dstFactor: "one-minus-src-alpha",
+    operation: "add"
+  }
+};
+_.add = {
+  alpha: {
+    srcFactor: "src-alpha",
+    dstFactor: "one-minus-src-alpha",
+    operation: "add"
+  },
+  color: {
+    srcFactor: "one",
+    dstFactor: "one",
+    operation: "add"
+  }
+};
+_.multiply = {
+  alpha: {
+    srcFactor: "one",
+    dstFactor: "one-minus-src-alpha",
+    operation: "add"
+  },
+  color: {
+    srcFactor: "dst",
+    dstFactor: "one-minus-src-alpha",
+    operation: "add"
+  }
+};
+_.screen = {
+  alpha: {
+    srcFactor: "one",
+    dstFactor: "one-minus-src-alpha",
+    operation: "add"
+  },
+  color: {
+    srcFactor: "one",
+    dstFactor: "one-minus-src",
+    operation: "add"
+  }
+};
+_.overlay = {
+  alpha: {
+    srcFactor: "one",
+    dstFactor: "one-minus-src-alpha",
+    operation: "add"
+  },
+  color: {
+    srcFactor: "one",
+    dstFactor: "one-minus-src",
+    operation: "add"
+  }
+};
+_.none = {
+  alpha: {
+    srcFactor: "one",
+    dstFactor: "one-minus-src-alpha",
+    operation: "add"
+  },
+  color: {
+    srcFactor: "zero",
+    dstFactor: "zero",
+    operation: "add"
+  }
+};
+_["normal-npm"] = {
+  alpha: {
+    srcFactor: "one",
+    dstFactor: "one-minus-src-alpha",
+    operation: "add"
+  },
+  color: {
+    srcFactor: "src-alpha",
+    dstFactor: "one-minus-src-alpha",
+    operation: "add"
+  }
+};
+_["add-npm"] = {
+  alpha: {
+    srcFactor: "one",
+    dstFactor: "one",
+    operation: "add"
+  },
+  color: {
+    srcFactor: "src-alpha",
+    dstFactor: "one",
+    operation: "add"
+  }
+};
+_["screen-npm"] = {
+  alpha: {
+    srcFactor: "one",
+    dstFactor: "one-minus-src-alpha",
+    operation: "add"
+  },
+  color: {
+    srcFactor: "src-alpha",
+    dstFactor: "one-minus-src",
+    operation: "add"
+  }
+};
+_.erase = {
+  alpha: {
+    srcFactor: "zero",
+    dstFactor: "one-minus-src-alpha",
+    operation: "add"
+  },
+  color: {
+    srcFactor: "zero",
+    dstFactor: "one-minus-src",
+    operation: "add"
+  }
+};
+_.min = {
+  alpha: {
+    srcFactor: "one",
+    dstFactor: "one",
+    operation: "min"
+  },
+  color: {
+    srcFactor: "one",
+    dstFactor: "one",
+    operation: "min"
+  }
+};
+_.max = {
+  alpha: {
+    srcFactor: "one",
+    dstFactor: "one",
+    operation: "max"
+  },
+  color: {
+    srcFactor: "one",
+    dstFactor: "one",
+    operation: "max"
+  }
+};
+class Q {
+  constructor() {
+    this.defaultState = new E(), this.defaultState.blend = !0;
+  }
+  contextChange(e) {
+    this.gpu = e;
+  }
+  /**
+   * Gets the blend mode data for the current state
+   * @param state - The state to get the blend mode from
+   * @param count - The number of color targets to create
+   */
+  getColorTargets(e, t) {
+    const r = _[e.blendMode] || _.normal, s = [], i = {
+      format: "bgra8unorm",
+      writeMask: 0,
+      blend: r
+    };
+    for (let n = 0; n < t; n++)
+      s[n] = i;
+    return s;
+  }
+  destroy() {
+    this.gpu = null;
+  }
+}
+Q.extension = {
+  type: [
+    l.WebGPUSystem
+  ],
+  name: "state"
+};
+const Le = {
+  type: "image",
+  upload(a, e, t, r = 0) {
+    const s = a.resource, i = (a.pixelWidth | 0) * (a.pixelHeight | 0), n = s.byteLength / i;
+    t.device.queue.writeTexture(
+      { texture: e, origin: { x: 0, y: 0, z: r } },
+      s,
+      {
+        offset: 0,
+        rowsPerImage: a.pixelHeight,
+        bytesPerRow: a.pixelWidth * n
+      },
+      {
+        width: a.pixelWidth,
+        height: a.pixelHeight,
+        depthOrArrayLayers: 1
+      }
+    );
+  }
+}, Z = {
+  "bc1-rgba-unorm": { blockBytes: 8, blockWidth: 4, blockHeight: 4 },
+  "bc2-rgba-unorm": { blockBytes: 16, blockWidth: 4, blockHeight: 4 },
+  "bc3-rgba-unorm": { blockBytes: 16, blockWidth: 4, blockHeight: 4 },
+  "bc7-rgba-unorm": { blockBytes: 16, blockWidth: 4, blockHeight: 4 },
+  "etc1-rgb-unorm": { blockBytes: 8, blockWidth: 4, blockHeight: 4 },
+  "etc2-rgba8unorm": { blockBytes: 16, blockWidth: 4, blockHeight: 4 },
+  "astc-4x4-unorm": { blockBytes: 16, blockWidth: 4, blockHeight: 4 }
+}, Ae = { blockBytes: 4, blockWidth: 1, blockHeight: 1 }, De = {
+  type: "compressed",
+  upload(a, e, t, r = 0) {
+    let s = a.pixelWidth, i = a.pixelHeight;
+    const n = Z[a.format] || Ae;
+    for (let o = 0; o < a.resource.length; o++) {
+      const u = a.resource[o], c = Math.ceil(s / n.blockWidth) * n.blockBytes;
+      t.device.queue.writeTexture(
+        {
+          texture: e,
+          mipLevel: o,
+          origin: { x: 0, y: 0, z: r }
+        },
+        u,
+        {
+          offset: 0,
+          bytesPerRow: c
+        },
+        {
+          width: Math.ceil(s / n.blockWidth) * n.blockWidth,
+          height: Math.ceil(i / n.blockHeight) * n.blockHeight,
+          depthOrArrayLayers: 1
+        }
+      ), s = Math.max(s >> 1, 1), i = Math.max(i >> 1, 1);
+    }
+  }
+}, R = ["right", "left", "top", "bottom", "front", "back"];
+function ke(a) {
+  return {
+    type: "cube",
+    upload(e, t, r) {
+      const s = e.faces;
+      for (let i = 0; i < R.length; i++) {
+        const n = R[i], o = s[n];
+        (a[o.uploadMethodId] || a.image).upload(o, t, r, i);
+      }
+    }
+  };
+}
+const ee = {
+  type: "image",
+  upload(a, e, t, r = 0) {
+    const s = a.resource;
+    if (!s) return;
+    if (globalThis.HTMLImageElement && s instanceof HTMLImageElement) {
+      const u = P.get().createCanvas(s.width, s.height);
+      u.getContext("2d").drawImage(s, 0, 0, s.width, s.height), a.resource = u, C("ImageSource: Image element passed, converting to canvas and replacing resource.");
+    }
+    const i = Math.min(e.width, a.resourceWidth || a.pixelWidth), n = Math.min(e.height, a.resourceHeight || a.pixelHeight), o = a.alphaMode === "premultiply-alpha-on-upload";
+    t.device.queue.copyExternalImageToTexture(
+      { source: s },
+      { texture: e, origin: { x: 0, y: 0, z: r }, premultipliedAlpha: o },
+      {
+        width: i,
+        height: n
+      }
+    );
+  }
+}, Fe = {
+  type: "video",
+  upload(a, e, t, r) {
+    ee.upload(a, e, t, r);
+  }
+};
+class Oe {
+  constructor(e) {
+    this.device = e, this.sampler = e.createSampler({ minFilter: "linear" }), this.pipelines = {};
+  }
+  _getMipmapPipeline(e) {
+    let t = this.pipelines[e];
+    return t || (this.mipmapShaderModule || (this.mipmapShaderModule = this.device.createShaderModule({
+      code: (
+        /* wgsl */
+        `
+                        var<private> pos : array<vec2<f32>, 3> = array<vec2<f32>, 3>(
+                        vec2<f32>(-1.0, -1.0), vec2<f32>(-1.0, 3.0), vec2<f32>(3.0, -1.0));
+
+                        struct VertexOutput {
+                        @builtin(position) position : vec4<f32>,
+                        @location(0) texCoord : vec2<f32>,
+                        };
+
+                        @vertex
+                        fn vertexMain(@builtin(vertex_index) vertexIndex : u32) -> VertexOutput {
+                        var output : VertexOutput;
+                        output.texCoord = pos[vertexIndex] * vec2<f32>(0.5, -0.5) + vec2<f32>(0.5);
+                        output.position = vec4<f32>(pos[vertexIndex], 0.0, 1.0);
+                        return output;
+                        }
+
+                        @group(0) @binding(0) var imgSampler : sampler;
+                        @group(0) @binding(1) var img : texture_2d<f32>;
+
+                        @fragment
+                        fn fragmentMain(@location(0) texCoord : vec2<f32>) -> @location(0) vec4<f32> {
+                        return textureSample(img, imgSampler, texCoord);
+                        }
+                    `
+      )
+    })), t = this.device.createRenderPipeline({
+      layout: "auto",
+      vertex: {
+        module: this.mipmapShaderModule,
+        entryPoint: "vertexMain"
+      },
+      fragment: {
+        module: this.mipmapShaderModule,
+        entryPoint: "fragmentMain",
+        targets: [{ format: e }]
+      }
+    }), this.pipelines[e] = t), t;
+  }
+  /**
+   * Generates mipmaps for the given GPUTexture from the data in level 0.
+   * @param {module:External.GPUTexture} texture - Texture to generate mipmaps for.
+   * @returns {module:External.GPUTexture} - The originally passed texture
+   */
+  generateMipmap(e) {
+    const t = this._getMipmapPipeline(e.format);
+    if (e.dimension === "3d" || e.dimension === "1d")
+      throw new Error("Generating mipmaps for non-2d textures is currently unsupported!");
+    let r = e;
+    const s = e.depthOrArrayLayers || 1, i = e.usage & GPUTextureUsage.RENDER_ATTACHMENT;
+    if (!i) {
+      const u = {
+        size: {
+          width: Math.ceil(e.width / 2),
+          height: Math.ceil(e.height / 2),
+          depthOrArrayLayers: s
+        },
+        format: e.format,
+        usage: GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_SRC | GPUTextureUsage.RENDER_ATTACHMENT,
+        mipLevelCount: e.mipLevelCount - 1
+      };
+      r = this.device.createTexture(u);
+    }
+    const n = this.device.createCommandEncoder({}), o = t.getBindGroupLayout(0);
+    for (let u = 0; u < s; ++u) {
+      let c = e.createView({
+        baseMipLevel: 0,
+        mipLevelCount: 1,
+        dimension: "2d",
+        baseArrayLayer: u,
+        arrayLayerCount: 1
+      }), f = i ? 1 : 0;
+      for (let h = 1; h < e.mipLevelCount; ++h) {
+        const p = r.createView({
+          baseMipLevel: f++,
+          mipLevelCount: 1,
+          dimension: "2d",
+          baseArrayLayer: u,
+          arrayLayerCount: 1
+        }), d = n.beginRenderPass({
+          colorAttachments: [{
+            view: p,
+            storeOp: "store",
+            loadOp: "clear",
+            clearValue: { r: 0, g: 0, b: 0, a: 0 }
+          }]
+        }), g = this.device.createBindGroup({
+          layout: o,
+          entries: [{
+            binding: 0,
+            resource: this.sampler
+          }, {
+            binding: 1,
+            resource: c
+          }]
+        });
+        d.setPipeline(t), d.setBindGroup(0, g), d.draw(3, 1, 0, 0), d.end(), c = p;
+      }
+    }
+    if (!i) {
+      const u = {
+        width: Math.ceil(e.width / 2),
+        height: Math.ceil(e.height / 2),
+        depthOrArrayLayers: s
+      };
+      for (let c = 1; c < e.mipLevelCount; ++c)
+        n.copyTextureToTexture({
+          texture: r,
+          mipLevel: c - 1
+        }, {
+          texture: e,
+          mipLevel: c
+        }, u), u.width = Math.ceil(u.width / 2), u.height = Math.ceil(u.height / 2);
+    }
+    return this.device.queue.submit([n.finish()]), i || r.destroy(), e;
+  }
+}
+class Ie {
+  constructor(e) {
+    this.textureView = null, this.gpuTexture = e;
+  }
+  /** Destroys this GPU data instance. */
+  destroy() {
+    this.gpuTexture.destroy(), this.textureView = null, this.gpuTexture = null;
+  }
+}
+class te {
+  constructor(e) {
+    this._gpuSamplers = /* @__PURE__ */ Object.create(null), this._bindGroupHash = /* @__PURE__ */ Object.create(null), this._renderer = e, e.gc.addCollection(this, "_bindGroupHash", "hash"), this._managedTextures = new O({
+      renderer: e,
+      type: "resource",
+      onUnload: this.onSourceUnload.bind(this),
+      name: "gpuTextureSource"
+    });
+    const t = {
+      image: ee,
+      buffer: Le,
+      video: Fe,
+      compressed: De
+    };
+    this._uploads = {
+      ...t,
+      cube: ke(t)
+    };
+  }
+  /**
+   * @deprecated since 8.15.0
+   */
+  get managedTextures() {
+    return Object.values(this._managedTextures.items);
+  }
+  contextChange(e) {
+    this._gpu = e;
+  }
+  /**
+   * Initializes a texture source, if it has already been initialized nothing will happen.
+   * @param source - The texture source to initialize.
+   * @returns The initialized texture source.
+   */
+  initSource(e) {
+    var t;
+    return ((t = e._gpuData[this._renderer.uid]) == null ? void 0 : t.gpuTexture) || this._initSource(e);
+  }
+  _initSource(e) {
+    if (e.autoGenerateMipmaps) {
+      const c = Math.max(e.pixelWidth, e.pixelHeight);
+      e.mipLevelCount = Math.floor(Math.log2(c)) + 1;
+    }
+    let t = GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST;
+    e.uploadMethodId !== "compressed" && (t |= GPUTextureUsage.RENDER_ATTACHMENT, t |= GPUTextureUsage.COPY_SRC);
+    const r = Z[e.format] || { blockWidth: 1, blockHeight: 1 }, s = Math.ceil(e.pixelWidth / r.blockWidth) * r.blockWidth, i = Math.ceil(e.pixelHeight / r.blockHeight) * r.blockHeight, n = {
+      label: e.label,
+      size: { width: s, height: i, depthOrArrayLayers: e.arrayLayerCount },
+      format: e.format,
+      sampleCount: e.sampleCount,
+      mipLevelCount: e.mipLevelCount,
+      dimension: e.dimension,
+      usage: t
+    }, o = this._gpu.device.createTexture(n);
+    return e._gpuData[this._renderer.uid] = new Ie(o), this._managedTextures.add(e) && (e.on("update", this.onSourceUpdate, this), e.on("resize", this.onSourceResize, this), e.on("updateMipmaps", this.onUpdateMipmaps, this)), this.onSourceUpdate(e), o;
+  }
+  onSourceUpdate(e) {
+    const t = this.getGpuSource(e);
+    t && (this._uploads[e.uploadMethodId] && this._uploads[e.uploadMethodId].upload(e, t, this._gpu), e.autoGenerateMipmaps && e.mipLevelCount > 1 && this.onUpdateMipmaps(e));
+  }
+  onUpdateMipmaps(e) {
+    this._mipmapGenerator || (this._mipmapGenerator = new Oe(this._gpu.device));
+    const t = this.getGpuSource(e);
+    this._mipmapGenerator.generateMipmap(t);
+  }
+  onSourceUnload(e) {
+    e.off("update", this.onSourceUpdate, this), e.off("resize", this.onSourceResize, this), e.off("updateMipmaps", this.onUpdateMipmaps, this);
+  }
+  onSourceResize(e) {
+    e._gcLastUsed = this._renderer.gc.now;
+    const t = e._gpuData[this._renderer.uid], r = t == null ? void 0 : t.gpuTexture;
+    r ? (r.width !== e.pixelWidth || r.height !== e.pixelHeight) && (t.destroy(), this._bindGroupHash[e.uid] = null, e._gpuData[this._renderer.uid] = null, this.initSource(e)) : this.initSource(e);
+  }
+  _initSampler(e) {
+    return this._gpuSamplers[e._resourceId] = this._gpu.device.createSampler(e), this._gpuSamplers[e._resourceId];
+  }
+  getGpuSampler(e) {
+    return this._gpuSamplers[e._resourceId] || this._initSampler(e);
+  }
+  getGpuSource(e) {
+    var t;
+    return e._gcLastUsed = this._renderer.gc.now, ((t = e._gpuData[this._renderer.uid]) == null ? void 0 : t.gpuTexture) || this.initSource(e);
+  }
+  /**
+   * this returns s bind group for a specific texture, the bind group contains
+   * - the texture source
+   * - the texture style
+   * - the texture matrix
+   * This is cached so the bind group should only be created once per texture
+   * @param texture - the texture you want the bindgroup for
+   * @returns the bind group for the texture
+   */
+  getTextureBindGroup(e) {
+    return this._bindGroupHash[e.uid] || this._createTextureBindGroup(e);
+  }
+  _createTextureBindGroup(e) {
+    const t = e.source;
+    return this._bindGroupHash[e.uid] = new L({
+      0: t,
+      1: t.style,
+      2: new A({
+        uTextureMatrix: { type: "mat3x3<f32>", value: e.textureMatrix.mapCoord }
+      })
+    }), this._bindGroupHash[e.uid];
+  }
+  getTextureView(e) {
+    const t = e.source;
+    t._gcLastUsed = this._renderer.gc.now;
+    let r = t._gpuData[this._renderer.uid];
+    return r || (this.initSource(t), r = t._gpuData[this._renderer.uid]), r.textureView || (r.textureView = r.gpuTexture.createView({ dimension: t.viewDimension })), r.textureView;
+  }
+  generateCanvas(e) {
+    const t = this._renderer, r = t.gpu.device.createCommandEncoder(), s = P.get().createCanvas();
+    s.width = e.source.pixelWidth, s.height = e.source.pixelHeight;
+    const i = s.getContext("webgpu");
+    return i.configure({
+      device: t.gpu.device,
+      usage: GPUTextureUsage.COPY_DST | GPUTextureUsage.COPY_SRC,
+      format: P.get().getNavigator().gpu.getPreferredCanvasFormat(),
+      alphaMode: "premultiplied"
+    }), r.copyTextureToTexture({
+      texture: t.texture.getGpuSource(e.source),
+      origin: {
+        x: 0,
+        y: 0
+      }
+    }, {
+      texture: i.getCurrentTexture()
+    }, {
+      width: s.width,
+      height: s.height
+    }), t.gpu.device.queue.submit([r.finish()]), s;
+  }
+  getPixels(e) {
+    const t = this.generateCanvas(e), r = M.getOptimalCanvasAndContext(t.width, t.height), s = r.context;
+    s.drawImage(t, 0, 0);
+    const { width: i, height: n } = t, o = s.getImageData(0, 0, i, n), u = new Uint8ClampedArray(o.data.buffer);
+    return M.returnCanvasAndContext(r), { pixels: u, width: i, height: n };
+  }
+  destroy() {
+    this._managedTextures.destroy();
+    for (const e of Object.keys(this._bindGroupHash)) {
+      const t = Number(e), r = this._bindGroupHash[t];
+      r == null || r.destroy();
+    }
+    this._renderer = null, this._gpu = null, this._mipmapGenerator = null, this._gpuSamplers = null, this._bindGroupHash = null;
+  }
+}
+te.extension = {
+  type: [
+    l.WebGPUSystem
+  ],
+  name: "texture"
+};
+class re {
+  constructor() {
+    this._maxTextures = 0;
+  }
+  contextChange(e) {
+    const t = new A({
+      uTransformMatrix: { value: new D(), type: "mat3x3<f32>" },
+      uColor: { value: new Float32Array([1, 1, 1, 1]), type: "vec4<f32>" },
+      uRound: { value: 0, type: "f32" }
+    });
+    this._maxTextures = e.limits.maxBatchableTextures;
+    const r = I({
+      name: "graphics",
+      bits: [
+        _e,
+        be(this._maxTextures),
+        Be,
+        H
+      ]
+    });
+    this.shader = new k({
+      gpuProgram: r,
+      resources: {
+        // added on the fly!
+        localUniforms: t
+      }
+    });
+  }
+  execute(e, t) {
+    const r = t.context, s = r.customShader || this.shader, i = e.renderer, n = i.graphicsContext, {
+      batcher: o,
+      instructions: u
+    } = n.getContextRenderData(r), c = i.encoder;
+    c.setGeometry(o.geometry, s.gpuProgram);
+    const f = i.globalUniforms.bindGroup;
+    c.setBindGroup(0, f, s.gpuProgram);
+    const h = i.renderPipes.uniformBatch.getUniformBindGroup(s.resources.localUniforms, !0);
+    c.setBindGroup(2, h, s.gpuProgram);
+    const p = u.instructions;
+    let d = null;
+    for (let g = 0; g < u.instructionSize; g++) {
+      const m = p[g];
+      if (m.topology !== d && (d = m.topology, c.setPipelineFromGeometryProgramAndState(
+        o.geometry,
+        s.gpuProgram,
+        e.state,
+        m.topology
+      )), s.groups[1] = m.bindGroup, !m.gpuBindGroup) {
+        const x = m.textures;
+        m.bindGroup = F(
+          x.textures,
+          x.count,
+          this._maxTextures
+        ), m.gpuBindGroup = i.bindGroup.getBindGroup(
+          m.bindGroup,
+          s.gpuProgram,
+          1
+        );
+      }
+      c.setBindGroup(1, m.bindGroup, s.gpuProgram), c.renderPassEncoder.drawIndexed(m.size, 1, m.start);
+    }
+  }
+  destroy() {
+    this.shader.destroy(!0), this.shader = null;
+  }
+}
+re.extension = {
+  type: [
+    l.WebGPUPipesAdaptor
+  ],
+  name: "graphics"
+};
+class se {
+  init() {
+    const e = I({
+      name: "mesh",
+      bits: [
+        Se,
+        Te,
+        H
+      ]
+    });
+    this._shader = new k({
+      gpuProgram: e,
+      resources: {
+        uTexture: w.EMPTY._source,
+        uSampler: w.EMPTY._source.style,
+        textureUniforms: {
+          uTextureMatrix: { type: "mat3x3<f32>", value: new D() }
+        }
+      }
+    });
+  }
+  execute(e, t) {
+    const r = e.renderer;
+    let s = t._shader;
+    if (!s)
+      s = this._shader, s.groups[2] = r.texture.getTextureBindGroup(t.texture);
+    else if (!s.gpuProgram) {
+      C("Mesh shader has no gpuProgram", t.shader);
+      return;
+    }
+    const i = s.gpuProgram;
+    if (i.autoAssignGlobalUniforms && (s.groups[0] = r.globalUniforms.bindGroup), i.autoAssignLocalUniforms) {
+      const n = e.localUniforms;
+      s.groups[1] = r.renderPipes.uniformBatch.getUniformBindGroup(n, !0);
+    }
+    r.encoder.draw({
+      geometry: t._geometry,
+      shader: s,
+      state: t.state
+    });
+  }
+  destroy() {
+    this._shader.destroy(!0), this._shader = null;
+  }
+}
+se.extension = {
+  type: [
+    l.WebGPUPipesAdaptor
+  ],
+  name: "mesh"
+};
+const He = [
+  ...ye,
+  fe,
+  j,
+  v,
+  K,
+  N,
+  te,
+  $,
+  J,
+  Q,
+  X,
+  z,
+  q,
+  V
+], We = [...xe, Y], Ve = [W, se, re], ie = [], ne = [], oe = [];
+B.handleByNamedList(l.WebGPUSystem, ie);
+B.handleByNamedList(l.WebGPUPipes, ne);
+B.handleByNamedList(l.WebGPUPipesAdaptor, oe);
+B.add(...He, ...We, ...Ve);
+class $e extends pe {
+  constructor() {
+    const e = {
+      name: "webgpu",
+      type: le.WEBGPU,
+      systems: ie,
+      renderPipes: ne,
+      renderPipeAdaptors: oe
+    };
+    super(e);
+  }
+}
+export {
+  $e as WebGPURenderer
+};
+//# sourceMappingURL=WebGPURenderer-xmqgPtcF.js.map