@luxonis/visualizer-protobuf 1.8.8 → 1.10.0

package/dist/apps/depthai-visualizer/src/utils/metrics-manager.js

@@ -0,0 +1,25 @@
+export class MetricsManager {
+    metrics = {};
+    registerEvent(topic) {
+        const currentTime = performance.now();
+        this.metrics[topic] ??= [];
+        this.metrics[topic].unshift(currentTime);
+        this.metrics[topic].length = 100;
+    }
+    calculate(topic) {
+        const topicMetrics = this.metrics[topic];
+        if (!topicMetrics) {
+            return 0;
+        }
+        let totalInterval = 0;
+        for (let i = 1; i < topicMetrics.length; ++i) {
+            totalInterval += topicMetrics[i - 1] - topicMetrics[i];
+        }
+        if (isNaN(totalInterval)) {
+            return 0;
+        }
+        const fps = 1_000 / (totalInterval / (topicMetrics.length - 1));
+        return Math.round(fps);
+    }
+}
+//# sourceMappingURL=metrics-manager.js.map

package/dist/apps/depthai-visualizer/src/utils/metrics-manager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"metrics-manager.js","sourceRoot":"","sources":["../../../../../src/utils/metrics-manager.ts"],"names":[],"mappings":"AAAA,MAAM,OAAO,cAAc;IAClB,OAAO,GAA6B,EAAE,CAAC;IAEvC,aAAa,CAAC,KAAa;QAChC,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC;QACtC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;QAC3B,IAAI,CAAC,OAAO,CAAC,KAAK,CAAE,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;QAC1C,IAAI,CAAC,OAAO,CAAC,KAAK,CAAE,CAAC,MAAM,GAAG,GAAG,CAAC;IACpC,CAAC;IAEM,SAAS,CAAC,KAAa;QAC5B,MAAM,YAAY,GAAG,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QACzC,IAAI,CAAC,YAAY,EAAE,CAAC;YAClB,OAAO,CAAC,CAAC;QACX,CAAC;QAED,IAAI,aAAa,GAAG,CAAC,CAAC;QACtB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,YAAY,CAAC,MAAM,EAAE,EAAE,CAAC,EAAE,CAAC;YAC7C,aAAa,IAAI,YAAY,CAAC,CAAC,GAAG,CAAC,CAAE,GAAG,YAAY,CAAC,CAAC,CAAE,CAAC;QAC3D,CAAC;QAED,IAAI,KAAK,CAAC,aAAa,CAAC,EAAE,CAAC;YACzB,OAAO,CAAC,CAAC;QACX,CAAC;QAED,MAAM,GAAG,GAAG,KAAK,GAAG,CAAC,aAAa,GAAG,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;QAChE,OAAO,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IACzB,CAAC;CACF"}

package/dist/{index-DAPJpbdc.js → index-B90SOlyW.js}

@@ -1,5 +1,5 @@
-import { au as ExternalTokenizer, aq as styleTags, ar as tags, av as LRParser, as as LRLanguage, an as indentNodeProp, ao as continuedIndent, aA as delimitedIndent, ap as foldNodeProp, aB as foldInside, aK as html, at as LanguageSupport, aL as parseMixed } from './index-BBXW7Wxj.js';
-import './worker-utils-Jii8lIsy.js';
+import { au as ExternalTokenizer, aq as styleTags, ar as tags, av as LRParser, as as LRLanguage, an as indentNodeProp, ao as continuedIndent, aA as delimitedIndent, ap as foldNodeProp, aB as foldInside, aK as html, at as LanguageSupport, aL as parseMixed } from './index-C_gk0bw5.js';
+import './worker-utils-wwKCGQOc.js';
 import 'hydrated-ws';
 import 'ms';
 import 'protobufjs/minimal';

package/dist/{index-lDSplInz.js → index-BC0mvy9n.js}

@@ -1,5 +1,5 @@
-import { au as ExternalTokenizer, aC as ContextTracker, aq as styleTags, ar as tags, av as LRParser, ay as syntaxTree, aw as ifNotIn, as as LRLanguage, an as indentNodeProp, aA as delimitedIndent, ap as foldNodeProp, aB as foldInside, at as LanguageSupport, aF as IterMode, ax as completeFromList, aG as NodeWeakMap, aE as snippetCompletion } from './index-BBXW7Wxj.js';
-import './worker-utils-Jii8lIsy.js';
+import { au as ExternalTokenizer, aC as ContextTracker, aq as styleTags, ar as tags, av as LRParser, ay as syntaxTree, aw as ifNotIn, as as LRLanguage, an as indentNodeProp, aA as delimitedIndent, ap as foldNodeProp, aB as foldInside, at as LanguageSupport, aF as IterMode, ax as completeFromList, aG as NodeWeakMap, aE as snippetCompletion } from './index-C_gk0bw5.js';
+import './worker-utils-wwKCGQOc.js';
 import 'hydrated-ws';
 import 'ms';
 import 'protobufjs/minimal';

package/dist/{index-DlKZDt0v.js → index-BHB02ggP.js}

