@luxonis/visualizer-protobuf 2.12.0 → 2.14.0

package/dist/{index-Daz5hiMP.js → index-D8jKQuGu.js}

@@ -1048,6 +1048,69 @@ function estimateObjectSize(obj) {
   return SMALL_INTEGER_SIZE;
 }
 
+// This Source Code Form is subject to the terms of the Mozilla Public
+// License, v2.0. If a copy of the MPL was not distributed with this
+// file, You can obtain one at http://mozilla.org/MPL/2.0/
+/// <reference types="@webgpu/types" />
+
+function uint8ArrayToUint16Array(uint8Array) {
+  if (uint8Array.length % 2 !== 0) {
+    throw new Error("Uint8Array length must be a multiple of 2 for conversion to Uint16Array");
+  }
+  const uint16Array = new Uint16Array(uint8Array.length / 2);
+  for (let i = 0; i < uint16Array.length; i++) {
+    const lowByte = uint8Array[i * 2];
+    const highByte = uint8Array[i * 2 + 1];
+
+    // eslint-disable-next-line @foxglove/strict-equality
+    if (highByte === undefined || lowByte === undefined) {
+      throw new Error("Invalid data in uint8Array");
+    }
+    uint16Array[i] = highByte << 8 | lowByte;
+  }
+  return uint16Array;
+}
+
+/* H264 (i420) to RGBA */
+function i420ToRgbaToPointcloud(i420Data, i420Width, i420Height, depthWidth, depthHeight, data) {
+  const frameSize = i420Width * i420Height;
+  const uOffset = frameSize;
+  const vOffset = frameSize + frameSize / 4;
+  const pointCount = data.byteLength / 16;
+  const buffer = new ArrayBuffer(data.byteLength);
+  const view = new DataView(buffer);
+  const dataView = new DataView(data.buffer);
+  for (let i = 0; i < pointCount; i++) {
+    const depthX = i % depthWidth;
+    const depthY = Math.floor(i / depthWidth);
+    const i420X = Math.round(depthX * (i420Width / depthWidth));
+    const i420Y = Math.round(depthY * (i420Height / depthHeight));
+    if (i420X >= i420Width || i420Y >= i420Height) {
+      continue;
+    }
+    const index = i420Y * i420Width + i420X;
+    const uvIndex = Math.floor(i420Y / 2) * (i420Width / 2) + Math.floor(i420X / 2);
+    const Y = i420Data[index] ?? 0;
+    const U = (i420Data[uOffset + uvIndex] ?? 128) - 128;
+    const V = (i420Data[vOffset + uvIndex] ?? 128) - 128;
+    let R = Y + 1.402 * V;
+    let G = Y - 0.344136 * U - 0.714136 * V;
+    let B = Y + 1.772 * U;
+    R = Math.min(255, Math.max(0, R));
+    G = Math.min(255, Math.max(0, G));
+    B = Math.min(255, Math.max(0, B));
+    const offset = i * 16;
+    view.setFloat32(offset, dataView.getFloat32(offset, true), true); // x
+    view.setFloat32(offset + 4, dataView.getFloat32(offset + 4, true), true); // y
+    view.setFloat32(offset + 8, dataView.getFloat32(offset + 8, true), true); // z
+    view.setUint8(offset + 12, R); // Red
+    view.setUint8(offset + 13, G); // Green
+    view.setUint8(offset + 14, B); // Blue
+    view.setUint8(offset + 15, 255); // Alpha (fully opaque)
+  }
+  return new Uint8Array(buffer);
+}
+
 var typescript$1 = {};
 
 /******************************************************************************
@@ -11357,34 +11420,270 @@ function deserializeColorFrame({
 // This Source Code Form is subject to the terms of the Mozilla Public
 // License, v2.0. If a copy of the MPL was not distributed with this
 // file, You can obtain one at http://mozilla.org/MPL/2.0/
-
-function deserializeDepthFrame({
+/* eslint-disable no-underscore-dangle */
+
+const shader = `
+@group(0) @binding(0) var<storage, read> depthBuffer: array<u32>; // Uint16 stored as u32
+@group(0) @binding(1) var<storage, read> intrinsicsBuffer: array<f32>;
+@group(0) @binding(2) var<storage, read_write> xyzColorBuffer: array<u32>; // Stores XYZ + RGBA
+
+@compute @workgroup_size(256, 1, 1)
+fn main(@builtin(global_invocation_id) global_id: vec3<u32>) {
+    let i = global_id.x;
+    let fx = intrinsicsBuffer[0];
+    let fy = intrinsicsBuffer[1];
+    let cx = intrinsicsBuffer[2];
+    let cy = intrinsicsBuffer[3];
+    let scale = intrinsicsBuffer[4];
+    let width = intrinsicsBuffer[5];
+    let height = intrinsicsBuffer[6];
+
+    if (i >= u32(width * height)) { return; }
+
+    let u = i % u32(width);
+    let v = i / u32(width);
+
+    // Convert uint16 depth value to float (stored as u32, so we bitwise mask)
+    let rawDepth = depthBuffer[i] & 0xFFFFu;
+    let z = f32(rawDepth) * scale;
+
+    let x = (cx - f32(u)) * z / fx;
+    let y = (cy - f32(v)) * z / fy;
+
+    let base = i * 4u; // 4 values per point (X, Y, Z, Color)
+
+    // Convert floats to u32 representation for storage
+    xyzColorBuffer[base] = bitcast<u32>(x);
+    xyzColorBuffer[base + 1u] = bitcast<u32>(y);
+    xyzColorBuffer[base + 2u] = bitcast<u32>(z);
+
+    // Example: RGB set based on depth, Alpha is fixed at 255
+    let r = u32(clamp(z * 255.0, 0.0, 255.0));
+    let g = u32(clamp(y * 255.0, 0.0, 255.0));
+    let b = u32(clamp(x * 255.0, 0.0, 255.0));
+    xyzColorBuffer[base + 3u] = (r & 0xFFu) | ((g & 0xFFu) << 8) | ((b & 0xFFu) << 16) | (255u << 24);
+}
+`;
+async function depthToPointcloudGPU(depthArray, width, height, fx, fy, cx, cy) {
+  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+  if (!navigator.gpu) {
+    console.warn("WebGPU not supported.");
+    return depthToPointCloudBuffer(depthArray, width, height, fx, fy, cx, cy);
+  }
+  const adapter = await navigator.gpu.requestAdapter();
+  if (!adapter) {
+    console.warn("Couldn't request WebGPU adapter.");
+    return depthToPointCloudBuffer(depthArray, width, height, fx, fy, cx, cy);
+  }
+  const device = await adapter.requestDevice();
+  const queue = device.queue;
+  const scale = 1.0;
+  const numPixels = width * height;
+  const outputSize = numPixels * 16;
+  const depthData32 = new Uint32Array(depthArray);
+  const intrinsics = new Float32Array([fx, fy, cx, cy, scale, width, height]);
+  const depthBuffer = device.createBuffer({
+    size: depthData32.byteLength,
+    usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_DST
+  });
+  const intrinsicsBuffer = device.createBuffer({
+    size: intrinsics.byteLength,
+    usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_DST
+  });
+  const xyzColorBuffer = device.createBuffer({
+    size: outputSize,
+    usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_SRC
+  });
+  queue.writeBuffer(depthBuffer, 0, depthData32);
+  queue.writeBuffer(intrinsicsBuffer, 0, intrinsics);
+  const bindGroupLayout = device.createBindGroupLayout({
+    entries: [{
+      binding: 0,
+      visibility: GPUShaderStage.COMPUTE,
+      buffer: {
+        type: "read-only-storage"
+      }
+    }, {
+      binding: 1,
+      visibility: GPUShaderStage.COMPUTE,
+      buffer: {
+        type: "read-only-storage"
+      }
+    }, {
+      binding: 2,
+      visibility: GPUShaderStage.COMPUTE,
+      buffer: {
+        type: "storage"
+      }
+    }]
+  });
+  const bindGroup = device.createBindGroup({
+    layout: bindGroupLayout,
+    entries: [{
+      binding: 0,
+      resource: {
+        buffer: depthBuffer
+      }
+    }, {
+      binding: 1,
+      resource: {
+        buffer: intrinsicsBuffer
+      }
+    }, {
+      binding: 2,
+      resource: {
+        buffer: xyzColorBuffer
+      }
+    }]
+  });
+  const shaderModule = device.createShaderModule({
+    code: shader
+  });
+  const pipeline = device.createComputePipeline({
+    layout: device.createPipelineLayout({
+      bindGroupLayouts: [bindGroupLayout]
+    }),
+    compute: {
+      module: shaderModule,
+      entryPoint: "main"
+    }
+  });
+  const commandEncoder = device.createCommandEncoder();
+  const passEncoder = commandEncoder.beginComputePass();
+  passEncoder.setPipeline(pipeline);
+  passEncoder.setBindGroup(0, bindGroup);
+  passEncoder.dispatchWorkgroups(Math.ceil(numPixels / 256));
+  passEncoder.end();
+  device.queue.submit([commandEncoder.finish()]);
+  const outputBuffer = device.createBuffer({
+    size: xyzColorBuffer.size,
+    usage: GPUBufferUsage.COPY_DST | GPUBufferUsage.MAP_READ
+  });
+  const copyEncoder = device.createCommandEncoder();
+  copyEncoder.copyBufferToBuffer(xyzColorBuffer, 0, outputBuffer, 0, xyzColorBuffer.size);
+  device.queue.submit([copyEncoder.finish()]);
+
+  // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+  await outputBuffer.mapAsync(GPUMapMode.READ);
+  const mappedRange = outputBuffer.getMappedRange();
+  const result = new Uint8Array(mappedRange.byteLength);
+  result.set(new Uint8Array(mappedRange));
+  outputBuffer.unmap();
+  return result;
+}
+function depthToPointCloudBuffer(uint16Array, width, height, fx, fy, cx, cy) {
+  const depthData = Array.from({
+    length: height
+  }, () => new Array(width));
+  for (let v = 0; v < height; v++) {
+    depthData[v] = depthData[v] ?? [];
+    for (let u = 0; u < width; u++) {
+      const d = uint16Array[v * width + u] ?? -1;
+      depthData[v][u] = d > 0 ? d : -1;
+    }
+  }
+  const points = [];
+  // Accumulate the x, y, z values for each pixel.
+  for (let v = 0; v < height; v++) {
+    const row = depthData[v];
+    if (!row) {
+      continue;
+    }
+    for (let u = 0; u < width; u++) {
+      const z = row[u] ?? 0;
+      const x = (cx - u) * z / fx;
+      const y = (cy - v) * z / fy;
+      points.push(x, y, z);
+    }
+  }
+  const pointCount = points.length / 3;
+  const buffer = new ArrayBuffer(pointCount * 16);
+  const view = new DataView(buffer);
+  for (let i = 0; i < pointCount; i++) {
+    const offset = i * 16;
+    view.setFloat32(offset, points[i * 3] ?? 0, true); //X
+    view.setFloat32(offset + 4, points[i * 3 + 1] ?? 0, true); //Y
+    view.setFloat32(offset + 8, points[i * 3 + 2] ?? 0, true); //Z
+    view.setUint8(offset + 12, 0); // R
+    view.setUint8(offset + 13, 0); // G
+    view.setUint8(offset + 14, 0); // B
+    view.setUint8(offset + 15, 255); // A
+  }
+  return new Uint8Array(buffer);
+}
+async function deserializeDepthFrame({
   topic,
   message,
   callback
 }) {
   const {
     receiveTime,
-    encoding,
-    step,
     width,
     height
   } = parseMessage(message);
+  const neuralCameraIntrinsics = JSON.parse(localStorage.getItem("neuralCameraIntrinsics") ?? "{}");
+  const uint16Array = uint8ArrayToUint16Array(message.data);
+  const fx = neuralCameraIntrinsics.right.focalLenght.x;
+  const fy = neuralCameraIntrinsics.right.focalLenght.y;
+  const cx = neuralCameraIntrinsics.right.principalPoint.x;
+  const cy = neuralCameraIntrinsics.right.principalPoint.y;
+  const pointCloudBufferGPU = depthToPointcloudGPU(uint16Array, width, height, fx, fy, cx, cy);
   const foxgloveMessage = {
     timestamp: receiveTime,
-    frame_id: `depth-${topic}-frame`,
+    frame_id: `pointcloud-${topic}-frame`,
+    point_stride: 16,
+    pose: {
+      position: {
+        x: 0,
+        y: 0,
+        z: 0
+      },
+      orientation: {
+        x: 0,
+        y: 0,
+        z: 1,
+        w: 0
+      }
+    },
     width,
     height,
-    encoding,
-    step: width * step,
-    data: message.data
+    fields: [{
+      name: "x",
+      offset: 0,
+      type: typescript$1.NumericType.FLOAT32
+    }, {
+      name: "y",
+      offset: 4,
+      type: typescript$1.NumericType.FLOAT32
+    }, {
+      name: "z",
+      offset: 8,
+      type: typescript$1.NumericType.FLOAT32
+    }, {
+      name: "red",
+      offset: 12,
+      type: typescript$1.NumericType.UINT8
+    }, {
+      name: "green",
+      offset: 13,
+      type: typescript$1.NumericType.UINT8
+    }, {
+      name: "blue",
+      offset: 14,
+      type: typescript$1.NumericType.UINT8
+    }, {
+      name: "alpha",
+      offset: 15,
+      type: typescript$1.NumericType.UINT8
+    }],
+    data: await pointCloudBufferGPU
   };
   callback({
     topic,
     receiveTime,
     message: foxgloveMessage,
     sizeInBytes: estimateObjectSize(foxgloveMessage),
-    schemaName: "foxglove.RawImage"
+    schemaName: "foxglove.PointCloud"
   });
 }
 
