velo-plot 3.0.0 → 4.0.0-alpha.1

package/dist/plugins/gpu.js

@@ -1,10 +1,1836 @@
-var B = Object.defineProperty;
-var k = (p, e, i) => e in p ? B(p, e, { enumerable: !0, configurable: !0, writable: !0, value: i }) : p[e] = i;
-var _ = (p, e, i) => k(p, typeof e != "symbol" ? e + "" : e, i);
-import { G as q, S as W, a as I, W as Y, c as $, p as N } from "../gpuRenderer-BpaMYz-k.js";
-class z {
+var L = Object.defineProperty;
+var F = (s, e, t) => e in s ? L(s, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : s[e] = t;
+var c = (s, e, t) => F(s, typeof e != "symbol" ? e + "" : e, t);
+const I = `
+struct VSOut {
+  @builtin(position) pos: vec4<f32>,
+  @location(0) color: vec4<f32>,
+};
+
+@vertex
+fn vs_main(
+  @location(0) position: vec2<f32>,
+  @location(1) color: vec4<f32>
+) -> VSOut {
+  var out: VSOut;
+  out.pos = vec4<f32>(position, 0.0, 1.0);
+  out.color = color;
+  return out;
+}
+
+@fragment
+fn fs_main(in: VSOut) -> @location(0) vec4<f32> {
+  return in.color;
+}
+`;
+function O(s, e) {
+  const t = s.createShaderModule({ code: I }), i = 6 * 4;
+  return { pipeline: s.createRenderPipeline({
+    layout: "auto",
+    vertex: {
+      module: t,
+      entryPoint: "vs_main",
+      buffers: [
+        {
+          arrayStride: i,
+          attributes: [
+            { shaderLocation: 0, offset: 0, format: "float32x2" },
+            { shaderLocation: 1, offset: 2 * 4, format: "float32x4" }
+          ]
+        }
+      ]
+    },
+    fragment: {
+      module: t,
+      entryPoint: "fs_main",
+      targets: [{ format: e }]
+    },
+    primitive: {
+      topology: "triangle-list",
+      cullMode: "none"
+    }
+  }), vertexStride: i };
+}
+const D = `
+// Uniform buffer for transforms and color
+struct Uniforms {
+  scale: vec2<f32>,
+  translate: vec2<f32>,
+  color: vec4<f32>,
+};
+
+@group(0) @binding(0)
+var<uniform> uniforms: Uniforms;
+
+struct VSInput {
+  @location(0) position: vec2<f32>,
+};
+
+struct VSOutput {
+  @builtin(position) pos: vec4<f32>,
+};
+
+@vertex
+fn vs_main(in: VSInput) -> VSOutput {
+  var out: VSOutput;
+  let transformed = in.position * uniforms.scale + uniforms.translate;
+  out.pos = vec4<f32>(transformed, 0.0, 1.0);
+  return out;
+}
+
+@fragment
+fn fs_main(in: VSOutput) -> @location(0) vec4<f32> {
+  return uniforms.color;
+}
+`, S = 2 * 4, z = 32;
+function V(s, e) {
+  const t = s.createShaderModule({ code: D }), i = globalThis.GPUShaderStage, r = globalThis.GPUBufferUsage, a = s.createBindGroupLayout({
+    entries: [
+      {
+        binding: 0,
+        visibility: i.VERTEX | i.FRAGMENT,
+        buffer: { type: "uniform" }
+      }
+    ]
+  }), n = s.createBuffer({
+    size: z,
+    usage: r.UNIFORM | r.COPY_DST
+  }), o = s.createBindGroup({
+    layout: a,
+    entries: [
+      {
+        binding: 0,
+        resource: { buffer: n }
+      }
+    ]
+  }), u = s.createPipelineLayout({
+    bindGroupLayouts: [a]
+  });
+  return {
+    pipeline: s.createRenderPipeline({
+      layout: u,
+      vertex: {
+        module: t,
+        entryPoint: "vs_main",
+        buffers: [
+          {
+            arrayStride: S,
+            attributes: [
+              { shaderLocation: 0, offset: 0, format: "float32x2" }
+            ]
+          }
+        ]
+      },
+      fragment: {
+        module: t,
+        entryPoint: "fs_main",
+        targets: [
+          {
+            format: e,
+            blend: {
+              color: {
+                srcFactor: "src-alpha",
+                dstFactor: "one-minus-src-alpha",
+                operation: "add"
+              },
+              alpha: {
+                srcFactor: "one",
+                dstFactor: "one-minus-src-alpha",
+                operation: "add"
+              }
+            }
+          }
+        ]
+      },
+      primitive: {
+        topology: "line-strip",
+        stripIndexFormat: void 0
+      }
+    }),
+    bindGroupLayout: a,
+    uniformBuffer: n,
+    bindGroup: o,
+    vertexStride: S
+  };
+}
+function k(s, e, t) {
+  const i = new Float32Array([
+    t.scale[0],
+    t.scale[1],
+    t.translate[0],
+    t.translate[1],
+    t.color[0],
+    t.color[1],
+    t.color[2],
+    t.color[3]
+  ]);
+  s.queue.writeBuffer(e, 0, i);
+}
+const W = `
+// Uniform buffer for transforms, color, point properties
+struct Uniforms {
+  scale: vec2<f32>,
+  translate: vec2<f32>,
+  color: vec4<f32>,
+  pointSize: f32,
+  symbol: i32,
+  viewport: vec2<f32>, // viewport dimensions for proper sizing
+};
+
+@group(0) @binding(0)
+var<uniform> uniforms: Uniforms;
+
+struct VSInput {
+  @location(0) position: vec2<f32>,  // point center position
+  @location(1) quadOffset: vec2<f32>, // quad vertex offset (-1 to 1)
+};
+
+struct VSOutput {
+  @builtin(position) pos: vec4<f32>,
+  @location(0) uv: vec2<f32>, // -0.5 to 0.5 for SDF
+};
+
+@vertex
+fn vs_main(in: VSInput) -> VSOutput {
+  var out: VSOutput;
+  
+  // Transform point position to NDC
+  let transformed = in.position * uniforms.scale + uniforms.translate;
+  
+  // Calculate point size in NDC
+  let pointSizeNDC = vec2<f32>(
+    uniforms.pointSize / uniforms.viewport.x * 2.0,
+    uniforms.pointSize / uniforms.viewport.y * 2.0
+  );
+  
+  // Apply quad offset
+  let offset = in.quadOffset * pointSizeNDC * 0.5;
+  
+  out.pos = vec4<f32>(transformed + offset, 0.0, 1.0);
+  out.uv = in.quadOffset * 0.5; // -0.5 to 0.5
+  
+  return out;
+}
+
+// SDF functions
+fn sdCircle(p: vec2<f32>, r: f32) -> f32 {
+  return length(p) - r;
+}
+
+fn sdBox(p: vec2<f32>, b: vec2<f32>) -> f32 {
+  let d = abs(p) - b;
+  return length(max(d, vec2<f32>(0.0))) + min(max(d.x, d.y), 0.0);
+}
+
+fn sdDiamond(p: vec2<f32>, r: f32) -> f32 {
+  return (abs(p.x) + abs(p.y)) - r;
+}
+
+fn sdTriangle(p_in: vec2<f32>, r: f32) -> f32 {
+  let k = sqrt(3.0);
+  var p = p_in;
+  p.x = abs(p.x) - r;
+  p.y = p.y + r / k;
+  if (p.x + k * p.y > 0.0) {
+    p = vec2<f32>(p.x - k * p.y, -k * p.x - p.y) / 2.0;
+  }
+  p.x = p.x - clamp(p.x, -2.0 * r, 0.0);
+  return -length(p) * sign(p.y);
+}
+
+fn sdCross(p: vec2<f32>, r: f32, thickness: f32) -> f32 {
+  let d = abs(p);
+  let s1 = sdBox(d, vec2<f32>(r, thickness));
+  let s2 = sdBox(d, vec2<f32>(thickness, r));
+  return min(s1, s2);
+}
+
+fn sdX(p: vec2<f32>, r: f32, thickness: f32) -> f32 {
+  let c = cos(0.785398);
+  let s = sin(0.785398);
+  let m = mat2x2<f32>(c, -s, s, c);
+  return sdCross(m * p, r, thickness);
+}
+
+fn sdStar(p_in: vec2<f32>, r: f32, rf: f32) -> f32 {
+  let k1 = vec2<f32>(0.80901699, -0.58778525);
+  let k2 = vec2<f32>(-k1.x, k1.y);
+  var p = p_in;
+  p.x = abs(p.x);
+  p = p - 2.0 * max(dot(k1, p), 0.0) * k1;
+  p = p - 2.0 * max(dot(k2, p), 0.0) * k2;
+  p.x = abs(p.x);
+  p.y = p.y - r;
+  let ba = rf * vec2<f32>(-k1.y, k1.x) - vec2<f32>(0.0, 1.0);
+  let h = clamp(dot(p, ba) / dot(ba, ba), 0.0, r);
+  return length(p - ba * h) * sign(p.y * ba.x - p.x * ba.y);
+}
+
+@fragment
+fn fs_main(in: VSOutput) -> @location(0) vec4<f32> {
+  var d: f32 = 0.0;
+  
+  if (uniforms.symbol == 0) {
+    d = sdCircle(in.uv, 0.45);
+  } else if (uniforms.symbol == 1) {
+    d = sdBox(in.uv, vec2<f32>(0.35));
+  } else if (uniforms.symbol == 2) {
+    d = sdDiamond(in.uv, 0.45);
+  } else if (uniforms.symbol == 3) {
+    d = sdTriangle(vec2<f32>(in.uv.x, in.uv.y + 0.1), 0.4);
+  } else if (uniforms.symbol == 4) {
+    d = sdTriangle(vec2<f32>(in.uv.x, -in.uv.y + 0.1), 0.4);
+  } else if (uniforms.symbol == 5) {
+    d = sdCross(in.uv, 0.45, 0.15);
+  } else if (uniforms.symbol == 6) {
+    d = sdX(in.uv, 0.45, 0.15);
+  } else if (uniforms.symbol == 7) {
+    d = sdStar(in.uv, 0.45, 0.4);
+  }
+  
+  if (d > 0.02) {
+    discard;
+  }
+  
+  let alpha = 1.0 - smoothstep(0.0, 0.02, d);
+  return vec4<f32>(uniforms.color.rgb, uniforms.color.a * alpha);
+}
+`, A = 2 * 4, N = 48, C = new Float32Array([
+  -1,
+  -1,
+  // bottom-left
+  1,
+  -1,
+  // bottom-right
+  -1,
+  1,
+  // top-left
+  -1,
+  1,
+  // top-left
+  1,
+  -1,
+  // bottom-right
+  1,
+  1
+  // top-right
+]);
+function q(s, e) {
+  const t = s.createShaderModule({ code: W }), i = globalThis.GPUShaderStage, r = globalThis.GPUBufferUsage, a = s.createBindGroupLayout({
+    entries: [
+      {
+        binding: 0,
+        visibility: i.VERTEX | i.FRAGMENT,
+        buffer: { type: "uniform" }
+      }
+    ]
+  }), n = s.createBuffer({
+    size: N,
+    usage: r.UNIFORM | r.COPY_DST
+  }), o = s.createBuffer({
+    size: C.byteLength,
+    usage: r.VERTEX | r.COPY_DST,
+    mappedAtCreation: !0
+  });
+  new Float32Array(o.getMappedRange()).set(C), o.unmap();
+  const u = s.createBindGroup({
+    layout: a,
+    entries: [
+      {
+        binding: 0,
+        resource: { buffer: n }
+      }
+    ]
+  }), l = s.createPipelineLayout({
+    bindGroupLayouts: [a]
+  });
+  return {
+    pipeline: s.createRenderPipeline({
+      layout: l,
+      vertex: {
+        module: t,
+        entryPoint: "vs_main",
+        buffers: [
+          // Point positions (instanced)
+          {
+            arrayStride: A,
+            stepMode: "instance",
+            attributes: [
+              { shaderLocation: 0, offset: 0, format: "float32x2" }
+            ]
+          },
+          // Quad vertex offsets (per-vertex)
+          {
+            arrayStride: 8,
+            // 2 floats
+            stepMode: "vertex",
+            attributes: [
+              { shaderLocation: 1, offset: 0, format: "float32x2" }
+            ]
+          }
+        ]
+      },
+      fragment: {
+        module: t,
+        entryPoint: "fs_main",
+        targets: [
+          {
+            format: e,
+            blend: {
+              color: {
+                srcFactor: "src-alpha",
+                dstFactor: "one-minus-src-alpha",
+                operation: "add"
+              },
+              alpha: {
+                srcFactor: "one",
+                dstFactor: "one-minus-src-alpha",
+                operation: "add"
+              }
+            }
+          }
+        ]
+      },
+      primitive: {
+        topology: "triangle-list",
+        cullMode: "none"
+      }
+    }),
+    bindGroupLayout: a,
+    uniformBuffer: n,
+    bindGroup: u,
+    quadBuffer: o,
+    vertexStride: A
+  };
+}
+function Y(s, e, t) {
+  const i = new Float32Array([
+    t.scale[0],
+    t.scale[1],
+    t.translate[0],
+    t.translate[1],
+    t.color[0],
+    t.color[1],
+    t.color[2],
+    t.color[3],
+    t.pointSize,
+    t.symbol,
+    // Will be cast to i32 in shader via bitcast
+    t.viewport[0],
+    t.viewport[1]
+  ]);
+  s.queue.writeBuffer(e, 0, i);
+}
+const X = {
+  circle: 0,
+  square: 1,
+  diamond: 2,
+  triangle: 3,
+  triangleDown: 4,
+  cross: 5,
+  x: 6,
+  star: 7
+}, $ = 32;
+function H(s, e) {
+  const t = s.createShaderModule({ code: D }), i = globalThis.GPUShaderStage, r = globalThis.GPUBufferUsage, a = s.createBindGroupLayout({
+    entries: [
+      {
+        binding: 0,
+        visibility: i.VERTEX | i.FRAGMENT,
+        buffer: { type: "uniform" }
+      }
+    ]
+  }), n = s.createBuffer({
+    size: $,
+    usage: r.UNIFORM | r.COPY_DST
+  }), o = s.createBindGroup({
+    layout: a,
+    entries: [
+      {
+        binding: 0,
+        resource: { buffer: n }
+      }
+    ]
+  }), u = s.createPipelineLayout({
+    bindGroupLayouts: [a]
+  });
+  return {
+    pipeline: s.createRenderPipeline({
+      layout: u,
+      vertex: {
+        module: t,
+        entryPoint: "vs_main",
+        buffers: [
+          {
+            arrayStride: S,
+            attributes: [
+              { shaderLocation: 0, offset: 0, format: "float32x2" }
+            ]
+          }
+        ]
+      },
+      fragment: {
+        module: t,
+        entryPoint: "fs_main",
+        targets: [
+          {
+            format: e,
+            blend: {
+              color: {
+                srcFactor: "src-alpha",
+                dstFactor: "one-minus-src-alpha",
+                operation: "add"
+              },
+              alpha: {
+                srcFactor: "one",
+                dstFactor: "one-minus-src-alpha",
+                operation: "add"
+              }
+            }
+          }
+        ]
+      },
+      primitive: {
+        topology: "triangle-strip",
+        // Key difference from line pipeline
+        stripIndexFormat: void 0
+      }
+    }),
+    bindGroupLayout: a,
+    uniformBuffer: n,
+    bindGroup: o,
+    vertexStride: S
+  };
+}
+function K(s, e, t) {
+  const i = new Float32Array([
+    t.scale[0],
+    t.scale[1],
+    t.translate[0],
+    t.translate[1],
+    t.color[0],
+    t.color[1],
+    t.color[2],
+    t.color[3]
+  ]);
+  s.queue.writeBuffer(e, 0, i);
+}
+const Z = `
+// Uniform buffer for transforms and value range
+struct Uniforms {
+  scale: vec2<f32>,
+  translate: vec2<f32>,
+  minValue: f32,
+  maxValue: f32,
+  _padding: vec2<f32>,
+};
+
+@group(0) @binding(0)
+var<uniform> uniforms: Uniforms;
+
+@group(0) @binding(1)
+var colormapSampler: sampler;
+
+@group(0) @binding(2)
+var colormapTexture: texture_1d<f32>;
+
+struct VSInput {
+  @location(0) position: vec2<f32>,
+  @location(1) value: f32,
+};
+
+struct VSOutput {
+  @builtin(position) pos: vec4<f32>,
+  @location(0) value: f32,
+};
+
+@vertex
+fn vs_main(in: VSInput) -> VSOutput {
+  var out: VSOutput;
+  let transformed = in.position * uniforms.scale + uniforms.translate;
+  out.pos = vec4<f32>(transformed, 0.0, 1.0);
+  out.value = in.value;
+  return out;
+}
+
+@fragment
+fn fs_main(in: VSOutput) -> @location(0) vec4<f32> {
+  let range = uniforms.maxValue - uniforms.minValue;
+  var t: f32;
+  if (range != 0.0) {
+    t = (in.value - uniforms.minValue) / range;
+  } else {
+    t = 0.0;
+  }
+  t = clamp(t, 0.0, 1.0);
+  
+  return textureSample(colormapTexture, colormapSampler, t);
+}
+`, G = 3 * 4, Q = 32;
+function j(s, e) {
+  const t = s.createShaderModule({ code: Z }), i = globalThis.GPUShaderStage, r = globalThis.GPUBufferUsage, a = s.createBindGroupLayout({
+    entries: [
+      {
+        binding: 0,
+        visibility: i.VERTEX | i.FRAGMENT,
+        buffer: { type: "uniform" }
+      },
+      {
+        binding: 1,
+        visibility: i.FRAGMENT,
+        sampler: {}
+      },
+      {
+        binding: 2,
+        visibility: i.FRAGMENT,
+        texture: {
+          sampleType: "float",
+          viewDimension: "1d"
+        }
+      }
+    ]
+  }), n = s.createBuffer({
+    size: Q,
+    usage: r.UNIFORM | r.COPY_DST
+  }), o = s.createSampler({
+    magFilter: "linear",
+    minFilter: "linear",
+    addressModeU: "clamp-to-edge"
+  }), u = s.createPipelineLayout({
+    bindGroupLayouts: [a]
+  });
+  return {
+    pipeline: s.createRenderPipeline({
+      layout: u,
+      vertex: {
+        module: t,
+        entryPoint: "vs_main",
+        buffers: [
+          {
+            arrayStride: G,
+            attributes: [
+              { shaderLocation: 0, offset: 0, format: "float32x2" },
+              // position
+              { shaderLocation: 1, offset: 8, format: "float32" }
+              // value
+            ]
+          }
+        ]
+      },
+      fragment: {
+        module: t,
+        entryPoint: "fs_main",
+        targets: [
+          {
+            format: e,
+            blend: {
+              color: {
+                srcFactor: "src-alpha",
+                dstFactor: "one-minus-src-alpha",
+                operation: "add"
+              },
+              alpha: {
+                srcFactor: "one",
+                dstFactor: "one-minus-src-alpha",
+                operation: "add"
+              }
+            }
+          }
+        ]
+      },
+      primitive: {
+        topology: "triangle-list",
+        cullMode: "none"
+      }
+    }),
+    bindGroupLayout: a,
+    uniformBuffer: n,
+    sampler: o,
+    vertexStride: G
+  };
+}
+function J(s, e, t, i, r) {
+  return s.createBindGroup({
+    layout: e,
+    entries: [
+      { binding: 0, resource: { buffer: t } },
+      { binding: 1, resource: i },
+      { binding: 2, resource: r.createView() }
+    ]
+  });
+}
+function ee(s, e, t) {
+  const i = new Float32Array([
+    t.scale[0],
+    t.scale[1],
+    t.translate[0],
+    t.translate[1],
+    t.minValue,
+    t.maxValue,
+    0,
+    // padding
+    0
+    // padding
+  ]);
+  s.queue.writeBuffer(e, 0, i);
+}
+function te(s) {
+  const e = s.xMax - s.xMin, t = s.yMax - s.yMin, i = e > 0 ? 2 / e : 1, r = t > 0 ? 2 / t : 1, a = -1 - s.xMin * i, n = -1 - s.yMin * r;
+  return {
+    scale: [i, r],
+    translate: [a, n]
+  };
+}
+function ie(s) {
+  const e = (s == null ? void 0 : s.color) ?? [1, 0, 0.3, 1], t = (s == null ? void 0 : s.opacity) ?? 1;
+  return Array.isArray(e) ? [e[0], e[1], e[2], (e[3] ?? 1) * t] : [1, 0, 0.3, t];
+}
+class w {
+  constructor(e, t = {}) {
+    c(this, "info");
+    c(this, "canvas");
+    c(this, "opts");
+    c(this, "viewport", null);
+    c(this, "adapter");
+    c(this, "device");
+    c(this, "context");
+    c(this, "format", null);
+    c(this, "buffers", /* @__PURE__ */ new Map());
+    c(this, "textures", /* @__PURE__ */ new Map());
+    // Pipelines for different draw types
+    c(this, "trianglePipeline", null);
+    c(this, "linePipeline", null);
+    c(this, "pointPipeline", null);
+    c(this, "bandPipeline", null);
+    c(this, "heatmapPipeline", null);
+    // Heatmap bind groups (per texture)
+    c(this, "heatmapBindGroups", /* @__PURE__ */ new Map());
+    this.canvas = e, this.opts = t, this.info = {
+      type: "webgpu",
+      available: w.isSupported()
+    };
+  }
+  static isSupported() {
+    return typeof globalThis.navigator < "u" && typeof globalThis.navigator.gpu < "u";
+  }
+  async init() {
+    if (!this.info.available)
+      throw new Error("[gpu] WebGPU not supported");
+    const e = globalThis.navigator.gpu;
+    if (this.adapter = await e.requestAdapter({
+      powerPreference: this.opts.powerPreference ?? "high-performance"
+    }), !this.adapter)
+      throw new Error("[gpu] Failed to request WebGPU adapter");
+    this.device = await this.adapter.requestDevice();
+    const t = this.canvas.getContext("webgpu");
+    if (!t)
+      throw new Error("[gpu] Failed to get WebGPU canvas context");
+    this.context = t;
+    const i = this.opts.preferredFormat ?? (e.getPreferredCanvasFormat ? e.getPreferredCanvasFormat() : "bgra8unorm");
+    this.format = i, this.context.configure({
+      device: this.device,
+      format: i,
+      alphaMode: "premultiplied"
+    });
+  }
+  setViewport(e) {
+    this.viewport = e;
+    const t = Math.max(1, Math.floor(e.width * e.dpr)), i = Math.max(1, Math.floor(e.height * e.dpr));
+    this.canvas.width !== t && (this.canvas.width = t), this.canvas.height !== i && (this.canvas.height = i);
+  }
+  createOrUpdateBuffer(e, t, i) {
+    if (!this.device)
+      throw new Error("[gpu] WebGPUBackend not initialized");
+    const r = (i == null ? void 0 : i.usage) ?? "vertex", a = globalThis.GPUBufferUsage;
+    if (!a)
+      throw new Error(
+        "[gpu] GPUBufferUsage not available (missing WebGPU runtime)"
+      );
+    const n = r === "index" ? a.INDEX | a.COPY_DST : r === "uniform" ? a.UNIFORM | a.COPY_DST : a.VERTEX | a.COPY_DST, o = t.byteLength;
+    let u = this.buffers.get(e);
+    if (!u || u.size < o) {
+      if (u)
+        try {
+          u.destroy();
+        } catch {
+        }
+      u = this.device.createBuffer({
+        size: Math.max(4, o),
+        usage: n
+      }), this.buffers.set(e, u);
+    }
+    this.device.queue.writeBuffer(
+      u,
+      0,
+      t.buffer,
+      t.byteOffset,
+      t.byteLength
+    );
+  }
+  deleteBuffer(e) {
+    const t = this.buffers.get(e);
+    if (t) {
+      try {
+        t.destroy();
+      } catch {
+      }
+      this.buffers.delete(e);
+    }
+  }
+  createOrUpdateTexture1D(e, t, i) {
+    if (!this.device)
+      throw new Error("[gpu] WebGPUBackend not initialized");
+    const r = (i == null ? void 0 : i.width) ?? Math.floor(t.length / 4), a = (i == null ? void 0 : i.format) ?? "rgba8unorm", n = globalThis.GPUTextureUsage;
+    if (!n)
+      throw new Error(
+        "[gpu] GPUTextureUsage not available (missing WebGPU runtime)"
+      );
+    let o = this.textures.get(e);
+    o || (o = this.device.createTexture({
+      size: { width: r, height: 1, depthOrArrayLayers: 1 },
+      format: a,
+      dimension: "1d",
+      usage: n.TEXTURE_BINDING | n.COPY_DST
+    }), this.textures.set(e, o), this.heatmapBindGroups.delete(e)), this.device.queue.writeTexture(
+      { texture: o },
+      t,
+      { bytesPerRow: r * 4 },
+      { width: r, height: 1, depthOrArrayLayers: 1 }
+    );
+  }
+  deleteTexture(e) {
+    const t = this.textures.get(e);
+    if (t) {
+      try {
+        t.destroy();
+      } catch {
+      }
+      this.textures.delete(e), this.heatmapBindGroups.delete(e);
+    }
+  }
+  /**
+   * Initialize all pipelines lazily
+   */
+  ensurePipelines() {
+    this.trianglePipeline || (this.trianglePipeline = O(this.device, this.format)), this.linePipeline || (this.linePipeline = V(this.device, this.format)), this.pointPipeline || (this.pointPipeline = q(this.device, this.format)), this.bandPipeline || (this.bandPipeline = H(this.device, this.format)), this.heatmapPipeline || (this.heatmapPipeline = j(this.device, this.format));
+  }
+  render(e, t) {
+    if (!this.device || !this.context || !this.format)
+      throw new Error("[gpu] WebGPUBackend not initialized");
+    this.viewport || this.setViewport(t.viewport), this.ensurePipelines();
+    const i = this.device.createCommandEncoder(), r = this.context.getCurrentTexture().createView(), a = i.beginRenderPass({
+      colorAttachments: [
+        {
+          view: r,
+          clearValue: {
+            r: t.clearColor[0],
+            g: t.clearColor[1],
+            b: t.clearColor[2],
+            a: t.clearColor[3]
+          },
+          loadOp: "clear",
+          storeOp: "store"
+        }
+      ]
+    }), n = { xMin: -1, xMax: 1, yMin: -1, yMax: 1 };
+    for (const o of e.items) {
+      if (!o.visible) continue;
+      const u = this.buffers.get(o.bufferId);
+      u && this.renderDrawCall(a, o, u, n);
+    }
+    a.end(), this.device.queue.submit([i.finish()]);
+  }
+  /**
+   * Render with explicit bounds (for integration with chart system)
+   */
+  renderWithBounds(e, t, i) {
+    if (!this.device || !this.context || !this.format)
+      throw new Error("[gpu] WebGPUBackend not initialized");
+    this.viewport || this.setViewport(t.viewport), this.ensurePipelines();
+    const r = this.device.createCommandEncoder(), a = this.context.getCurrentTexture().createView(), n = r.beginRenderPass({
+      colorAttachments: [
+        {
+          view: a,
+          clearValue: {
+            r: t.clearColor[0],
+            g: t.clearColor[1],
+            b: t.clearColor[2],
+            a: t.clearColor[3]
+          },
+          loadOp: "clear",
+          storeOp: "store"
+        }
+      ]
+    });
+    for (const o of e.items) {
+      if (!o.visible) continue;
+      const u = this.buffers.get(o.bufferId);
+      if (!u) continue;
+      const l = o.yBounds ? { ...i, yMin: o.yBounds.min, yMax: o.yBounds.max } : i;
+      this.renderDrawCall(n, o, u, l);
+    }
+    n.end(), this.device.queue.submit([r.finish()]);
+  }
+  /**
+   * Render a single draw call
+   */
+  renderDrawCall(e, t, i, r) {
+    const a = te(r), n = ie(t.style);
+    switch (t.kind) {
+      case "triangles":
+      case "bar":
+        this.renderSolidTriangles(e, i, t.count, a, n);
+        break;
+      case "line":
+        this.renderLine(e, i, t.count, a, n);
+        break;
+      case "scatter":
+      case "points":
+        this.renderPoints(e, i, t.count, a, n, t.style);
+        break;
+      case "line+scatter":
+        this.renderLine(e, i, t.count, a, n), this.renderPoints(e, i, t.count, a, n, t.style);
+        break;
+      case "step":
+        if (t.stepBufferId && t.stepCount) {
+          const u = this.buffers.get(t.stepBufferId);
+          u && this.renderLine(e, u, t.stepCount, a, n);
+        } else
+          this.renderLine(e, i, t.count, a, n);
+        break;
+      case "step+scatter":
+        if (t.stepBufferId && t.stepCount) {
+          const u = this.buffers.get(t.stepBufferId);
+          u && this.renderLine(e, u, t.stepCount, a, n);
+        } else
+          this.renderLine(e, i, t.count, a, n);
+        this.renderPoints(e, i, t.count, a, n, t.style);
+        break;
+      case "band":
+        const o = [
+          n[0],
+          n[1],
+          n[2],
+          n[3] * 0.4
+        ];
+        this.renderBand(e, i, t.count, a, o);
+        break;
+      case "heatmap":
+        this.renderHeatmap(e, i, t.count, a, t.style, t.textureId);
+        break;
+    }
+  }
+  /** Triangle list with line-pipeline uniforms (xy vertices, uniform color). */
+  renderSolidTriangles(e, t, i, r, a) {
+    k(this.device, this.linePipeline.uniformBuffer, {
+      scale: r.scale,
+      translate: r.translate,
+      color: a
+    }), e.setPipeline(this.linePipeline.pipeline), e.setBindGroup(0, this.linePipeline.bindGroup), e.setVertexBuffer(0, t), e.draw(i);
+  }
+  renderLine(e, t, i, r, a) {
+    k(this.device, this.linePipeline.uniformBuffer, {
+      scale: r.scale,
+      translate: r.translate,
+      color: a
+    }), e.setPipeline(this.linePipeline.pipeline), e.setBindGroup(0, this.linePipeline.bindGroup), e.setVertexBuffer(0, t), e.draw(i);
+  }
+  renderPoints(e, t, i, r, a, n) {
+    var f;
+    const o = ((n == null ? void 0 : n.pointSize) ?? 4) * (((f = this.viewport) == null ? void 0 : f.dpr) ?? 1), u = X[(n == null ? void 0 : n.symbol) ?? "circle"] ?? 0, l = [
+      this.canvas.width,
+      this.canvas.height
+    ];
+    Y(this.device, this.pointPipeline.uniformBuffer, {
+      scale: r.scale,
+      translate: r.translate,
+      color: a,
+      pointSize: o,
+      symbol: u,
+      viewport: l
+    }), e.setPipeline(this.pointPipeline.pipeline), e.setBindGroup(0, this.pointPipeline.bindGroup), e.setVertexBuffer(0, t), e.setVertexBuffer(1, this.pointPipeline.quadBuffer), e.draw(6, i);
+  }
+  renderBand(e, t, i, r, a) {
+    K(this.device, this.bandPipeline.uniformBuffer, {
+      scale: r.scale,
+      translate: r.translate,
+      color: a
+    }), e.setPipeline(this.bandPipeline.pipeline), e.setBindGroup(0, this.bandPipeline.bindGroup), e.setVertexBuffer(0, t), e.draw(i);
+  }
+  renderHeatmap(e, t, i, r, a, n) {
+    if (!n) return;
+    const o = this.textures.get(n);
+    if (!o) return;
+    const u = (a == null ? void 0 : a.zBounds) ?? { min: 0, max: 1 };
+    ee(this.device, this.heatmapPipeline.uniformBuffer, {
+      scale: r.scale,
+      translate: r.translate,
+      minValue: u.min,
+      maxValue: u.max
+    });
+    let l = this.heatmapBindGroups.get(n);
+    l || (l = J(
+      this.device,
+      this.heatmapPipeline.bindGroupLayout,
+      this.heatmapPipeline.uniformBuffer,
+      this.heatmapPipeline.sampler,
+      o
+    ), this.heatmapBindGroups.set(n, l)), e.setPipeline(this.heatmapPipeline.pipeline), e.setBindGroup(0, l), e.setVertexBuffer(0, t), e.draw(i);
+  }
+  destroy() {
+    for (const e of Array.from(this.buffers.keys()))
+      this.deleteBuffer(e);
+    for (const e of Array.from(this.textures.keys()))
+      this.deleteTexture(e);
+    this.trianglePipeline = null, this.linePipeline = null, this.pointPipeline = null, this.bandPipeline = null, this.heatmapPipeline = null, this.heatmapBindGroups.clear(), this.device = void 0, this.adapter = void 0, this.context = void 0, this.format = null;
+  }
+}
+const re = `
+precision highp float;
+attribute vec2 aPosition;
+uniform vec2 uScale;
+uniform vec2 uTranslate;
+
+void main() {
+  vec2 pos = aPosition * uScale + uTranslate;
+  gl_Position = vec4(pos, 0.0, 1.0);
+}
+`, ae = `
+precision highp float;
+uniform vec4 uColor;
+
+void main() {
+  gl_FragColor = uColor;
+}
+`, ne = `
+precision highp float;
+attribute vec2 aPosition;
+uniform vec2 uScale;
+uniform vec2 uTranslate;
+uniform float uPointSize;
+
+void main() {
+  vec2 pos = aPosition * uScale + uTranslate;
+  gl_Position = vec4(pos, 0.0, 1.0);
+  gl_PointSize = uPointSize;
+}
+`, se = `
+precision highp float;
+uniform vec4 uColor;
+uniform int uSymbol;
+
+float sdCircle(vec2 p, float r) {
+  return length(p) - r;
+}
+
+float sdBox(vec2 p, vec2 b) {
+  vec2 d = abs(p) - b;
+  return length(max(d, 0.0)) + min(max(d.x, d.y), 0.0);
+}
+
+float sdTriangle(vec2 p, float r) {
+  const float k = sqrt(3.0);
+  p.x = abs(p.x) - r;
+  p.y = p.y + r / k;
+  if (p.x + k * p.y > 0.0) p = vec2(p.x - k * p.y, -k * p.x - p.y) / 2.0;
+  p.x -= clamp(p.x, -2.0 * r, 0.0);
+  return -length(p) * sign(p.y);
+}
+
+float sdDiamond(vec2 p, float r) {
+  return (abs(p.x) + abs(p.y)) - r;
+}
+
+float sdCross(vec2 p, float r, float thickness) {
+  vec2 d = abs(p);
+  float s1 = sdBox(d, vec2(r, thickness));
+  float s2 = sdBox(d, vec2(thickness, r));
+  return min(s1, s2);
+}
+
+float sdX(vec2 p, float r, float thickness) {
+  float c = cos(0.785398);
+  float s = sin(0.785398);
+  mat2 m = mat2(c, -s, s, c);
+  return sdCross(m * p, r, thickness);
+}
+
+float sdStar(vec2 p, float r, float rf) {
+  const vec2 k1 = vec2(0.80901699, -0.58778525);
+  const vec2 k2 = vec2(-k1.x, k1.y);
+  p.x = abs(p.x);
+  p -= 2.0 * max(dot(k1, p), 0.0) * k1;
+  p -= 2.0 * max(dot(k2, p), 0.0) * k2;
+  p.x = abs(p.x);
+  p.y -= r;
+  vec2 ba = rf * vec2(-k1.y, k1.x) - vec2(0, 1);
+  float h = clamp(dot(p, ba) / dot(ba, ba), 0.0, r);
+  return length(p - ba * h) * sign(p.y * ba.x - p.x * ba.y);
+}
+
+void main() {
+  vec2 p = gl_PointCoord - vec2(0.5);
+  float d = 0.0;
+
+  if (uSymbol == 0) {
+    d = sdCircle(p, 0.45);
+  } else if (uSymbol == 1) {
+    d = sdBox(p, vec2(0.35));
+  } else if (uSymbol == 2) {
+    d = sdDiamond(p, 0.45);
+  } else if (uSymbol == 3) {
+    d = sdTriangle(vec2(p.x, p.y + 0.1), 0.4);
+  } else if (uSymbol == 4) {
+    d = sdTriangle(vec2(p.x, -p.y + 0.1), 0.4);
+  } else if (uSymbol == 5) {
+    d = sdCross(p, 0.45, 0.15);
+  } else if (uSymbol == 6) {
+    d = sdX(p, 0.45, 0.15);
+  } else if (uSymbol == 7) {
+    d = sdStar(p, 0.45, 0.4);
+  }
+
+  if (d > 0.02) discard;
+
+  float alpha = 1.0 - smoothstep(0.0, 0.02, d);
+  gl_FragColor = vec4(uColor.rgb, uColor.a * alpha);
+}
+`, oe = `
+precision highp float;
+attribute vec2 aPosition;
+attribute float aValue;
+uniform vec2 uScale;
+uniform vec2 uTranslate;
+varying float vValue;
+
+void main() {
+  gl_Position = vec4(aPosition * uScale + uTranslate, 0.0, 1.0);
+  vValue = aValue;
+}
+`, ue = `
+precision highp float;
+varying float vValue;
+uniform float uMinValue;
+uniform float uMaxValue;
+uniform sampler2D uColormap;
+
+void main() {
+  float range = uMaxValue - uMinValue;
+  float t = (vValue - uMinValue) / (range != 0.0 ? range : 1.0);
+  t = clamp(t, 0.0, 1.0);
+  gl_FragColor = texture2D(uColormap, vec2(t, 0.5));
+}
+`;
+function E(s, e, t) {
+  const i = s.createShader(e);
+  if (!i)
+    throw new Error("[WebGL] Failed to create shader");
+  if (s.shaderSource(i, t), s.compileShader(i), !s.getShaderParameter(i, s.COMPILE_STATUS)) {
+    const r = s.getShaderInfoLog(i);
+    throw s.deleteShader(i), new Error(`[WebGL] Shader compilation error: ${r}`);
+  }
+  return i;
+}
+function le(s, e, t) {
+  const i = s.createProgram();
+  if (!i)
+    throw new Error("[WebGL] Failed to create program");
+  if (s.attachShader(i, e), s.attachShader(i, t), s.linkProgram(i), !s.getProgramParameter(i, s.LINK_STATUS)) {
+    const r = s.getProgramInfoLog(i);
+    throw s.deleteProgram(i), new Error(`[WebGL] Program link error: ${r}`);
+  }
+  return i;
+}
+function T(s, e, t, i, r) {
+  const a = E(s, s.VERTEX_SHADER, e), n = E(s, s.FRAGMENT_SHADER, t), o = le(s, a, n);
+  s.deleteShader(a), s.deleteShader(n);
+  const u = {};
+  for (const f of i)
+    u[f] = s.getAttribLocation(o, f);
+  const l = {};
+  for (const f of r)
+    l[f] = s.getUniformLocation(o, f);
+  return { program: o, attributes: u, uniforms: l };
+}
+function ce(s) {
+  const e = T(
+    s,
+    re,
+    ae,
+    ["aPosition"],
+    ["uScale", "uTranslate", "uColor"]
+  ), t = T(
+    s,
+    ne,
+    se,
+    ["aPosition"],
+    ["uScale", "uTranslate", "uColor", "uPointSize", "uSymbol"]
+  ), i = T(
+    s,
+    oe,
+    ue,
+    ["aPosition", "aValue"],
+    ["uScale", "uTranslate", "uMinValue", "uMaxValue", "uColormap"]
+  );
+  return { line: e, point: t, heatmap: i };
+}
+function pe(s, e) {
+  s.deleteProgram(e.line.program), s.deleteProgram(e.point.program), s.deleteProgram(e.heatmap.program);
+}
+const fe = {
+  circle: 0,
+  square: 1,
+  diamond: 2,
+  triangle: 3,
+  triangleDown: 4,
+  cross: 5,
+  x: 6,
+  star: 7
+};
+function de(s) {
+  const e = s.xMax - s.xMin, t = s.yMax - s.yMin, i = e > 0 ? 2 / e : 1, r = t > 0 ? 2 / t : 1, a = -1 - s.xMin * i, n = -1 - s.yMin * r;
+  return {
+    scale: [i, r],
+    translate: [a, n]
+  };
+}
+function he(s) {
+  const e = (s == null ? void 0 : s.color) ?? [1, 0, 0.3, 1], t = (s == null ? void 0 : s.opacity) ?? 1;
+  return Array.isArray(e) ? [e[0], e[1], e[2], (e[3] ?? 1) * t] : [1, 0, 0.3, t];
+}
+class P {
+  constructor(e, t = {}) {
+    c(this, "info");
+    c(this, "canvas");
+    c(this, "opts");
+    c(this, "gl", null);
+    c(this, "viewport", null);
+    c(this, "dpr", 1);
+    c(this, "programs", null);
+    c(this, "buffers", /* @__PURE__ */ new Map());
+    c(this, "textures", /* @__PURE__ */ new Map());
+    this.canvas = e, this.opts = t, this.info = {
+      type: "webgl",
+      available: P.isSupported()
+    };
+  }
+  static isSupported() {
+    if (typeof document > "u") return !1;
+    try {
+      const e = document.createElement("canvas");
+      return !!(e.getContext("webgl") || e.getContext("experimental-webgl"));
+    } catch {
+      return !1;
+    }
+  }
+  async init() {
+    if (!this.info.available)
+      throw new Error("[gpu] WebGL not supported");
+    const e = this.canvas.getContext("webgl", {
+      alpha: !0,
+      antialias: this.opts.antialias ?? !0,
+      preserveDrawingBuffer: this.opts.preserveDrawingBuffer ?? !0,
+      powerPreference: this.opts.powerPreference ?? "high-performance"
+    });
+    if (!e)
+      throw new Error("[gpu] Failed to get WebGL context");
+    this.gl = e, e.enable(e.BLEND), e.blendFunc(e.SRC_ALPHA, e.ONE_MINUS_SRC_ALPHA), this.programs = ce(e);
+  }
+  setViewport(e) {
+    this.viewport = e, this.dpr = e.dpr;
+    const t = Math.max(1, Math.floor(e.width * e.dpr)), i = Math.max(1, Math.floor(e.height * e.dpr));
+    this.canvas.width !== t && (this.canvas.width = t), this.canvas.height !== i && (this.canvas.height = i), this.gl && this.gl.viewport(0, 0, t, i);
+  }
+  createOrUpdateBuffer(e, t, i) {
+    if (!this.gl)
+      throw new Error("[gpu] WebGLBackend not initialized");
+    const r = this.gl;
+    let a = this.buffers.get(e);
+    a || (a = r.createBuffer(), this.buffers.set(e, a));
+    const n = (i == null ? void 0 : i.usage) === "index" ? r.ELEMENT_ARRAY_BUFFER : r.ARRAY_BUFFER;
+    r.bindBuffer(n, a), r.bufferData(n, t, r.DYNAMIC_DRAW), r.bindBuffer(n, null);
+  }
+  deleteBuffer(e) {
+    if (!this.gl) return;
+    const t = this.buffers.get(e);
+    t && (this.gl.deleteBuffer(t), this.buffers.delete(e));
+  }
+  createOrUpdateTexture1D(e, t, i) {
+    if (!this.gl)
+      throw new Error("[gpu] WebGLBackend not initialized");
+    const r = this.gl, a = (i == null ? void 0 : i.width) ?? Math.floor(t.length / 4);
+    let n = this.textures.get(e);
+    n || (n = r.createTexture(), this.textures.set(e, n)), r.bindTexture(r.TEXTURE_2D, n), r.texImage2D(r.TEXTURE_2D, 0, r.RGBA, a, 1, 0, r.RGBA, r.UNSIGNED_BYTE, t), r.texParameteri(r.TEXTURE_2D, r.TEXTURE_MIN_FILTER, r.LINEAR), r.texParameteri(r.TEXTURE_2D, r.TEXTURE_MAG_FILTER, r.LINEAR), r.texParameteri(r.TEXTURE_2D, r.TEXTURE_WRAP_S, r.CLAMP_TO_EDGE), r.texParameteri(r.TEXTURE_2D, r.TEXTURE_WRAP_T, r.CLAMP_TO_EDGE), r.bindTexture(r.TEXTURE_2D, null);
+  }
+  deleteTexture(e) {
+    if (!this.gl) return;
+    const t = this.textures.get(e);
+    t && (this.gl.deleteTexture(t), this.textures.delete(e));
+  }
+  render(e, t) {
+    this.renderWithBounds(e, t, { xMin: -1, xMax: 1, yMin: -1, yMax: 1 });
+  }
+  renderWithBounds(e, t, i) {
+    if (!this.gl || !this.programs)
+      throw new Error("[gpu] WebGLBackend not initialized");
+    const r = this.gl;
+    this.viewport || this.setViewport(t.viewport), r.clearColor(
+      t.clearColor[0],
+      t.clearColor[1],
+      t.clearColor[2],
+      t.clearColor[3]
+    ), r.clear(r.COLOR_BUFFER_BIT);
+    for (const a of e.items) {
+      if (!a.visible) continue;
+      const n = this.buffers.get(a.bufferId);
+      if (!n) continue;
+      const o = a.yBounds ? { ...i, yMin: a.yBounds.min, yMax: a.yBounds.max } : i;
+      this.renderDrawCall(a, n, o);
+    }
+  }
+  renderDrawCall(e, t, i) {
+    const r = de(i), a = he(e.style);
+    switch (e.kind) {
+      case "line":
+      case "step":
+        this.renderLine(t, e.count, r, a);
+        break;
+      case "scatter":
+      case "points":
+        this.renderPoints(t, e.count, r, a, e.style);
+        break;
+      case "line+scatter":
+        this.renderLine(t, e.count, r, a), this.renderPoints(t, e.count, r, a, e.style);
+        break;
+      case "step+scatter":
+        if (e.stepBufferId && e.stepCount) {
+          const o = this.buffers.get(e.stepBufferId);
+          o && this.renderLine(o, e.stepCount, r, a);
+        } else
+          this.renderLine(t, e.count, r, a);
+        this.renderPoints(t, e.count, r, a, e.style);
+        break;
+      case "band":
+        const n = [
+          a[0],
+          a[1],
+          a[2],
+          a[3] * 0.4
+        ];
+        this.renderBand(t, e.count, r, n);
+        break;
+      case "triangles":
+      case "bar":
+        this.renderTriangles(t, e.count, r, a);
+        break;
+      case "heatmap":
+        this.renderHeatmap(t, e.count, r, e.style, e.textureId);
+        break;
+    }
+  }
+  renderLine(e, t, i, r) {
+    const a = this.gl, n = this.programs.line;
+    a.useProgram(n.program), a.bindBuffer(a.ARRAY_BUFFER, e), a.enableVertexAttribArray(n.attributes.aPosition), a.vertexAttribPointer(n.attributes.aPosition, 2, a.FLOAT, !1, 0, 0), a.uniform2f(n.uniforms.uScale, i.scale[0], i.scale[1]), a.uniform2f(n.uniforms.uTranslate, i.translate[0], i.translate[1]), a.uniform4f(n.uniforms.uColor, r[0], r[1], r[2], r[3]), a.drawArrays(a.LINE_STRIP, 0, t), a.disableVertexAttribArray(n.attributes.aPosition);
+  }
+  renderPoints(e, t, i, r, a) {
+    const n = this.gl, o = this.programs.point, u = ((a == null ? void 0 : a.pointSize) ?? 4) * this.dpr, l = fe[(a == null ? void 0 : a.symbol) ?? "circle"] ?? 0;
+    n.useProgram(o.program), n.bindBuffer(n.ARRAY_BUFFER, e), n.enableVertexAttribArray(o.attributes.aPosition), n.vertexAttribPointer(o.attributes.aPosition, 2, n.FLOAT, !1, 0, 0), n.uniform2f(o.uniforms.uScale, i.scale[0], i.scale[1]), n.uniform2f(o.uniforms.uTranslate, i.translate[0], i.translate[1]), n.uniform4f(o.uniforms.uColor, r[0], r[1], r[2], r[3]), n.uniform1f(o.uniforms.uPointSize, u), n.uniform1i(o.uniforms.uSymbol, l), n.drawArrays(n.POINTS, 0, t), n.disableVertexAttribArray(o.attributes.aPosition);
+  }
+  renderBand(e, t, i, r) {
+    const a = this.gl, n = this.programs.line;
+    a.useProgram(n.program), a.bindBuffer(a.ARRAY_BUFFER, e), a.enableVertexAttribArray(n.attributes.aPosition), a.vertexAttribPointer(n.attributes.aPosition, 2, a.FLOAT, !1, 0, 0), a.uniform2f(n.uniforms.uScale, i.scale[0], i.scale[1]), a.uniform2f(n.uniforms.uTranslate, i.translate[0], i.translate[1]), a.uniform4f(n.uniforms.uColor, r[0], r[1], r[2], r[3]), a.drawArrays(a.TRIANGLE_STRIP, 0, t), a.disableVertexAttribArray(n.attributes.aPosition);
+  }
+  renderTriangles(e, t, i, r) {
+    const a = this.gl, n = this.programs.line;
+    a.useProgram(n.program), a.bindBuffer(a.ARRAY_BUFFER, e), a.enableVertexAttribArray(n.attributes.aPosition), a.vertexAttribPointer(n.attributes.aPosition, 2, a.FLOAT, !1, 0, 0), a.uniform2f(n.uniforms.uScale, i.scale[0], i.scale[1]), a.uniform2f(n.uniforms.uTranslate, i.translate[0], i.translate[1]), a.uniform4f(n.uniforms.uColor, r[0], r[1], r[2], r[3]), a.drawArrays(a.TRIANGLES, 0, t), a.disableVertexAttribArray(n.attributes.aPosition);
+  }
+  renderHeatmap(e, t, i, r, a) {
+    if (!a) return;
+    const n = this.textures.get(a);
+    if (!n) return;
+    const o = this.gl, u = this.programs.heatmap, l = (r == null ? void 0 : r.zBounds) ?? { min: 0, max: 1 };
+    o.useProgram(u.program), o.bindBuffer(o.ARRAY_BUFFER, e), o.enableVertexAttribArray(u.attributes.aPosition), o.vertexAttribPointer(u.attributes.aPosition, 2, o.FLOAT, !1, 12, 0), u.attributes.aValue !== -1 && (o.enableVertexAttribArray(u.attributes.aValue), o.vertexAttribPointer(u.attributes.aValue, 1, o.FLOAT, !1, 12, 8)), o.uniform2f(u.uniforms.uScale, i.scale[0], i.scale[1]), o.uniform2f(u.uniforms.uTranslate, i.translate[0], i.translate[1]), o.uniform1f(u.uniforms.uMinValue, l.min), o.uniform1f(u.uniforms.uMaxValue, l.max), o.activeTexture(o.TEXTURE0), o.bindTexture(o.TEXTURE_2D, n), o.uniform1i(u.uniforms.uColormap, 0), o.drawArrays(o.TRIANGLES, 0, t), o.disableVertexAttribArray(u.attributes.aPosition), u.attributes.aValue !== -1 && o.disableVertexAttribArray(u.attributes.aValue);
+  }
+  destroy() {
+    if (!this.gl) return;
+    const e = this.gl;
+    for (const t of this.buffers.values())
+      e.deleteBuffer(t);
+    this.buffers.clear();
+    for (const t of this.textures.values())
+      e.deleteTexture(t);
+    this.textures.clear(), this.programs && (pe(e, this.programs), this.programs = null), this.gl = null;
+  }
+}
+function B(s) {
+  if (!s)
+    return [1, 0, 0.3, 1];
+  if (Array.isArray(s))
+    return [s[0], s[1], s[2], s[3] ?? 1];
+  const e = s;
+  if (e.startsWith("#")) {
+    const i = e.slice(1);
+    if (i.length === 3) {
+      const r = parseInt(i[0] + i[0], 16) / 255, a = parseInt(i[1] + i[1], 16) / 255, n = parseInt(i[2] + i[2], 16) / 255;
+      return [r, a, n, 1];
+    }
+    if (i.length === 6) {
+      const r = parseInt(i.slice(0, 2), 16) / 255, a = parseInt(i.slice(2, 4), 16) / 255, n = parseInt(i.slice(4, 6), 16) / 255;
+      return [r, a, n, 1];
+    }
+    if (i.length === 8) {
+      const r = parseInt(i.slice(0, 2), 16) / 255, a = parseInt(i.slice(2, 4), 16) / 255, n = parseInt(i.slice(4, 6), 16) / 255, o = parseInt(i.slice(6, 8), 16) / 255;
+      return [r, a, n, o];
+    }
+  }
+  const t = e.match(/rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*([\d.]+))?\)/);
+  if (t) {
+    const i = parseInt(t[1]) / 255, r = parseInt(t[2]) / 255, a = parseInt(t[3]) / 255, n = t[4] ? parseFloat(t[4]) : 1;
+    return [i, r, a, n];
+  }
+  return [1, 0, 0.3, 1];
+}
+function me(s, e) {
+  const t = B(s.color), i = s.opacity ?? 1, r = [t[0], t[1], t[2], t[3] * i];
+  return e === "scatter" || e === "line+scatter" || e === "step+scatter" ? {
+    color: r,
+    opacity: i,
+    pointSize: s.pointSize ?? 4,
+    symbol: s.symbol ?? "circle"
+  } : {
+    color: r,
+    opacity: i,
+    lineWidth: s.lineWidth ?? 1
+  };
+}
+class U {
+  constructor(e) {
+    c(this, "backend");
+    c(this, "seriesBufferMap", /* @__PURE__ */ new Map());
+    c(this, "seriesStepBufferMap", /* @__PURE__ */ new Map());
+    c(this, "seriesTextureMap", /* @__PURE__ */ new Map());
+    this.backend = e;
+  }
+  /**
+   * Get buffer ID for a series
+   */
+  getBufferId(e) {
+    return this.seriesBufferMap.has(e) || this.seriesBufferMap.set(e, `series:${e}`), this.seriesBufferMap.get(e);
+  }
+  /**
+   * Get step buffer ID for a series
+   */
+  getStepBufferId(e) {
+    return this.seriesStepBufferMap.has(e) || this.seriesStepBufferMap.set(e, `series:${e}:step`), this.seriesStepBufferMap.get(e);
+  }
+  /**
+   * Get texture ID for a series
+   */
+  getTextureId(e) {
+    return this.seriesTextureMap.has(e) || this.seriesTextureMap.set(e, `texture:${e}`), this.seriesTextureMap.get(e);
+  }
+  /**
+   * Update series data in GPU buffers
+   */
+  updateSeries(e) {
+    const t = this.getBufferId(e.id);
+    if (this.backend.createOrUpdateBuffer(t, e.data, { usage: "vertex" }), e.stepData && (e.type === "step" || e.type === "step+scatter")) {
+      const i = this.getStepBufferId(e.id);
+      this.backend.createOrUpdateBuffer(i, e.stepData, { usage: "vertex" });
+    }
+    if (e.type === "heatmap" && e.colormapData) {
+      const i = this.getTextureId(e.id);
+      this.backend.createOrUpdateTexture1D(i, e.colormapData, {
+        width: e.colormapData.length / 4
+      });
+    }
+  }
+  /**
+   * Remove a series from GPU resources
+   */
+  removeSeries(e) {
+    const t = this.seriesBufferMap.get(e);
+    t && (this.backend.deleteBuffer(t), this.seriesBufferMap.delete(e));
+    const i = this.seriesStepBufferMap.get(e);
+    i && (this.backend.deleteBuffer(i), this.seriesStepBufferMap.delete(e));
+    const r = this.seriesTextureMap.get(e);
+    r && (this.backend.deleteTexture(r), this.seriesTextureMap.delete(e));
+  }
+  /**
+   * Build draw list from series array
+   */
+  buildDrawList(e) {
+    const t = [];
+    for (const i of e) {
+      this.updateSeries(i);
+      const r = this.getBufferId(i.id), a = i.data.length / 2, n = {
+        id: i.id,
+        kind: i.type,
+        bufferId: r,
+        count: i.type === "heatmap" ? i.data.length / 3 : a,
+        visible: i.visible,
+        style: me(i.style, i.type),
+        yBounds: i.yBounds
+      };
+      i.stepData && (i.type === "step" || i.type === "step+scatter") && (n.stepBufferId = this.getStepBufferId(i.id), n.stepCount = i.stepData.length / 2), i.type === "heatmap" && (n.textureId = this.getTextureId(i.id), n.style = {
+        zBounds: i.zBounds,
+        colormap: i.colormap
+      }), t.push(n);
+    }
+    return { items: t };
+  }
+  /**
+   * Cleanup all resources
+   */
+  destroy() {
+    for (const e of this.seriesBufferMap.values())
+      this.backend.deleteBuffer(e);
+    for (const e of this.seriesStepBufferMap.values())
+      this.backend.deleteBuffer(e);
+    for (const e of this.seriesTextureMap.values())
+      this.backend.deleteTexture(e);
+    this.seriesBufferMap.clear(), this.seriesStepBufferMap.clear(), this.seriesTextureMap.clear();
+  }
+}
+class ge {
+  constructor(e, t = {}) {
+    c(this, "canvas");
+    c(this, "options");
+    c(this, "backend", null);
+    c(this, "adapter", null);
+    c(this, "dpr");
+    c(this, "isInitialized", !1);
+    c(this, "backendType", null);
+    // Buffer management
+    c(this, "bufferDataMap", /* @__PURE__ */ new Map());
+    c(this, "stepBufferDataMap", /* @__PURE__ */ new Map());
+    c(this, "colormapDataMap", /* @__PURE__ */ new Map());
+    this.canvas = e, this.options = t, this.dpr = window.devicePixelRatio || 1;
+  }
+  /**
+   * Initialize the renderer
+   */
+  async init() {
+    const e = this.options.backend ?? "auto";
+    if ((e === "webgpu" || e === "auto") && w.isSupported())
+      try {
+        const t = new w(this.canvas, {
+          powerPreference: this.options.powerPreference ?? "high-performance"
+        });
+        return await t.init(), this.backend = t, this.backendType = "webgpu", this.adapter = new U(t), this.isInitialized = !0, this.resize(), !0;
+      } catch (t) {
+        console.warn("[GpuRenderer] WebGPU init failed:", t);
+      }
+    if ((e === "webgl" || e === "auto") && P.isSupported())
+      try {
+        const t = new P(this.canvas, {
+          powerPreference: this.options.powerPreference ?? "high-performance"
+        });
+        return await t.init(), this.backend = t, this.backendType = "webgl", this.adapter = new U(t), this.isInitialized = !0, this.resize(), console.info("[GpuRenderer] Using WebGL backend (WebGPU not available)"), !0;
+      } catch (t) {
+        console.warn("[GpuRenderer] WebGL init failed:", t);
+      }
+    return !1;
+  }
+  /**
+   * Check if renderer is available
+   */
+  get available() {
+    return this.isInitialized;
+  }
+  /**
+   * Get the active backend type
+   */
+  get activeBackend() {
+    return this.backendType;
+  }
+  /**
+   * Set device pixel ratio
+   */
+  setDPR(e) {
+    this.dpr = e, this.resize();
+  }
+  /**
+   * Check if vertex data exists for a buffer id
+   */
+  hasBuffer(e) {
+    return this.bufferDataMap.has(e) || this.stepBufferDataMap.has(e);
+  }
+  hasColormap(e) {
+    return this.colormapDataMap.has(e);
+  }
+  /**
+   * Render from NativeWebGLRenderer-compatible series descriptors (chart integration path).
+   */
+  renderNativeSeries(e, t) {
+    var n, o, u, l, f, d;
+    if (!this.isInitialized || !this.backend) return;
+    const i = [];
+    for (const p of e) {
+      if (!p.visible) continue;
+      if (p.type === "boxplot") {
+        this.appendBoxplotDraws(p, i);
+        continue;
+      }
+      if (p.type === "waterfall") {
+        this.appendWaterfallDraws(p, i);
+        continue;
+      }
+      if (p.count === 0) continue;
+      const h = this.bufferDataMap.get(p.id);
+      if (!h) continue;
+      this.backend.createOrUpdateBuffer(p.id, h, { usage: "vertex" });
+      const v = B(
+        typeof ((n = p.style) == null ? void 0 : n.color) == "string" ? p.style.color : "#00f2ff"
+      ), y = ((o = p.style) == null ? void 0 : o.opacity) ?? 1, m = [
+        v[0],
+        v[1],
+        v[2],
+        v[3] * y
+      ], g = this.mapNativeDrawKind(p.type), b = {
+        id: p.id,
+        kind: g,
+        bufferId: p.id,
+        count: p.count,
+        visible: !0,
+        yBounds: p.yBounds
+      };
+      if (g === "scatter" || g === "line+scatter" || g === "step+scatter" || g === "points")
+        b.style = {
+          color: m,
+          opacity: y,
+          pointSize: ((u = p.style) == null ? void 0 : u.pointSize) ?? 4,
+          symbol: ((l = p.style) == null ? void 0 : l.symbol) ?? "circle"
+        };
+      else if (g === "heatmap") {
+        b.textureId = `${p.id}_colormap`, b.style = {
+          zBounds: p.zBounds,
+          colormap: p.colormap
+        };
+        const x = this.colormapDataMap.get(`${p.id}_colormap`);
+        x && this.backend.createOrUpdateTexture1D(b.textureId, x, {
+          width: x.length / 4
+        });
+      } else
+        b.style = {
+          color: m,
+          opacity: y,
+          lineWidth: ((f = p.style) == null ? void 0 : f.width) ?? ((d = p.style) == null ? void 0 : d.lineWidth) ?? 1
+        };
+      if ((g === "step" || g === "step+scatter") && p.stepBuffer && p.stepCount) {
+        const x = `${p.id}_step`, _ = this.stepBufferDataMap.get(x);
+        _ && (this.backend.createOrUpdateBuffer(x, _, { usage: "vertex" }), b.stepBufferId = x, b.stepCount = p.stepCount);
+      }
+      i.push(b);
+    }
+    const r = t.dpr ?? this.dpr, a = {
+      viewport: {
+        width: this.canvas.clientWidth,
+        height: this.canvas.clientHeight,
+        dpr: r
+      },
+      clearColor: t.backgroundColor ?? [0.1, 0.1, 0.18, 1],
+      bounds: t.bounds,
+      plotArea: t.plotArea
+    };
+    "renderWithBounds" in this.backend ? this.backend.renderWithBounds({ items: i }, a, t.bounds) : this.backend.render({ items: i }, a);
+  }
+  appendBoxplotDraws(e, t) {
+    var n, o, u;
+    const i = this.seriesColor(e.style), r = { color: i, opacity: ((n = e.style) == null ? void 0 : n.opacity) ?? 1, lineWidth: ((o = e.style) == null ? void 0 : o.width) ?? 1 }, a = { color: i, opacity: (((u = e.style) == null ? void 0 : u.opacity) ?? 1) * 0.85, lineWidth: 1 };
+    this.pushDraw(t, `${e.id}_box_faces`, "bar", e.boxCount ?? 0, a, e.yBounds), this.pushDraw(t, `${e.id}_box_lines`, "line", e.boxLinesCount ?? 0, r, e.yBounds);
+  }
+  appendWaterfallDraws(e, t) {
+    const i = e.style ?? {}, r = this.colorFromHex(i.positiveColor ?? "#22c55e", 0.9), a = this.colorFromHex(i.negativeColor ?? "#ef4444", 0.9), n = this.colorFromHex(i.subtotalColor ?? "#3b82f6", 0.9), o = this.colorFromHex(i.connectorColor ?? "#64748b", 0.6);
+    this.pushDraw(t, `${e.id}_wf_positive`, "bar", e.wfPositiveCount ?? 0, { color: r, opacity: 0.9, lineWidth: 1 }, e.yBounds), this.pushDraw(t, `${e.id}_wf_negative`, "bar", e.wfNegativeCount ?? 0, { color: a, opacity: 0.9, lineWidth: 1 }, e.yBounds), this.pushDraw(t, `${e.id}_wf_subtotal`, "bar", e.wfSubtotalCount ?? 0, { color: n, opacity: 0.9, lineWidth: 1 }, e.yBounds), i.showConnectors !== !1 && this.pushDraw(t, `${e.id}_wf_connectors`, "line", e.wfConnectorCount ?? 0, { color: o, opacity: 0.6, lineWidth: 1 }, e.yBounds);
+  }
+  pushDraw(e, t, i, r, a, n) {
+    if (r <= 0) return;
+    const o = this.bufferDataMap.get(t);
+    !o || !this.backend || (this.backend.createOrUpdateBuffer(t, o, { usage: "vertex" }), e.push({
+      id: t,
+      kind: i,
+      bufferId: t,
+      count: r,
+      visible: !0,
+      style: a,
+      yBounds: n
+    }));
+  }
+  seriesColor(e) {
+    const t = B(typeof (e == null ? void 0 : e.color) == "string" ? e.color : "#00f2ff"), i = (e == null ? void 0 : e.opacity) ?? 1;
+    return [t[0], t[1], t[2], t[3] * i];
+  }
+  colorFromHex(e, t) {
+    const i = B(e);
+    return [i[0], i[1], i[2], i[3] * t];
+  }
+  mapNativeDrawKind(e) {
+    switch (e) {
+      case "scatter":
+        return "scatter";
+      case "line+scatter":
+        return "line+scatter";
+      case "step":
+        return "step";
+      case "step+scatter":
+        return "step+scatter";
+      case "band":
+        return "band";
+      case "bar":
+        return "bar";
+      case "heatmap":
+        return "heatmap";
+      default:
+        return "line";
+    }
+  }
+  /**
+   * Create or update a buffer
+   */
+  createBuffer(e, t) {
+    this.bufferDataMap.set(e, t);
+  }
+  /**
+   * Update a buffer partially
+   */
+  updateBuffer(e, t, i) {
+    const r = this.bufferDataMap.get(e);
+    if (!r) return !1;
+    const a = i / 4;
+    return r.set(t, a), !0;
+  }
+  /**
+   * Get a buffer's data
+   */
+  getBuffer(e) {
+    return this.bufferDataMap.get(e);
+  }
+  /**
+   * Delete a buffer
+   */
+  deleteBuffer(e) {
+    this.bufferDataMap.delete(e), this.backend && this.backend.deleteBuffer(e);
+  }
+  /**
+   * Create or update a step buffer
+   */
+  createStepBuffer(e, t) {
+    this.stepBufferDataMap.set(e, t);
+  }
+  /**
+   * Create colormap texture
+   */
+  createColormapTexture(e, t) {
+    this.colormapDataMap.set(e, t), this.backend && this.backend.createOrUpdateTexture1D(e, t, {
+      width: t.length / 4
+    });
+  }
+  /**
+   * Render a frame
+   */
+  render(e, t) {
+    if (!this.isInitialized || !this.backend) return;
+    const i = this.buildDrawList(e), r = {
+      viewport: {
+        width: this.canvas.clientWidth,
+        height: this.canvas.clientHeight,
+        dpr: this.dpr
+      },
+      clearColor: t.backgroundColor ?? [0.1, 0.1, 0.18, 1],
+      bounds: t.bounds,
+      plotArea: t.plotArea
+    };
+    "renderWithBounds" in this.backend ? this.backend.renderWithBounds(i, r, t.bounds) : this.backend.render(i, r);
+  }
+  /**
+   * Build draw list from series data
+   */
+  buildDrawList(e) {
+    const t = [];
+    for (const i of e) {
+      const r = this.bufferDataMap.get(i.id);
+      if (!r) continue;
+      this.backend.createOrUpdateBuffer(i.id, r, { usage: "vertex" });
+      const a = i.type === "heatmap" ? r.length / 3 : r.length / 2, n = B(i.style.color), o = i.style.opacity ?? 1, u = [
+        n[0],
+        n[1],
+        n[2],
+        n[3] * o
+      ], l = {
+        id: i.id,
+        kind: i.type,
+        bufferId: i.id,
+        count: a,
+        visible: i.visible,
+        yBounds: i.yBounds
+      };
+      if (i.type === "scatter" || i.type === "line+scatter" || i.type === "step+scatter")
+        l.style = {
+          color: u,
+          opacity: o,
+          pointSize: i.style.pointSize ?? 4,
+          symbol: i.style.symbol ?? "circle"
+        };
+      else if (i.type === "heatmap") {
+        l.textureId = `colormap:${i.id}`, l.style = {
+          zBounds: i.zBounds,
+          colormap: i.colormap
+        };
+        const f = this.colormapDataMap.get(i.id);
+        f && this.backend.createOrUpdateTexture1D(l.textureId, f, {
+          width: f.length / 4
+        });
+      } else
+        l.style = {
+          color: u,
+          opacity: o,
+          lineWidth: i.style.lineWidth ?? 1
+        };
+      if ((i.type === "step" || i.type === "step+scatter") && this.stepBufferDataMap.has(i.id)) {
+        const f = this.stepBufferDataMap.get(i.id), d = `${i.id}:step`;
+        this.backend.createOrUpdateBuffer(d, f, { usage: "vertex" }), l.stepBufferId = d, l.stepCount = f.length / 2;
+      }
+      t.push(l);
+    }
+    return { items: t };
+  }
+  /**
+   * Handle canvas resize
+   */
+  resize() {
+    if (!this.backend) return;
+    const e = this.canvas.getBoundingClientRect();
+    this.backend.setViewport({
+      width: e.width,
+      height: e.height,
+      dpr: this.dpr
+    });
+  }
+  /**
+   * Get renderer limits
+   */
+  getLimits() {
+    return {
+      backend: this.backendType,
+      available: this.isInitialized
+    };
+  }
+  /**
+   * Destroy the renderer
+   */
+  destroy() {
+    var e, t;
+    (e = this.adapter) == null || e.destroy(), (t = this.backend) == null || t.destroy(), this.bufferDataMap.clear(), this.stepBufferDataMap.clear(), this.colormapDataMap.clear(), this.adapter = null, this.backend = null, this.isInitialized = !1, this.backendType = null;
+  }
+}
+async function Be(s, e) {
+  const t = new ge(s, e);
+  return await t.init() ? t : null;
+}
+class Se {
   constructor() {
-    _(this, "entries", /* @__PURE__ */ new Map());
+    c(this, "entries", /* @__PURE__ */ new Map());
   }
   getInfo(e) {
     return this.entries.get(e);
@@ -19,9 +1845,9 @@ class z {
     return this.entries.size;
   }
 }
-class R {
+class Te {
   constructor() {
-    _(this, "entries", /* @__PURE__ */ new Map());
+    c(this, "entries", /* @__PURE__ */ new Map());
   }
   getInfo(e) {
     return this.entries.get(e);
@@ -36,26 +1862,26 @@ class R {
     return this.entries.size;
   }
 }
-function w(p) {
-  return p.variant ? `${p.kind}:${p.variant}` : p.kind;
+function M(s) {
+  return s.variant ? `${s.kind}:${s.variant}` : s.kind;
 }
-class E {
+class Me {
   constructor() {
-    _(this, "pipelines", /* @__PURE__ */ new Map());
+    c(this, "pipelines", /* @__PURE__ */ new Map());
   }
-  getOrCreate(e, i) {
-    const t = w(e);
-    if (!this.pipelines.has(t)) {
-      const a = i();
-      this.pipelines.set(t, a);
+  getOrCreate(e, t) {
+    const i = M(e);
+    if (!this.pipelines.has(i)) {
+      const r = t();
+      this.pipelines.set(i, r);
     }
-    return this.pipelines.get(t);
+    return this.pipelines.get(i);
   }
   has(e) {
-    return this.pipelines.has(w(e));
+    return this.pipelines.has(M(e));
   }
   delete(e) {
-    this.pipelines.delete(w(e));
+    this.pipelines.delete(M(e));
   }
   get size() {
     return this.pipelines.size;
@@ -64,63 +1890,62 @@ class E {
     this.pipelines.clear();
   }
 }
-class F {
+class ke {
   constructor(e) {
-    _(this, "canvas");
-    _(this, "results", []);
+    c(this, "canvas");
+    c(this, "results", []);
     this.canvas = e ?? document.createElement("canvas"), e || (this.canvas.width = 800, this.canvas.height = 600);
   }
   /**
    * Generate random line data
    */
   generateLineData(e) {
-    const i = new Float32Array(e * 2);
-    for (let t = 0; t < e; t++)
-      i[t * 2] = t / (e - 1), i[t * 2 + 1] = Math.random();
-    return i;
+    const t = new Float32Array(e * 2);
+    for (let i = 0; i < e; i++)
+      t[i * 2] = i / (e - 1), t[i * 2 + 1] = Math.random();
+    return t;
   }
   /**
    * Measure frame times
    */
-  async measureFrameTimes(e, i, t = 10, a) {
-    const s = [];
-    let r = performance.now(), o = 0;
+  async measureFrameTimes(e, t, i = 10, r) {
+    const a = [];
+    let n = performance.now(), o = 0;
     const u = performance.now();
     return new Promise((l) => {
-      const c = () => {
-        const n = performance.now(), m = n - u;
-        if (m >= i + t * 16) {
-          l({ frameTimes: s, duration: m - t * 16 });
+      const f = () => {
+        const d = performance.now(), p = d - u;
+        if (p >= t + i * 16) {
+          l({ frameTimes: a, duration: p - i * 16 });
           return;
         }
-        if (e(), o >= t) {
-          if (s.push(n - r), a) {
-            const d = Math.min(1, m / i);
-            a(d);
+        if (e(), o >= i) {
+          if (a.push(d - n), r) {
+            const h = Math.min(1, p / t);
+            r(h);
           }
         } else
           o++;
-        r = n, requestAnimationFrame(c);
+        n = d, requestAnimationFrame(f);
       };
-      requestAnimationFrame(c);
+      requestAnimationFrame(f);
     });
   }
   /**
    * Run benchmark with WebGPU backend
    */
   async benchmarkWebGPU(e = {}) {
-    const { WebGPUBackend: i } = await import("../gpuRenderer-BpaMYz-k.js").then((g) => g.b);
-    if (!i.isSupported())
+    if (!w.isSupported())
       return console.warn("[Benchmark] WebGPU not supported"), null;
-    const t = e.pointCount ?? 1e5, a = e.durationMs ?? 5e3, s = e.warmupFrames ?? 30, r = new i(this.canvas);
-    await r.init(), r.setViewport({
+    const t = e.pointCount ?? 1e5, i = e.durationMs ?? 5e3, r = e.warmupFrames ?? 30, a = new w(this.canvas);
+    await a.init(), a.setViewport({
       width: this.canvas.width,
       height: this.canvas.height,
       dpr: 1
     });
-    const o = this.generateLineData(t);
-    r.createOrUpdateBuffer("bench-line", o, { usage: "vertex" });
-    const u = {
+    const n = this.generateLineData(t);
+    a.createOrUpdateBuffer("bench-line", n, { usage: "vertex" });
+    const o = {
       items: [{
         id: "bench-line",
         kind: "line",
@@ -129,37 +1954,36 @@ class F {
         visible: !0,
         style: { color: [0, 0.9, 1, 1] }
       }]
-    }, l = {
+    }, u = {
       viewport: { width: this.canvas.width, height: this.canvas.height, dpr: 1 },
       clearColor: [0.1, 0.1, 0.15, 1]
-    }, c = { xMin: 0, xMax: 1, yMin: 0, yMax: 1 }, n = () => {
-      r.renderWithBounds(u, l, c);
-    }, { frameTimes: m, duration: d } = await this.measureFrameTimes(
-      n,
-      a,
-      s,
+    }, l = { xMin: 0, xMax: 1, yMin: 0, yMax: 1 }, f = () => {
+      a.renderWithBounds(o, u, l);
+    }, { frameTimes: d, duration: p } = await this.measureFrameTimes(
+      f,
+      i,
+      r,
       e.onProgress
     );
-    r.destroy();
-    const f = this.calculateResult("webgpu", t, m, d);
-    return this.results.push(f), f;
+    a.destroy();
+    const h = this.calculateResult("webgpu", t, d, p);
+    return this.results.push(h), h;
   }
   /**
    * Run benchmark with WebGL backend
    */
   async benchmarkWebGL(e = {}) {
-    const { WebGLBackend: i } = await import("../gpuRenderer-BpaMYz-k.js").then((g) => g.d);
-    if (!i.isSupported())
+    if (!P.isSupported())
       return console.warn("[Benchmark] WebGL not supported"), null;
-    const t = e.pointCount ?? 1e5, a = e.durationMs ?? 5e3, s = e.warmupFrames ?? 30, r = new i(this.canvas);
-    await r.init(), r.setViewport({
+    const t = e.pointCount ?? 1e5, i = e.durationMs ?? 5e3, r = e.warmupFrames ?? 30, a = new P(this.canvas);
+    await a.init(), a.setViewport({
       width: this.canvas.width,
       height: this.canvas.height,
       dpr: 1
     });
-    const o = this.generateLineData(t);
-    r.createOrUpdateBuffer("bench-line", o, { usage: "vertex" });
-    const u = {
+    const n = this.generateLineData(t);
+    a.createOrUpdateBuffer("bench-line", n, { usage: "vertex" });
+    const o = {
       items: [{
         id: "bench-line",
         kind: "line",
@@ -168,55 +1992,55 @@ class F {
         visible: !0,
         style: { color: [0, 0.9, 1, 1] }
       }]
-    }, l = {
+    }, u = {
       viewport: { width: this.canvas.width, height: this.canvas.height, dpr: 1 },
       clearColor: [0.1, 0.1, 0.15, 1]
-    }, c = { xMin: 0, xMax: 1, yMin: 0, yMax: 1 }, n = () => {
-      r.renderWithBounds(u, l, c);
-    }, { frameTimes: m, duration: d } = await this.measureFrameTimes(
-      n,
-      a,
-      s,
+    }, l = { xMin: 0, xMax: 1, yMin: 0, yMax: 1 }, f = () => {
+      a.renderWithBounds(o, u, l);
+    }, { frameTimes: d, duration: p } = await this.measureFrameTimes(
+      f,
+      i,
+      r,
       e.onProgress
     );
-    r.destroy();
-    const f = this.calculateResult("webgl", t, m, d);
-    return this.results.push(f), f;
+    a.destroy();
+    const h = this.calculateResult("webgl", t, d, p);
+    return this.results.push(h), h;
   }
   /**
    * Calculate benchmark result from frame times
    */
-  calculateResult(e, i, t, a) {
-    if (t.length === 0)
+  calculateResult(e, t, i, r) {
+    if (i.length === 0)
       return {
         backend: e,
-        pointCount: i,
+        pointCount: t,
         fps: 0,
         avgFrameTime: 0,
         minFrameTime: 0,
         maxFrameTime: 0,
         totalFrames: 0,
-        duration: a
+        duration: r
       };
-    const r = t.reduce((l, c) => l + c, 0) / t.length, o = Math.min(...t), u = Math.max(...t);
+    const n = i.reduce((l, f) => l + f, 0) / i.length, o = Math.min(...i), u = Math.max(...i);
     return {
       backend: e,
-      pointCount: i,
-      fps: Math.round(1e3 / r),
-      avgFrameTime: Math.round(r * 100) / 100,
+      pointCount: t,
+      fps: Math.round(1e3 / n),
+      avgFrameTime: Math.round(n * 100) / 100,
       minFrameTime: Math.round(o * 100) / 100,
       maxFrameTime: Math.round(u * 100) / 100,
-      totalFrames: t.length,
-      duration: Math.round(a)
+      totalFrames: i.length,
+      duration: Math.round(r)
     };
   }
   /**
    * Run comparative benchmark
    */
   async runComparison(e = {}) {
-    const i = await this.benchmarkWebGPU(e), t = await this.benchmarkWebGL(e);
-    let a = "unknown", s = 1;
-    return i && t ? i.fps > t.fps * 1.05 ? (a = "webgpu", s = i.fps / t.fps) : t.fps > i.fps * 1.05 ? (a = "webgl", s = t.fps / i.fps) : (a = "tie", s = 1) : i ? a = "webgpu" : t && (a = "webgl"), { webgpu: i, webgl: t, winner: a, speedup: Math.round(s * 100) / 100 };
+    const t = await this.benchmarkWebGPU(e), i = await this.benchmarkWebGL(e);
+    let r = "unknown", a = 1;
+    return t && i ? t.fps > i.fps * 1.05 ? (r = "webgpu", a = t.fps / i.fps) : i.fps > t.fps * 1.05 ? (r = "webgl", a = i.fps / t.fps) : (r = "tie", a = 1) : t ? r = "webgpu" : i && (r = "webgl"), { webgpu: t, webgl: i, winner: r, speedup: Math.round(a * 100) / 100 };
   }
   /**
    * Get all results
@@ -245,7 +2069,7 @@ class F {
     ].join(" | ");
   }
 }
-const M = `
+const be = `
 struct StatsResult {
   min_val: f32,
   max_val: f32,
@@ -315,7 +2139,7 @@ fn main(
     result.count = local_count[0];
   }
 }
-`, G = `
+`, ve = `
 struct MinMax {
   min_x: f32,
   max_x: f32,
@@ -372,7 +2196,7 @@ fn main(
     result.max_y = local_max_y[0];
   }
 }
-`, C = `
+`, xe = `
 struct Params {
   input_count: u32,
   output_count: u32,
@@ -428,7 +2252,7 @@ fn main(@builtin(global_invocation_id) global_id: vec3<u32>) {
     output_points[out_base + 1u] = input_points[min_idx];
   }
 }
-`, T = `
+`, ye = `
 struct Params {
   data_count: u32,
   threshold: f32,
@@ -485,14 +2309,14 @@ fn main(@builtin(global_invocation_id) global_id: vec3<u32>) {
   }
 }
 `;
-class P {
+class R {
   constructor(e = {}) {
-    _(this, "device", null);
-    _(this, "statsPipeline", null);
-    _(this, "minmaxPipeline", null);
-    _(this, "downsamplePipeline", null);
-    _(this, "peaksPipeline", null);
-    _(this, "isInitialized", !1);
+    c(this, "device", null);
+    c(this, "statsPipeline", null);
+    c(this, "minmaxPipeline", null);
+    c(this, "downsamplePipeline", null);
+    c(this, "peaksPipeline", null);
+    c(this, "isInitialized", !1);
     this.options = e;
   }
   /**
@@ -508,35 +2332,35 @@ class P {
     if (this.options.device)
       this.device = this.options.device;
     else {
-      if (!P.isSupported())
+      if (!R.isSupported())
         throw new Error("[GpuCompute] WebGPU not supported");
-      const i = await globalThis.navigator.gpu.requestAdapter({ powerPreference: "high-performance" });
-      if (!i)
+      const t = await globalThis.navigator.gpu.requestAdapter({ powerPreference: "high-performance" });
+      if (!t)
         throw new Error("[GpuCompute] Failed to get adapter");
-      this.device = await i.requestDevice();
+      this.device = await t.requestDevice();
     }
     await this.createPipelines(), this.isInitialized = !0;
   }
   async createPipelines() {
-    const e = this.device.createShaderModule({ code: M });
+    const e = this.device.createShaderModule({ code: be });
     this.statsPipeline = await this.device.createComputePipelineAsync({
       layout: "auto",
       compute: { module: e, entryPoint: "main" }
     });
-    const i = this.device.createShaderModule({ code: G });
+    const t = this.device.createShaderModule({ code: ve });
     this.minmaxPipeline = await this.device.createComputePipelineAsync({
       layout: "auto",
-      compute: { module: i, entryPoint: "main" }
+      compute: { module: t, entryPoint: "main" }
     });
-    const t = this.device.createShaderModule({ code: C });
+    const i = this.device.createShaderModule({ code: xe });
     this.downsamplePipeline = await this.device.createComputePipelineAsync({
       layout: "auto",
-      compute: { module: t, entryPoint: "main" }
+      compute: { module: i, entryPoint: "main" }
     });
-    const a = this.device.createShaderModule({ code: T });
+    const r = this.device.createShaderModule({ code: ye });
     this.peaksPipeline = await this.device.createComputePipelineAsync({
       layout: "auto",
-      compute: { module: a, entryPoint: "main" }
+      compute: { module: r, entryPoint: "main" }
     });
   }
   /**
@@ -545,31 +2369,31 @@ class P {
   async calculateStats(e) {
     if (!this.isInitialized)
       throw new Error("[GpuCompute] Not initialized");
-    const i = globalThis.GPUBufferUsage, t = this.device.createBuffer({
+    const t = globalThis.GPUBufferUsage, i = this.device.createBuffer({
       size: e.byteLength,
-      usage: i.STORAGE | i.COPY_DST
+      usage: t.STORAGE | t.COPY_DST
     });
-    this.device.queue.writeBuffer(t, 0, e);
-    const a = this.device.createBuffer({
+    this.device.queue.writeBuffer(i, 0, e);
+    const r = this.device.createBuffer({
       size: 32,
-      usage: i.STORAGE | i.COPY_SRC
-    }), s = this.device.createBuffer({
+      usage: t.STORAGE | t.COPY_SRC
+    }), a = this.device.createBuffer({
       size: 32,
-      usage: i.MAP_READ | i.COPY_DST
-    }), r = this.device.createBindGroup({
+      usage: t.MAP_READ | t.COPY_DST
+    }), n = this.device.createBindGroup({
       layout: this.statsPipeline.getBindGroupLayout(0),
       entries: [
-        { binding: 0, resource: { buffer: t } },
-        { binding: 1, resource: { buffer: a } }
+        { binding: 0, resource: { buffer: i } },
+        { binding: 1, resource: { buffer: r } }
       ]
     }), o = this.device.createCommandEncoder(), u = o.beginComputePass();
-    u.setPipeline(this.statsPipeline), u.setBindGroup(0, r);
+    u.setPipeline(this.statsPipeline), u.setBindGroup(0, n);
     const l = Math.ceil(e.length / 256);
-    u.dispatchWorkgroups(l), u.end(), o.copyBufferToBuffer(a, 0, s, 0, 32), this.device.queue.submit([o.finish()]), await s.mapAsync(globalThis.GPUMapMode.READ);
-    const c = new Float32Array(s.getMappedRange().slice(0));
-    s.unmap(), t.destroy(), a.destroy(), s.destroy();
-    const [n, m, d, f, g] = c, h = Math.floor(g), v = h > 0 ? d / h : 0, x = h > 1 ? (f - d * d / h) / (h - 1) : 0, y = Math.sqrt(Math.max(0, x));
-    return { min: n, max: m, mean: v, std: y, count: h };
+    u.dispatchWorkgroups(l), u.end(), o.copyBufferToBuffer(r, 0, a, 0, 32), this.device.queue.submit([o.finish()]), await a.mapAsync(globalThis.GPUMapMode.READ);
+    const f = new Float32Array(a.getMappedRange().slice(0));
+    a.unmap(), i.destroy(), r.destroy(), a.destroy();
+    const [d, p, h, v, y] = f, m = Math.floor(y), g = m > 0 ? h / m : 0, b = m > 1 ? (v - h * h / m) / (m - 1) : 0, x = Math.sqrt(Math.max(0, b));
+    return { min: d, max: p, mean: g, std: x, count: m };
   }
   /**
    * Calculate bounds for 2D point data
@@ -577,124 +2401,124 @@ class P {
   async calculateBounds(e) {
     if (!this.isInitialized)
       throw new Error("[GpuCompute] Not initialized");
-    const i = globalThis.GPUBufferUsage, t = this.device.createBuffer({
+    const t = globalThis.GPUBufferUsage, i = this.device.createBuffer({
       size: e.byteLength,
-      usage: i.STORAGE | i.COPY_DST
+      usage: t.STORAGE | t.COPY_DST
     });
-    this.device.queue.writeBuffer(t, 0, e);
-    const a = this.device.createBuffer({
+    this.device.queue.writeBuffer(i, 0, e);
+    const r = this.device.createBuffer({
       size: 16,
-      usage: i.STORAGE | i.COPY_SRC
-    }), s = this.device.createBuffer({
+      usage: t.STORAGE | t.COPY_SRC
+    }), a = this.device.createBuffer({
       size: 16,
-      usage: i.MAP_READ | i.COPY_DST
-    }), r = this.device.createBindGroup({
+      usage: t.MAP_READ | t.COPY_DST
+    }), n = this.device.createBindGroup({
       layout: this.minmaxPipeline.getBindGroupLayout(0),
       entries: [
-        { binding: 0, resource: { buffer: t } },
-        { binding: 1, resource: { buffer: a } }
+        { binding: 0, resource: { buffer: i } },
+        { binding: 1, resource: { buffer: r } }
       ]
     }), o = this.device.createCommandEncoder(), u = o.beginComputePass();
-    u.setPipeline(this.minmaxPipeline), u.setBindGroup(0, r);
-    const l = e.length / 2, c = Math.ceil(l / 256);
-    u.dispatchWorkgroups(c), u.end(), o.copyBufferToBuffer(a, 0, s, 0, 16), this.device.queue.submit([o.finish()]), await s.mapAsync(globalThis.GPUMapMode.READ);
-    const n = new Float32Array(s.getMappedRange().slice(0));
-    return s.unmap(), t.destroy(), a.destroy(), s.destroy(), {
-      xMin: n[0],
-      xMax: n[1],
-      yMin: n[2],
-      yMax: n[3]
+    u.setPipeline(this.minmaxPipeline), u.setBindGroup(0, n);
+    const l = e.length / 2, f = Math.ceil(l / 256);
+    u.dispatchWorkgroups(f), u.end(), o.copyBufferToBuffer(r, 0, a, 0, 16), this.device.queue.submit([o.finish()]), await a.mapAsync(globalThis.GPUMapMode.READ);
+    const d = new Float32Array(a.getMappedRange().slice(0));
+    return a.unmap(), i.destroy(), r.destroy(), a.destroy(), {
+      xMin: d[0],
+      xMax: d[1],
+      yMin: d[2],
+      yMax: d[3]
     };
   }
   /**
    * Downsample point data using min-max algorithm
    */
-  async downsample(e, i) {
+  async downsample(e, t) {
     if (!this.isInitialized)
       throw new Error("[GpuCompute] Not initialized");
-    const t = e.length / 2;
-    if (t <= i)
+    const i = e.length / 2;
+    if (i <= t)
       return e;
-    const a = globalThis.GPUBufferUsage, s = Math.ceil(i / 2), r = Math.ceil(t / s), o = s * 2, u = new Uint32Array([t, o, r, 0]), l = this.device.createBuffer({
+    const r = globalThis.GPUBufferUsage, a = Math.ceil(t / 2), n = Math.ceil(i / a), o = a * 2, u = new Uint32Array([i, o, n, 0]), l = this.device.createBuffer({
       size: 16,
-      usage: a.UNIFORM | a.COPY_DST
+      usage: r.UNIFORM | r.COPY_DST
     });
     this.device.queue.writeBuffer(l, 0, u);
-    const c = this.device.createBuffer({
+    const f = this.device.createBuffer({
       size: e.byteLength,
-      usage: a.STORAGE | a.COPY_DST
+      usage: r.STORAGE | r.COPY_DST
     });
-    this.device.queue.writeBuffer(c, 0, e);
-    const n = o * 2 * 4, m = this.device.createBuffer({
-      size: n,
-      usage: a.STORAGE | a.COPY_SRC
-    }), d = this.device.createBuffer({
-      size: n,
-      usage: a.MAP_READ | a.COPY_DST
-    }), f = this.device.createBindGroup({
+    this.device.queue.writeBuffer(f, 0, e);
+    const d = o * 2 * 4, p = this.device.createBuffer({
+      size: d,
+      usage: r.STORAGE | r.COPY_SRC
+    }), h = this.device.createBuffer({
+      size: d,
+      usage: r.MAP_READ | r.COPY_DST
+    }), v = this.device.createBindGroup({
       layout: this.downsamplePipeline.getBindGroupLayout(0),
       entries: [
         { binding: 0, resource: { buffer: l } },
-        { binding: 1, resource: { buffer: c } },
-        { binding: 2, resource: { buffer: m } }
+        { binding: 1, resource: { buffer: f } },
+        { binding: 2, resource: { buffer: p } }
       ]
-    }), g = this.device.createCommandEncoder(), h = g.beginComputePass();
-    h.setPipeline(this.downsamplePipeline), h.setBindGroup(0, f);
-    const v = Math.ceil(s / 64);
-    h.dispatchWorkgroups(v), h.end(), g.copyBufferToBuffer(m, 0, d, 0, n), this.device.queue.submit([g.finish()]), await d.mapAsync(globalThis.GPUMapMode.READ);
-    const x = new Float32Array(d.getMappedRange().slice(0));
-    return d.unmap(), l.destroy(), c.destroy(), m.destroy(), d.destroy(), x;
+    }), y = this.device.createCommandEncoder(), m = y.beginComputePass();
+    m.setPipeline(this.downsamplePipeline), m.setBindGroup(0, v);
+    const g = Math.ceil(a / 64);
+    m.dispatchWorkgroups(g), m.end(), y.copyBufferToBuffer(p, 0, h, 0, d), this.device.queue.submit([y.finish()]), await h.mapAsync(globalThis.GPUMapMode.READ);
+    const b = new Float32Array(h.getMappedRange().slice(0));
+    return h.unmap(), l.destroy(), f.destroy(), p.destroy(), h.destroy(), b;
   }
   /**
    * Detect peaks in 1D data
    */
-  async detectPeaks(e, i = {}) {
+  async detectPeaks(e, t = {}) {
     if (!this.isInitialized)
       throw new Error("[GpuCompute] Not initialized");
-    const t = i.threshold ?? 0, a = i.minDistance ?? 1, s = globalThis.GPUBufferUsage, r = new Float32Array([
+    const i = t.threshold ?? 0, r = t.minDistance ?? 1, a = globalThis.GPUBufferUsage, n = new Float32Array([
       e.length,
-      t,
-      a,
+      i,
+      r,
       0
       // padding
     ]), o = this.device.createBuffer({
       size: 16,
-      usage: s.UNIFORM | s.COPY_DST
+      usage: a.UNIFORM | a.COPY_DST
     });
-    this.device.queue.writeBuffer(o, 0, new Uint8Array(r.buffer));
+    this.device.queue.writeBuffer(o, 0, new Uint8Array(n.buffer));
     const u = this.device.createBuffer({
       size: e.byteLength,
-      usage: s.STORAGE | s.COPY_DST
+      usage: a.STORAGE | a.COPY_DST
     });
     this.device.queue.writeBuffer(u, 0, e);
-    const l = e.length * 16, c = this.device.createBuffer({
+    const l = e.length * 16, f = this.device.createBuffer({
       size: l,
-      usage: s.STORAGE | s.COPY_SRC
-    }), n = this.device.createBuffer({
+      usage: a.STORAGE | a.COPY_SRC
+    }), d = this.device.createBuffer({
       size: l,
-      usage: s.MAP_READ | s.COPY_DST
-    }), m = this.device.createBindGroup({
+      usage: a.MAP_READ | a.COPY_DST
+    }), p = this.device.createBindGroup({
       layout: this.peaksPipeline.getBindGroupLayout(0),
       entries: [
         { binding: 0, resource: { buffer: o } },
         { binding: 1, resource: { buffer: u } },
-        { binding: 2, resource: { buffer: c } }
+        { binding: 2, resource: { buffer: f } }
       ]
-    }), d = this.device.createCommandEncoder(), f = d.beginComputePass();
-    f.setPipeline(this.peaksPipeline), f.setBindGroup(0, m);
-    const g = Math.ceil(e.length / 64);
-    f.dispatchWorkgroups(g), f.end(), d.copyBufferToBuffer(c, 0, n, 0, l), this.device.queue.submit([d.finish()]), await n.mapAsync(globalThis.GPUMapMode.READ);
-    const h = new ArrayBuffer(l);
-    new Uint8Array(h).set(new Uint8Array(n.getMappedRange())), n.unmap();
-    const v = new DataView(h), x = [];
-    for (let y = 0; y < e.length; y++) {
-      const b = y * 16;
-      v.getUint32(b + 8, !0) && x.push({
-        index: v.getUint32(b, !0),
-        value: v.getFloat32(b + 4, !0)
+    }), h = this.device.createCommandEncoder(), v = h.beginComputePass();
+    v.setPipeline(this.peaksPipeline), v.setBindGroup(0, p);
+    const y = Math.ceil(e.length / 64);
+    v.dispatchWorkgroups(y), v.end(), h.copyBufferToBuffer(f, 0, d, 0, l), this.device.queue.submit([h.finish()]), await d.mapAsync(globalThis.GPUMapMode.READ);
+    const m = new ArrayBuffer(l);
+    new Uint8Array(m).set(new Uint8Array(d.getMappedRange())), d.unmap();
+    const g = new DataView(m), b = [];
+    for (let x = 0; x < e.length; x++) {
+      const _ = x * 16;
+      g.getUint32(_ + 8, !0) && b.push({
+        index: g.getUint32(_, !0),
+        value: g.getFloat32(_ + 4, !0)
       });
     }
-    return o.destroy(), u.destroy(), c.destroy(), n.destroy(), x;
+    return o.destroy(), u.destroy(), f.destroy(), d.destroy(), b;
   }
   /**
    * Cleanup resources
@@ -703,16 +2527,16 @@ class P {
     this.device = null, this.statsPipeline = null, this.minmaxPipeline = null, this.downsamplePipeline = null, this.peaksPipeline = null, this.isInitialized = !1;
   }
 }
-const S = {
+const _e = {
   name: "velo-plot-gpu",
   version: "1.0.0",
   description: "GPU acceleration and WebGPU support for velo-plot",
   provides: ["renderer", "compute"],
   tags: ["gpu", "webgpu", "webgl2", "performance"]
 };
-function D(p = {}) {
+function Ae(s = {}) {
   return {
-    manifest: S,
+    manifest: _e,
     onInit(e) {
     },
     onDestroy(e) {
@@ -720,18 +2544,18 @@ function D(p = {}) {
   };
 }
 export {
-  z as BaseBufferStore,
-  R as BaseTextureStore,
-  F as GpuBenchmark,
-  P as GpuCompute,
-  q as GpuRenderer,
-  E as PipelineCache,
-  D as PluginGpu,
-  W as SeriesAdapter,
-  I as WebGLBackend,
-  Y as WebGPUBackend,
-  $ as createGpuRenderer,
-  D as default,
-  N as parseColorToRGBA
+  Se as BaseBufferStore,
+  Te as BaseTextureStore,
+  ke as GpuBenchmark,
+  R as GpuCompute,
+  ge as GpuRenderer,
+  Me as PipelineCache,
+  Ae as PluginGpu,
+  U as SeriesAdapter,
+  P as WebGLBackend,
+  w as WebGPUBackend,
+  Be as createGpuRenderer,
+  Ae as default,
+  B as parseColorToRGBA
 };
 //# sourceMappingURL=gpu.js.map