@@ -1,5 +1,5 @@
-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-BBXW7Wxj.js';
-import './worker-utils-Jii8lIsy.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-C_gk0bw5.js';
+import './worker-utils-wwKCGQOc.js';
 import 'hydrated-ws';
 import 'ms';
 import 'protobufjs/minimal';

package/dist/{index-ovt0UKFi.js → index-BKL2MC-f.js}

@@ -1,5 +1,5 @@
-import { aC as ContextTracker, au as ExternalTokenizer, aq as styleTags, ar as tags, av as LRParser, as as LRLanguage, an as indentNodeProp, ap as foldNodeProp, aM as bracketMatchingHandle, at as LanguageSupport, aI as EditorView, ay as syntaxTree, aJ as EditorSelection } from './index-BBXW7Wxj.js';
-import './worker-utils-Jii8lIsy.js';
+import { aC as ContextTracker, au as ExternalTokenizer, aq as styleTags, ar as tags, av as LRParser, as as LRLanguage, an as indentNodeProp, ap as foldNodeProp, aM as bracketMatchingHandle, at as LanguageSupport, aI as EditorView, ay as syntaxTree, aJ as EditorSelection } from './index-C_gk0bw5.js';
+import './worker-utils-wwKCGQOc.js';
 import 'hydrated-ws';
 import 'ms';
 import 'protobufjs/minimal';

package/dist/{index-Bpjac43y.js → index-BiY9B9Hp.js}

@@ -1,5 +1,5 @@
-import { au as ExternalTokenizer, aq as styleTags, ar as tags, av as LRParser, as as LRLanguage, an as indentNodeProp, ao as continuedIndent, ap as foldNodeProp, aB as foldInside, at as LanguageSupport } from './index-BBXW7Wxj.js';
-import './worker-utils-Jii8lIsy.js';
+import { au as ExternalTokenizer, aq as styleTags, ar as tags, av as LRParser, as as LRLanguage, an as indentNodeProp, ao as continuedIndent, ap as foldNodeProp, aB as foldInside, at as LanguageSupport } from './index-C_gk0bw5.js';
+import './worker-utils-wwKCGQOc.js';
 import 'hydrated-ws';
 import 'ms';
 import 'protobufjs/minimal';

package/dist/{index-CbLiW7lk.js → index-Bw-Q_7-v.js}

@@ -1,5 +1,5 @@
-import { aC as ContextTracker, au as ExternalTokenizer, aq as styleTags, ar as tags, av as LRParser, as as LRLanguage, an as indentNodeProp, aA as delimitedIndent, ap as foldNodeProp, aB as foldInside, at as LanguageSupport, aL as parseMixed } from './index-BBXW7Wxj.js';
-import './worker-utils-Jii8lIsy.js';
+import { aC as ContextTracker, au as ExternalTokenizer, aq as styleTags, ar as tags, av as LRParser, as as LRLanguage, an as indentNodeProp, aA as delimitedIndent, ap as foldNodeProp, aB as foldInside, at as LanguageSupport, aL as parseMixed } from './index-C_gk0bw5.js';
+import './worker-utils-wwKCGQOc.js';
 import 'hydrated-ws';
 import 'ms';
 import 'protobufjs/minimal';

package/dist/{index-Cl5tDqdc.js → index-Bw8PEeXU.js}

@@ -1,5 +1,5 @@
-import { aq as styleTags, ar as tags, av as LRParser, as as LRLanguage, an as indentNodeProp, ao as continuedIndent, az as flatIndent, aA as delimitedIndent, ap as foldNodeProp, aB as foldInside, at as LanguageSupport } from './index-BBXW7Wxj.js';
-import './worker-utils-Jii8lIsy.js';
+import { aq as styleTags, ar as tags, av as LRParser, as as LRLanguage, an as indentNodeProp, ao as continuedIndent, az as flatIndent, aA as delimitedIndent, ap as foldNodeProp, aB as foldInside, at as LanguageSupport } from './index-C_gk0bw5.js';
+import './worker-utils-wwKCGQOc.js';
 import 'hydrated-ws';
 import 'ms';
 import 'protobufjs/minimal';

package/dist/{index-BBXW7Wxj.js → index-C_gk0bw5.js}

@@ -1,4 +1,4 @@
-import { c as commonjsGlobal, g as getAugmentedNamespace, a as getDefaultExportFromCjs, T as Type$1, P as PointsAnnotationType$2, b as Profile, p as protobufsBySchema } from './worker-utils-Jii8lIsy.js';
+import { c as commonjsGlobal, g as getAugmentedNamespace, a as getDefaultExportFromCjs, T as Type$1, P as PointsAnnotationType$2, b as Profile, p as protobufsBySchema } from './worker-utils-wwKCGQOc.js';
 import * as React$1 from 'react';
 import React__default, { useContext, useRef, useLayoutEffect, createContext, useReducer, useState, useCallback, useMemo, forwardRef, createElement, Component, useEffect, Children, isValidElement, cloneElement, Fragment, useImperativeHandle, Suspense } from 'react';
 import { createStore, useStore } from 'zustand';