@@ -11599,7 +11898,7 @@ async function deserializeDepthAiMessage(args) {
             }
           case Type$1.RAW16:
             {
-              deserializeDepthFrame({
+              await deserializeDepthFrame({
                 topic,
                 message,
                 callback
@@ -11788,6 +12087,18 @@ class FoxgloveConnection {
   }
   handleParsedMessage(event) {
     this.decodeMetrics.registerEvent(event.topic);
+    if (event.topic === "H.264 Stream") {
+      this.lastEncodedFrame = event;
+    }
+    if (event.topic === "Point Cloud") {
+      if (!this.lastEncodedFrame) {
+        console.warn("didnt find H.264 Stream");
+      } else {
+        // @ts-expect-error - ITS unknow
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+        event.message.data = i420ToRgbaToPointcloud(this.lastEncodedFrame.message.data, this.lastEncodedFrame.message.width, this.lastEncodedFrame.message.height, event.message.width, event.message.height, event.message.data);
+      }
+    }
     const messageSize = estimateObjectSize(event.message);
     event.sizeInBytes = messageSize;
     this.messageEvents.push(event);
@@ -12329,44 +12640,6 @@ class WebRtcClient {
     on = this.events.on.bind(this.events);
 }
 
-// This Source Code Form is subject to the terms of the Mozilla Public
-// License, v2.0. If a copy of the MPL was not distributed with this
-// file, You can obtain one at http://mozilla.org/MPL/2.0/
-
-class ArtificialWorker extends EventTarget {
-  #selfTarget = new EventTarget();
-
-  // Post message from main to worker
-  // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
-  postMessage(data, _transferable) {
-    const event = new MessageEvent('message', {
-      data
-    });
-    this.#selfTarget.dispatchEvent(event);
-  }
-
-  // Listen for worker-to-main messages
-  // @ts-expect-error Make it typed
-  addEventListener(type, callback) {
-    super.addEventListener(type, callback);
-  }
-
-  // Post message from worker to main
-  // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
-  postMessageToMain(data, _transferable) {
-    const event = new MessageEvent('message', {
-      data
-    });
-    super.dispatchEvent(event);
-  }
-
-  // Listen for main-to-worker messages
-  // @ts-expect-error Make it typed
-  addEventListenerFromMain(type, callback) {
-    this.#selfTarget.addEventListener(type, callback);
-  }
-}
-
 var safeStableStringify = {exports: {}};
 
 (function (module, exports) {
@@ -29852,6 +30125,10 @@ const uuidv7 = () => uuidv7obj().toString();
 /** Generates a UUIDv7 object. */
 const uuidv7obj = () => (defaultGenerator$1 || (defaultGenerator$1 = new V7Generator())).generate();
 
+// This Source Code Form is subject to the terms of the Mozilla Public
+// License, v2.0. If a copy of the MPL was not distributed with this
+// file, You can obtain one at http://mozilla.org/MPL/2.0/
+
 const GET_APP_CONNECTION = () => ({
   GetAppConnection: {}
 });
@@ -29905,7 +30182,7 @@ class WebRtcCommsProxy {
     }
   }
   #isAppConnectionResponse(message) {
-    return message.data.Ok?.GetAppConnection !== undefined;
+    return message.data.Ok.GetAppConnection !== undefined;
   }
   #startRefreshInterval() {
     this.#refreshIntervalId = setInterval(() => {
@@ -29918,6 +30195,44 @@ class WebRtcCommsProxy {
 // License, v2.0. If a copy of the MPL was not distributed with this
 // file, You can obtain one at http://mozilla.org/MPL/2.0/
 
+class ArtificialWorker extends EventTarget {
+  #selfTarget = new EventTarget();
+
+  // Post message from main to worker
+  // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
+  postMessage(data, _transferable) {
+    const event = new MessageEvent('message', {
+      data
+    });
+    this.#selfTarget.dispatchEvent(event);
+  }
+
+  // Listen for worker-to-main messages
+  // @ts-expect-error Make it typed
+  addEventListener(type, callback) {
+    super.addEventListener(type, callback);
+  }
+
+  // Post message from worker to main
+  // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
+  postMessageToMain(data, _transferable) {
+    const event = new MessageEvent('message', {
+      data
+    });
+    super.dispatchEvent(event);
+  }
+
+  // Listen for main-to-worker messages
+  // @ts-expect-error Make it typed
+  addEventListenerFromMain(type, callback) {
+    this.#selfTarget.addEventListener(type, callback);
+  }
+}
+
+// This Source Code Form is subject to the terms of the Mozilla Public
+// License, v2.0. If a copy of the MPL was not distributed with this
+// file, You can obtain one at http://mozilla.org/MPL/2.0/
+
 const MESSAGE_CHANNEL_NAME = "message";
 const SYSTEM_CHANNEL_NAME = "system";
 const COMMS_CHANNEL_NAME = "comms";
@@ -90253,7 +90568,7 @@ function legacy(parser) {
     return new LanguageSupport(StreamLanguage.define(parser));
 }
 function sql$1(dialectName) {
-    return import('./index-DeuAC1JS.js').then(m => m.sql({ dialect: m[dialectName] }));
+    return import('./index-Cq7so9Q9.js').then(m => m.sql({ dialect: m[dialectName] }));
 }
 /**
 An array of language descriptions for known language packages.
@@ -90264,7 +90579,7 @@ const languages = [
         name: "C",
         extensions: ["c", "h", "ino"],
         load() {
-            return import('./index-DZWFfAzL.js').then(m => m.cpp());
+            return import('./index-DI5QHg2x.js').then(m => m.cpp());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -90272,7 +90587,7 @@ const languages = [
         alias: ["cpp"],
         extensions: ["cpp", "c++", "cc", "cxx", "hpp", "h++", "hh", "hxx"],
         load() {
-            return import('./index-DZWFfAzL.js').then(m => m.cpp());
+            return import('./index-DI5QHg2x.js').then(m => m.cpp());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -90292,7 +90607,7 @@ const languages = [
         name: "Go",
         extensions: ["go"],
         load() {
-            return import('./index-WQ5HqEqM.js').then(m => m.go());
+            return import('./index-DM9oCkXH.js').then(m => m.go());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -90307,7 +90622,7 @@ const languages = [
         name: "Java",
         extensions: ["java"],
         load() {
-            return import('./index-CnJXVxDI.js').then(m => m.java());
+            return import('./index-CIfIw1LQ.js').then(m => m.java());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -90323,7 +90638,7 @@ const languages = [
         alias: ["json5"],
         extensions: ["json", "map"],
         load() {
-            return import('./index-qgG8SIsl.js').then(m => m.json());
+            return import('./index-D7jNrXVP.js').then(m => m.json());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -90337,14 +90652,14 @@ const languages = [
         name: "LESS",
         extensions: ["less"],
         load() {
-            return import('./index-DQBNcZG9.js').then(m => m.less());
+            return import('./index-d8vRrHr4.js').then(m => m.less());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
         name: "Liquid",
         extensions: ["liquid"],
         load() {
-            return import('./index-DXqNhUgR.js').then(m => m.liquid());
+            return import('./index-DCh-Eobo.js').then(m => m.liquid());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -90370,7 +90685,7 @@ const languages = [
         name: "PHP",
         extensions: ["php", "php3", "php4", "php5", "php7", "phtml"],
         load() {
-            return import('./index-DBIBZoxL.js').then(m => m.php());
+            return import('./index-BJofTpil.js').then(m => m.php());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -90387,28 +90702,28 @@ const languages = [
         extensions: ["BUILD", "bzl", "py", "pyw"],
         filename: /^(BUCK|BUILD)$/,
         load() {
-            return import('./index-BNgQTecN.js').then(m => m.python());
+            return import('./index-Zivk6fee.js').then(m => m.python());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
         name: "Rust",
         extensions: ["rs"],
         load() {
-            return import('./index-BPvLkg91.js').then(m => m.rust());
+            return import('./index-BwoyZPjj.js').then(m => m.rust());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
         name: "Sass",
         extensions: ["sass"],
         load() {
-            return import('./index-IH42B4Mg.js').then(m => m.sass({ indented: true }));
+            return import('./index-Di_-JfGf.js').then(m => m.sass({ indented: true }));
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
         name: "SCSS",
         extensions: ["scss"],
         load() {
-            return import('./index-IH42B4Mg.js').then(m => m.sass());
+            return import('./index-Di_-JfGf.js').then(m => m.sass());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -90439,7 +90754,7 @@ const languages = [
         name: "WebAssembly",
         extensions: ["wat", "wast"],
         load() {
-            return import('./index-Bm-sfjxA.js').then(m => m.wast());
+            return import('./index-BHzFgL5N.js').then(m => m.wast());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -90447,7 +90762,7 @@ const languages = [
         alias: ["rss", "wsdl", "xsd"],
         extensions: ["xml", "xsl", "xsd", "svg"],
         load() {
-            return import('./index-Wtqlsb8j.js').then(m => m.xml());
+            return import('./index-C1eH0RCy.js').then(m => m.xml());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -90455,7 +90770,7 @@ const languages = [
         alias: ["yml"],
         extensions: ["yaml", "yml"],
         load() {
-            return import('./index-DujAeBia.js').then(m => m.yaml());
+            return import('./index-DY6zQP_F.js').then(m => m.yaml());
         }
     }),
     // Legacy modes ported from CodeMirror 5
@@ -91251,13 +91566,13 @@ const languages = [
         name: "Vue",
         extensions: ["vue"],
         load() {
-            return import('./index-DlZBtd34.js').then(m => m.vue());
+            return import('./index-BTNGGXoa.js').then(m => m.vue());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
         name: "Angular Template",
         load() {
-            return import('./index-CzaJSWor.js').then(m => m.angular());
+            return import('./index-D9d5kqGf.js').then(m => m.angular());
         }
     })
 ];
@@ -162184,13 +162499,13 @@ const PanelToolbar = ({
     align: "start",
     justify: "start"
   }, /*#__PURE__*/React__default.createElement(Label$3, {
+    text: `Camera: ${targetFps ? `${targetFps} FPS` : "-"}`
+  }), /*#__PURE__*/React__default.createElement(Label$3, {
     text: `Network: ${metrics?.incomingMessagesFps ? `${metrics.incomingMessagesFps} FPS` : "-"}`
   }), /*#__PURE__*/React__default.createElement(Label$3, {
     text: `Decoding: ${metrics?.decodedMessagesFps ? `${metrics.decodedMessagesFps} FPS` : "-"}`
   }), /*#__PURE__*/React__default.createElement(Label$3, {
     text: `Rendering: ${renderedFps ? `${Math.round(renderedFps / 2)} FPS` : "-"}`
-  }), /*#__PURE__*/React__default.createElement(Label$3, {
-    text: `Camera: ${targetFps ? `${targetFps} FPS` : "-"}`
   }), /*#__PURE__*/React__default.createElement(Label$3, {
     text: `Frontend Delay: ${eventLoopDelay ? `${Math.ceil(eventLoopDelay)} ms` : "-"}`
   }))), !disableAnnotations && kind === "image" && /*#__PURE__*/React__default.createElement(DropdownMenu, {
@@ -162329,7 +162644,7 @@ function createRenderDelaySampler() {
   };
 }
 
-const ImagePanelComponent = /*#__PURE__*/React__default.lazy(async () => await import('./index-BND59L-_.js'));
+const ImagePanelComponent = /*#__PURE__*/React__default.lazy(async () => await import('./index-DAXpEznJ.js'));
 const ImagePanelBody = ({
   topic,
   frameRenderedEvent
@@ -162395,7 +162710,7 @@ const ImagePanel = /*#__PURE__*/React__default.memo(function ImagePanel(props) {
 // License, v2.0. If a copy of the MPL was not distributed with this
 // file, You can obtain one at http://mozilla.org/MPL/2.0/
 
-const ThreeDeeRenderComponent = /*#__PURE__*/React__default.lazy(async () => await import('./index-BQ-DVAKf.js'));
+const ThreeDeeRenderComponent = /*#__PURE__*/React__default.lazy(async () => await import('./index-BPWE58mB.js'));
 const PointCloudPanelBody = ({
   topic
 }) => {
@@ -162413,8 +162728,8 @@ const PointCloudPanelBody = ({
       distance: -2000,
       perspective: true,
       phi: 0,
-      target: [0, 0, 0],
-      targetOffset: [0, 0, 0],
+      target: [-2000, 0, 0],
+      targetOffset: [-500, -500, 0],
       targetOrientation: [0, 0, 0, 1],
       thetaOffset: 0,
       fovy: 45,

package/dist/{index-CzaJSWor.js → index-D9d5kqGf.js}

@@ -1,4 +1,4 @@
-import { aq as styleTags, ar as tags, aN as javascriptLanguage, as as LRLanguage, at as LanguageSupport, av as LRParser, aK as html, aL as parseMixed, au as ExternalTokenizer } from './index-Daz5hiMP.js';
+import { aq as styleTags, ar as tags, aN as javascriptLanguage, as as LRLanguage, at as LanguageSupport, av as LRParser, aK as html, aL as parseMixed, au as ExternalTokenizer } from './index-D8jKQuGu.js';
 import './FoxgloveServer-DiLI7KZU.js';
 import 'protobufjs/minimal';
 import 'ms';