@@ -182,7 +182,7 @@ class Adapter extends EventTarget {
   constructor(wsUrl, worker) {
     super();
     this.url = wsUrl;
-    this.#worker = worker ?? new Worker(new URL("worker-D2k1TTky.js", import.meta.url), {
+    this.#worker = worker ?? new Worker(new URL("worker-ChM3ax4q.js", import.meta.url), {
       type: "module"
     });
     this.#handleMessageEvents();
@@ -11395,6 +11395,22 @@ function deserializePointCloudData({
     }],
     data: message.data
   };
+  if (message.color) {
+    foxgloveMessage.fields.push({
+      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
+    });
+    foxgloveMessage.point_stride = 15;
+  }
   callback({
     topic,
     receiveTime,
@@ -11632,11 +11648,35 @@ function createMessageHandler(callback) {
   };
 }
 
+class MetricsManager {
+  metrics = {};
+  registerEvent(topic) {
+    const currentTime = performance.now();
+    this.metrics[topic] ??= [];
+    this.metrics[topic].unshift(currentTime);
+    this.metrics[topic].length = 100;
+  }
+  calculate(topic) {
+    const topicMetrics = this.metrics[topic];
+    if (!topicMetrics) {
+      return 0;
+    }
+    let totalInterval = 0;
+    for (let i = 1; i < topicMetrics.length; ++i) {
+      totalInterval += topicMetrics[i - 1] - topicMetrics[i];
+    }
+    if (isNaN(totalInterval)) {
+      return 0;
+    }
+    const fps = 1_000 / (totalInterval / (topicMetrics.length - 1));
+    return Math.round(fps);
+  }
+}
+
 // 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 CURRENT_FRAME_MAXIMUM_SIZE_BYTES = 100 * 1024 * 1024;
 class ProblemManager {
   problems = [];
   addProblem(problem) {
@@ -11655,65 +11695,51 @@ class FoxgloveConnection {
   playerCapabilities = [PlayerCapabilities.playbackControl];
 
   // state options
-  parsedMessages = [];
-  parsedMessagesBytes = 0;
+  messageEvent = null;
   receivedBytes = 0;
   parameters = new Map();
   publishedTopics = new Map();
   subscribedTopics = new Map();
   advertisedServices = new Map();
   problems = new ProblemManager();
+  inputMetrics = new MetricsManager();
+  decodeMetrics = new MetricsManager();
 
   // message handler
 
   topics = {};
   constructor(id) {
     this.id = id;
-    this.messageHandler = createMessageHandler(this.handleMessageEvents.bind(this));
+    this.messageHandler = createMessageHandler(this.handleParsedMessage.bind(this));
   }
   setListener(listener) {
     this.listener = listener;
     this.emitState();
   }
+  getTopicMetrics(topic) {
+    return {
+      inputFPS: this.inputMetrics.calculate(topic),
+      postDecodeFPS: this.decodeMetrics.calculate(topic)
+    };
+  }
   getCurrentTime() {
     return dist$1.fromMillis(Date.now());
   }
   onMessagePacket(event) {
+    this.inputMetrics.registerEvent(event.data.topic);
     this.messageHandler.handle(event.data);
   }
-  handleMessageEvents(event) {
+  handleParsedMessage(event) {
+    this.decodeMetrics.registerEvent(event.topic);
     const messageSize = estimateObjectSize(event.message);
     event.sizeInBytes = messageSize;
-    this.parsedMessagesBytes += messageSize;
-    this.parsedMessages.push(event);
-    if (this.parsedMessagesBytes > CURRENT_FRAME_MAXIMUM_SIZE_BYTES) {
-      // console.debug(
-      //   `WebSocketPlayer maximum frame size (${(
-      //     CURRENT_FRAME_MAXIMUM_SIZE_BYTES / 1024 / 1024
-      //   ).toFixed(
-      //     2,
-      //   )}MB) reached. Dropping old messages. This accumulation can occur if the browser tab has been inactive.`,
-      // );
-
-      // Amortize cost of dropping messages by dropping parsedMessages size to
-      // 80% so that it doesn't happen for every message after reaching the limit
-      const evictUntilSize = 0.8 * CURRENT_FRAME_MAXIMUM_SIZE_BYTES;
-      let droppedBytes = 0;
-      let indexToCutBefore = 0;
-      while (this.parsedMessagesBytes - droppedBytes > evictUntilSize) {
-        droppedBytes += this.parsedMessages[indexToCutBefore].sizeInBytes;
-        indexToCutBefore++;
-      }
-      this.parsedMessages.splice(0, indexToCutBefore);
-      this.parsedMessagesBytes -= droppedBytes;
-    }
+    this.messageEvent = event;
     this.emitState();
   }
   emitState = debouncePromise(async () => {
-    const messages = this.parsedMessages;
-    this.parsedMessages = [];
-    this.parsedMessagesBytes = 0;
-    if (!this.listener) {
+    const message = this.messageEvent;
+    this.messageEvent = null;
+    if (!this.listener || !message) {
       await Promise.resolve();
       return;
     }
@@ -11726,12 +11752,10 @@ class FoxgloveConnection {
     }
     const problems = this.problems.getProblems();
     this.problems.clearProblems();
-    for (const message of messages) {
-      this.topics[message.topic] = {
-        name: message.topic,
-        schemaName: message.schemaName
-      };
-    }
+    this.topics[message.topic] = {
+      name: message.topic,
+      schemaName: message.schemaName
+    };
     const newPlayerState = {
       name: this.id,
       presence: this.playerPresence,
@@ -11742,7 +11766,7 @@ class FoxgloveConnection {
       problems,
       urlState: undefined,
       activeData: {
-        messages,
+        messages: [message],
         totalBytesReceived: this.receivedBytes,
         startTime: this.startTime,
         endTime: this.endTime,
@@ -11802,8 +11826,7 @@ class WebSocketConnection extends BaseConnection {
     this.emitState();
   };
   #onError = _event => {
-    this.parsedMessages = [];
-    this.parsedMessagesBytes = 0;
+    this.messageEvent = null;
     this.playerPresence = PlayerPresence.ERROR;
     this.emitState();
   };
@@ -19177,13 +19200,14 @@ function WorkspaceContextProvider(props) {
   }, children);
 }
 
+const Context$2 = React__default.createContext([]);
+const ConnectionsProvider = Context$2.Provider;
+const useConnections = () => React__default.useContext(Context$2);
+
 const selectRenderDone = state => state.renderDone;
 function MessagePipelineProvider(props) {
+  const connections = useConnections();
   const promisesToWaitForRef = useRef([]);
-  const {
-    children,
-    connections
-  } = props;
   const store = useMemo(() => {
     return createMessagePipelineStore({
       promisesToWaitForRef,
@@ -19221,7 +19245,7 @@ function MessagePipelineProvider(props) {
   }, [connections, store]);
   return /*#__PURE__*/React__default.createElement(ContextInternal.Provider, {
     value: store
-  }, children);
+  }, props.children);
 }
 function createMessageListener(args) {
   const {
@@ -19374,19 +19398,21 @@ const VisualizerContext = /*#__PURE__*/React__default.memo(function VisualizerCo
       return undefined;
     }
   };
+
+  // TODO: Simplify
   return /*#__PURE__*/React__default.createElement(AppConfigurationContext.Provider, {
     value: appConfiguration
   }, /*#__PURE__*/React__default.createElement(DndProvider, {
     backend: HTML5Backend
-  }, /*#__PURE__*/React__default.createElement(WorkspaceContextProvider, null, /*#__PURE__*/React__default.createElement(GlobalCss, null), /*#__PURE__*/React__default.createElement(CssBaseline, null, /*#__PURE__*/React__default.createElement(ErrorBoundary, null, /*#__PURE__*/React__default.createElement(TimelineInteractionStateProvider, null, /*#__PURE__*/React__default.createElement(CurrentLayoutProvider, null, /*#__PURE__*/React__default.createElement(MessagePipelineProvider, {
-    connections: connections
-  }, /*#__PURE__*/React__default.createElement(EventsProvider, null, /*#__PURE__*/React__default.createElement(MosaicContext.Provider, {
+  }, /*#__PURE__*/React__default.createElement(WorkspaceContextProvider, null, /*#__PURE__*/React__default.createElement(GlobalCss, null), /*#__PURE__*/React__default.createElement(CssBaseline, null, /*#__PURE__*/React__default.createElement(ErrorBoundary, null, /*#__PURE__*/React__default.createElement(TimelineInteractionStateProvider, null, /*#__PURE__*/React__default.createElement(CurrentLayoutProvider, null, /*#__PURE__*/React__default.createElement(ConnectionsProvider, {
+    value: connections
+  }, /*#__PURE__*/React__default.createElement(MessagePipelineProvider, null, /*#__PURE__*/React__default.createElement(EventsProvider, null, /*#__PURE__*/React__default.createElement(MosaicContext.Provider, {
     value: mosaicContext
   }, /*#__PURE__*/React__default.createElement(MosaicWindowContext.Provider, {
     value: mosaicWindowContext
   }, /*#__PURE__*/React__default.createElement(PanelCatalogContext.Provider, {
     value: panelCatalog
-  }, /*#__PURE__*/React__default.createElement(PanelStateContextProvider, null, children)))))))))))));
+  }, /*#__PURE__*/React__default.createElement(PanelStateContextProvider, null, children))))))))))))));
 });
 
 function _classCallCheck(instance, Constructor) {
@@ -82973,7 +82999,7 @@ function legacy(parser) {
     return new LanguageSupport(StreamLanguage.define(parser));
 }
 function sql$1(dialectName) {
-    return import('./index-pNYe-U8V.js').then(m => m.sql({ dialect: m[dialectName] }));
+    return import('./index-LU4UNxxi.js').then(m => m.sql({ dialect: m[dialectName] }));
 }
 /**
 An array of language descriptions for known language packages.
@@ -82984,7 +83010,7 @@ const languages = [
         name: "C",
         extensions: ["c", "h", "ino"],
         load() {
-            return import('./index-DkQzCBNS.js').then(m => m.cpp());
+            return import('./index-CgAqNIiJ.js').then(m => m.cpp());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -82992,7 +83018,7 @@ const languages = [
         alias: ["cpp"],
         extensions: ["cpp", "c++", "cc", "cxx", "hpp", "h++", "hh", "hxx"],
         load() {
-            return import('./index-DkQzCBNS.js').then(m => m.cpp());
+            return import('./index-CgAqNIiJ.js').then(m => m.cpp());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -83012,7 +83038,7 @@ const languages = [
         name: "Go",
         extensions: ["go"],
         load() {
-            return import('./index-zKmjws_7.js').then(m => m.go());
+            return import('./index-Cngl5F-F.js').then(m => m.go());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -83027,7 +83053,7 @@ const languages = [
         name: "Java",
         extensions: ["java"],
         load() {
-            return import('./index-Cl5tDqdc.js').then(m => m.java());
+            return import('./index-Bw8PEeXU.js').then(m => m.java());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -83043,7 +83069,7 @@ const languages = [
         alias: ["json5"],
         extensions: ["json", "map"],
         load() {
-            return import('./index-H6bxF3CN.js').then(m => m.json());
+            return import('./index-N0R0IEbS.js').then(m => m.json());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -83057,14 +83083,14 @@ const languages = [
         name: "LESS",
         extensions: ["less"],
         load() {
-            return import('./index-W-M5T20d.js').then(m => m.less());
+            return import('./index-EvfybjSU.js').then(m => m.less());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
         name: "Liquid",
         extensions: ["liquid"],
         load() {
-            return import('./index-DCbNqqQc.js').then(m => m.liquid());
+            return import('./index-DHbA32BQ.js').then(m => m.liquid());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -83090,7 +83116,7 @@ const languages = [
         name: "PHP",
         extensions: ["php", "php3", "php4", "php5", "php7", "phtml"],
         load() {
-            return import('./index-DAPJpbdc.js').then(m => m.php());
+            return import('./index-B90SOlyW.js').then(m => m.php());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -83107,28 +83133,28 @@ const languages = [
         extensions: ["BUILD", "bzl", "py", "pyw"],
         filename: /^(BUCK|BUILD)$/,
         load() {
-            return import('./index-lDSplInz.js').then(m => m.python());
+            return import('./index-BC0mvy9n.js').then(m => m.python());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
         name: "Rust",
         extensions: ["rs"],
         load() {
-            return import('./index-Bpjac43y.js').then(m => m.rust());
+            return import('./index-BiY9B9Hp.js').then(m => m.rust());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
         name: "Sass",
         extensions: ["sass"],
         load() {
-            return import('./index-CF21cEJo.js').then(m => m.sass({ indented: true }));
+            return import('./index-DuGBc6J-.js').then(m => m.sass({ indented: true }));
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
         name: "SCSS",
         extensions: ["scss"],
         load() {
-            return import('./index-CF21cEJo.js').then(m => m.sass());
+            return import('./index-DuGBc6J-.js').then(m => m.sass());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -83159,7 +83185,7 @@ const languages = [
         name: "WebAssembly",
         extensions: ["wat", "wast"],
         load() {
-            return import('./index-F8-9liAo.js').then(m => m.wast());
+            return import('./index-p-TovfmA.js').then(m => m.wast());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -83167,7 +83193,7 @@ const languages = [
         alias: ["rss", "wsdl", "xsd"],
         extensions: ["xml", "xsl", "xsd", "svg"],
         load() {
-            return import('./index-ovt0UKFi.js').then(m => m.xml());
+            return import('./index-BKL2MC-f.js').then(m => m.xml());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -83175,7 +83201,7 @@ const languages = [
         alias: ["yml"],
         extensions: ["yaml", "yml"],
         load() {
-            return import('./index-CbLiW7lk.js').then(m => m.yaml());
+            return import('./index-Bw-Q_7-v.js').then(m => m.yaml());
         }
     }),
     // Legacy modes ported from CodeMirror 5
@@ -83971,13 +83997,13 @@ const languages = [
         name: "Vue",
         extensions: ["vue"],
         load() {
-            return import('./index-QEJn3K9v.js').then(m => m.vue());
+            return import('./index-DMZhlvho.js').then(m => m.vue());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
         name: "Angular Template",
         load() {
-            return import('./index-DlKZDt0v.js').then(m => m.angular());
+            return import('./index-BHB02ggP.js').then(m => m.angular());
         }
     })
 ];
@@ -154040,6 +154066,14 @@ const PanelToolbar = ({
   const {
     detections
   } = useDetections();
+  const connections = useConnections();
+  const [metrics, setMetrics] = React__default.useState();
+  React__default.useEffect(() => {
+    const interval = setInterval(() => {
+      setMetrics(connections[0]?.getTopicMetrics(topic));
+    }, 500);
+    return () => clearInterval(interval);
+  }, []);
   const [annotationsOpened, setAnnotationsOpened] = React__default.useState(false);
   const hasExtra = React__default.useMemo(() => detections.some(topic => topic.extra && !topic.enabled), [detections]);
   const [extraVisible, setExtraVisible] = React__default.useState(false);
@@ -154051,6 +154085,11 @@ const PanelToolbar = ({
       })
     })));
   }, [detections, setDetections]);
+
+  // TODO: show only when debug mode is ON
+  const name = React__default.useMemo(() => {
+    return `${topic} - ${metrics?.inputFPS || 0}/${metrics?.postDecodeFPS || 0} FPS`;
+  }, [topic, metrics]);
   return /*#__PURE__*/React__default.createElement(Flex, {
     direction: "row",
     gap: "sm",
@@ -154060,7 +154099,7 @@ const PanelToolbar = ({
       paddingLeft: 16
     }
   }, /*#__PURE__*/React__default.createElement(SubHeader, {
-    text: topic
+    text: name
   }), !disableAnnotations && kind === 'image' && /*#__PURE__*/React__default.createElement(DropdownMenu, {
     onOpenChange: setAnnotationsOpened
   }, /*#__PURE__*/React__default.createElement(DropdownMenuTrigger, {
@@ -154167,7 +154206,7 @@ const Panel = ({
   }, children))))));
 };
 
-const ImagePanelComponent = /*#__PURE__*/React__default.lazy(async () => await import('./index-DUnP2Xma.js'));
+const ImagePanelComponent = /*#__PURE__*/React__default.lazy(async () => await import('./index-CuGn8iKw.js'));
 const ImagePanelBody = ({
   topic
 }) => {
@@ -154202,7 +154241,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-0Q6EqxBW.js'));
+const ThreeDeeRenderComponent = /*#__PURE__*/React__default.lazy(async () => await import('./index-DhuAGhcS.js'));
 const PointCloudPanelBody = ({
   topic
 }) => {

package/dist/{index-DkQzCBNS.js → index-CgAqNIiJ.js}

@@ -1,5 +1,5 @@
-import { au as ExternalTokenizer, aq as styleTags, ar as tags, av as LRParser, as as LRLanguage, an as indentNodeProp, ao as continuedIndent, az as flatIndent, aA as delimitedIndent, ap as foldNodeProp, aB as foldInside, at as LanguageSupport } from './index-BBXW7Wxj.js';
-import './worker-utils-Jii8lIsy.js';
+import { au as ExternalTokenizer, aq as styleTags, ar as tags, av as LRParser, as as LRLanguage, an as indentNodeProp, ao as continuedIndent, az as flatIndent, aA as delimitedIndent, ap as foldNodeProp, aB as foldInside, at as LanguageSupport } from './index-C_gk0bw5.js';
+import './worker-utils-wwKCGQOc.js';
 import 'hydrated-ws';
 import 'ms';
 import 'protobufjs/minimal';

package/dist/{index-zKmjws_7.js → index-Cngl5F-F.js}

@@ -1,5 +1,5 @@
-import { au as ExternalTokenizer, aC as ContextTracker, aq as styleTags, ar as tags, av as LRParser, aD as LocalTokenGroup, aE as snippetCompletion, ay as syntaxTree, as as LRLanguage, an as indentNodeProp, ao as continuedIndent, az as flatIndent, aA as delimitedIndent, ap as foldNodeProp, aB as foldInside, at as LanguageSupport, aw as ifNotIn, ax as completeFromList, aF as IterMode, aG as NodeWeakMap } from './index-BBXW7Wxj.js';
-import './worker-utils-Jii8lIsy.js';
+import { au as ExternalTokenizer, aC as ContextTracker, aq as styleTags, ar as tags, av as LRParser, aD as LocalTokenGroup, aE as snippetCompletion, ay as syntaxTree, as as LRLanguage, an as indentNodeProp, ao as continuedIndent, az as flatIndent, aA as delimitedIndent, ap as foldNodeProp, aB as foldInside, at as LanguageSupport, aw as ifNotIn, ax as completeFromList, aF as IterMode, aG as NodeWeakMap } from './index-C_gk0bw5.js';
+import './worker-utils-wwKCGQOc.js';
 import 'hydrated-ws';
 import 'ms';
 import 'protobufjs/minimal';

package/dist/{index-DUnP2Xma.js → index-CuGn8iKw.js}

@@ -1,8 +1,8 @@
-import { ImagePanel } from './index-0Q6EqxBW.js';
+import { ImagePanel } from './index-DhuAGhcS.js';
 import 'react';
 import 'react-dom';
-import './index-BBXW7Wxj.js';
-import './worker-utils-Jii8lIsy.js';
+import './index-C_gk0bw5.js';
+import './worker-utils-wwKCGQOc.js';
 import 'hydrated-ws';
 import 'ms';
 import 'protobufjs/minimal';

package/dist/{index-DCbNqqQc.js → index-DHbA32BQ.js}

@@ -1,5 +1,5 @@
-import { aI as EditorView, aJ as EditorSelection, as as LRLanguage, aq as styleTags, ar as tags, an as indentNodeProp, aA as delimitedIndent, ap as foldNodeProp, at as LanguageSupport, av as LRParser, ay as syntaxTree, aK as html, aL as parseMixed, au as ExternalTokenizer } from './index-BBXW7Wxj.js';
-import './worker-utils-Jii8lIsy.js';
+import { aI as EditorView, aJ as EditorSelection, as as LRLanguage, aq as styleTags, ar as tags, an as indentNodeProp, aA as delimitedIndent, ap as foldNodeProp, at as LanguageSupport, av as LRParser, ay as syntaxTree, aK as html, aL as parseMixed, au as ExternalTokenizer } from './index-C_gk0bw5.js';
+import './worker-utils-wwKCGQOc.js';
 import 'hydrated-ws';
 import 'ms';
 import 'protobufjs/minimal';

package/dist/{index-QEJn3K9v.js → index-DMZhlvho.js}

@@ -1,5 +1,5 @@
-import { aq as styleTags, ar as tags, as as LRLanguage, at as LanguageSupport, av as LRParser, aD as LocalTokenGroup, aK as html, aL as parseMixed, aN as javascriptLanguage } from './index-BBXW7Wxj.js';
-import './worker-utils-Jii8lIsy.js';
+import { aq as styleTags, ar as tags, as as LRLanguage, at as LanguageSupport, av as LRParser, aD as LocalTokenGroup, aK as html, aL as parseMixed, aN as javascriptLanguage } from './index-C_gk0bw5.js';
+import './worker-utils-wwKCGQOc.js';
 import 'hydrated-ws';
 import 'ms';
 import 'protobufjs/minimal';

package/dist/{index-0Q6EqxBW.js → index-DhuAGhcS.js}

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import React__default, { useReducer, useRef, useCallback, useLayoutEffect, Component, useContext, useState, useEffect, createContext, forwardRef, createElement, cloneElement, useMemo, Profiler, StrictMode } from 'react';
 import ReactDOM__default from 'react-dom';
-import { i as isSymbol, t as toString, k as keys, g as getSymbols$1, s as stubArray, a as arrayPush, b as baseGetAllKeys, c as getTag, d as getAllKeys, e as createAggregator, f as baseGet, h as baseIteratee, j as castPath, l as toKey, m as flatRest, n as arrayMap$1, o as baseSet, p as baseUniq, q as baseFlatten, r as generateUtilityClass, A as AnalyticsContext, u as useMustNotChange, P as PropTypes, v as useCurrentLayoutActions, w as useCurrentLayoutSelector, x as reportError, y as AppError, E as ErrorDisplay, S as Stack$1, z as makeStyles$1, _ as _extends$1, L as Logger, B as useGuaranteedContext, W as WorkspaceContext, C as useAnalytics, D as AppEvent, F as LeftSidebarItemKeys, R as RightSidebarItemKeys, G as usePanelMosaicId, H as useTranslation, I as usePanelCatalog, J as EmptyState, K as isEmpty, M as PanelContext, N as PanelCatalogContext, O as useSelectedPanels, Q as usePanelStateStore, T as useDefaultPanelTitle, U as PANEL_TITLE_CONFIG_KEY, V as noop$4, X as getPanelTypeFromId, Y as useWorkspaceStore, Z as useShallowMemo, $ as TAB_PANEL_TYPE, a0 as WorkspaceStoreSelectors, a1 as difference, a2 as filterMap, a3 as dist$3, a4 as usePanelContext, a5 as useMessagePipeline, a6 as v4, a7 as useHoverValue, a8 as useSetHoverValue, a9 as useClearHoverValue, aa as useAppConfiguration, ab as useMessagePipelineGetter, ac as usePanelSettingsTreeUpdate, ad as PlayerCapabilities, ae as useValueChangedDebugLog, af as assertNever, ag as PlayerPresence, ah as typescript, ai as isEqual, aj as isDesktopApp, ak as createTheme, al as propTypesExports, am as useJsonTreeTheme } from './index-BBXW7Wxj.js';
+import { i as isSymbol, t as toString, k as keys, g as getSymbols$1, s as stubArray, a as arrayPush, b as baseGetAllKeys, c as getTag, d as getAllKeys, e as createAggregator, f as baseGet, h as baseIteratee, j as castPath, l as toKey, m as flatRest, n as arrayMap$1, o as baseSet, p as baseUniq, q as baseFlatten, r as generateUtilityClass, A as AnalyticsContext, u as useMustNotChange, P as PropTypes, v as useCurrentLayoutActions, w as useCurrentLayoutSelector, x as reportError, y as AppError, E as ErrorDisplay, S as Stack$1, z as makeStyles$1, _ as _extends$1, L as Logger, B as useGuaranteedContext, W as WorkspaceContext, C as useAnalytics, D as AppEvent, F as LeftSidebarItemKeys, R as RightSidebarItemKeys, G as usePanelMosaicId, H as useTranslation, I as usePanelCatalog, J as EmptyState, K as isEmpty, M as PanelContext, N as PanelCatalogContext, O as useSelectedPanels, Q as usePanelStateStore, T as useDefaultPanelTitle, U as PANEL_TITLE_CONFIG_KEY, V as noop$4, X as getPanelTypeFromId, Y as useWorkspaceStore, Z as useShallowMemo, $ as TAB_PANEL_TYPE, a0 as WorkspaceStoreSelectors, a1 as difference, a2 as filterMap, a3 as dist$3, a4 as usePanelContext, a5 as useMessagePipeline, a6 as v4, a7 as useHoverValue, a8 as useSetHoverValue, a9 as useClearHoverValue, aa as useAppConfiguration, ab as useMessagePipelineGetter, ac as usePanelSettingsTreeUpdate, ad as PlayerCapabilities, ae as useValueChangedDebugLog, af as assertNever, ag as PlayerPresence, ah as typescript, ai as isEqual, aj as isDesktopApp, ak as createTheme, al as propTypesExports, am as useJsonTreeTheme } from './index-C_gk0bw5.js';
 import { createStore, useStore } from 'zustand';
 import { MosaicDragType, MosaicContext, MosaicWindowContext, getOtherBranch, getNodeAtPath } from 'react-mosaic-component';
-import { a as getDefaultExportFromCjs, c as commonjsGlobal, g as getAugmentedNamespace, E as EventEmitter } from './worker-utils-Jii8lIsy.js';
+import { a as getDefaultExportFromCjs, c as commonjsGlobal, g as getAugmentedNamespace, E as EventEmitter } from './worker-utils-wwKCGQOc.js';
 import { Link, Button, alpha, IconButton, Card, CardActionArea, CardMedia, CardContent, Typography, Container, Tooltip, Fade, ListItem, ListItemButton, ListItemText, List, TextField, InputAdornment, Popper, Grow, Paper, ClickAwayListener, Menu, MenuItem, Divider, buttonClasses, Backdrop, Chip, useTheme, alertClasses, darken, lighten, inputBaseClasses, autocompleteClasses, inputClasses, Checkbox, dialogActionsClasses, filledInputClasses, inputAdornmentClasses, listSubheaderClasses, selectClasses, tableCellClasses, ThemeProvider as ThemeProvider$1, SvgIcon, tabsClasses as tabsClasses$1, tabClasses, Tabs, Tab, ListItemIcon } from '@mui/material';
 import { p as isObject, r as root, E as copyObject, F as keysIn, G as getPrototype, H as cloneArrayBuffer, S as Symbol$1, I as cloneTypedArray, i as isObjectLike, J as nodeUtil, K as baseUnary, L as copyArray, l as isBuffer, N as cloneBuffer, O as initCloneObject, m as Stack, a as isArray, A as assignValue, z as baseAssignValue, x as baseRest, P as isPlainObject$1, y as isArrayLikeObject, B as tinycolor, Q as t$1, C as merge$1, D as instance } from './i18next-C5Qe4-E1.js';
 import FullscreenExitIcon from '@mui/icons-material/FullscreenExit';

package/dist/{index-CF21cEJo.js → index-DuGBc6J-.js}

@@ -1,5 +1,5 @@
-import { au as ExternalTokenizer, aC as ContextTracker, aq as styleTags, ar as tags, av as LRParser, as as LRLanguage, ap as foldNodeProp, aB as foldInside, an as indentNodeProp, ao as continuedIndent, aH as defineCSSCompletionSource, at as LanguageSupport } from './index-BBXW7Wxj.js';
-import './worker-utils-Jii8lIsy.js';
+import { au as ExternalTokenizer, aC as ContextTracker, aq as styleTags, ar as tags, av as LRParser, as as LRLanguage, ap as foldNodeProp, aB as foldInside, an as indentNodeProp, ao as continuedIndent, aH as defineCSSCompletionSource, at as LanguageSupport } from './index-C_gk0bw5.js';
+import './worker-utils-wwKCGQOc.js';
 import 'hydrated-ws';
 import 'ms';
 import 'protobufjs/minimal';

package/dist/{index-W-M5T20d.js → index-EvfybjSU.js}

@@ -1,5 +1,5 @@
-import { aq as styleTags, ar as tags, as as LRLanguage, an as indentNodeProp, ao as continuedIndent, ap as foldNodeProp, aB as foldInside, aH as defineCSSCompletionSource, at as LanguageSupport, av as LRParser, au as ExternalTokenizer } from './index-BBXW7Wxj.js';
-import './worker-utils-Jii8lIsy.js';
+import { aq as styleTags, ar as tags, as as LRLanguage, an as indentNodeProp, ao as continuedIndent, ap as foldNodeProp, aB as foldInside, aH as defineCSSCompletionSource, at as LanguageSupport, av as LRParser, au as ExternalTokenizer } from './index-C_gk0bw5.js';
+import './worker-utils-wwKCGQOc.js';
 import 'hydrated-ws';
 import 'ms';
 import 'protobufjs/minimal';