@luxonis/visualizer-protobuf 2.20.0 → 2.21.0

package/dist/{index-DLQIVtvt.js → index-C5TmQKcg.js}

@@ -1,4 +1,4 @@
-import { U as ExternalTokenizer, N as styleTags, O as tags, V as LRParser, Q as LRLanguage, J as indentNodeProp, K as continuedIndent, $ as flatIndent, a0 as delimitedIndent, M as foldNodeProp, a1 as foldInside, T as LanguageSupport } from './index-C4JrCXqa.js';
+import { U as ExternalTokenizer, N as styleTags, O as tags, V as LRParser, Q as LRLanguage, J as indentNodeProp, K as continuedIndent, $ as flatIndent, a0 as delimitedIndent, M as foldNodeProp, a1 as foldInside, T as LanguageSupport } from './index-C05r9Gk7.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/{index-hDQVp6bN.js → index-C7mMy9Y-.js}

@@ -1,4 +1,4 @@
-import { U as ExternalTokenizer, N as styleTags, O as tags, V as LRParser, Q as LRLanguage, J as indentNodeProp, K as continuedIndent, M as foldNodeProp, a1 as foldInside, T as LanguageSupport } from './index-C4JrCXqa.js';
+import { U as ExternalTokenizer, N as styleTags, O as tags, V as LRParser, Q as LRLanguage, J as indentNodeProp, K as continuedIndent, M as foldNodeProp, a1 as foldInside, T as LanguageSupport } from './index-C05r9Gk7.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/{index-XP-Bj_XI.js → index-CtH73YZC.js}

@@ -1,4 +1,4 @@
-import { U as ExternalTokenizer, a2 as ContextTracker, N as styleTags, O as tags, V as LRParser, Q as LRLanguage, M as foldNodeProp, a1 as foldInside, J as indentNodeProp, K as continuedIndent, a7 as defineCSSCompletionSource, T as LanguageSupport } from './index-C4JrCXqa.js';
+import { U as ExternalTokenizer, a2 as ContextTracker, N as styleTags, O as tags, V as LRParser, Q as LRLanguage, M as foldNodeProp, a1 as foldInside, J as indentNodeProp, K as continuedIndent, a7 as defineCSSCompletionSource, T as LanguageSupport } from './index-C05r9Gk7.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/{index-Dr1IjG1N.js → index-Cx8N6SZ0.js}

@@ -1,4 +1,4 @@
-import { U as ExternalTokenizer, N as styleTags, O as tags, V as LRParser, Q as LRLanguage, J as indentNodeProp, K as continuedIndent, a0 as delimitedIndent, M as foldNodeProp, a1 as foldInside, aa as html, T as LanguageSupport, ab as parseMixed } from './index-C4JrCXqa.js';
+import { U as ExternalTokenizer, N as styleTags, O as tags, V as LRParser, Q as LRLanguage, J as indentNodeProp, K as continuedIndent, a0 as delimitedIndent, M as foldNodeProp, a1 as foldInside, aa as html, T as LanguageSupport, ab as parseMixed } from './index-C05r9Gk7.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/{index-BpeL_ibo.js → index-D1_PpZqZ.js}

@@ -1,4 +1,4 @@
-import { U as ExternalTokenizer, a2 as ContextTracker, N as styleTags, O as tags, V as LRParser, Z as syntaxTree, X as ifNotIn, Q as LRLanguage, J as indentNodeProp, a0 as delimitedIndent, M as foldNodeProp, a1 as foldInside, T as LanguageSupport, a5 as IterMode, Y as completeFromList, a6 as NodeWeakMap, a4 as snippetCompletion } from './index-C4JrCXqa.js';
+import { U as ExternalTokenizer, a2 as ContextTracker, N as styleTags, O as tags, V as LRParser, Z as syntaxTree, X as ifNotIn, Q as LRLanguage, J as indentNodeProp, a0 as delimitedIndent, M as foldNodeProp, a1 as foldInside, T as LanguageSupport, a5 as IterMode, Y as completeFromList, a6 as NodeWeakMap, a4 as snippetCompletion } from './index-C05r9Gk7.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/{index-BfRMsy3f.js → index-DAbMVrLS.js}

@@ -1,4 +1,4 @@
-import { N as styleTags, O as tags, Q as LRLanguage, T as LanguageSupport, V as LRParser, a3 as LocalTokenGroup, aa as html, ab as parseMixed, ad as javascriptLanguage } from './index-C4JrCXqa.js';
+import { N as styleTags, O as tags, Q as LRLanguage, T as LanguageSupport, V as LRParser, a3 as LocalTokenGroup, aa as html, ab as parseMixed, ad as javascriptLanguage } from './index-C05r9Gk7.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/{index-CmON-FIE.js → index-DV-ASUfa.js}

@@ -3,7 +3,7 @@ import React__default, { useReducer, useRef, useCallback, useLayoutEffect, Compo
 import ReactDOM__default from 'react-dom';
 import { S as isSymbol, U as toString, V as keys, W as getSymbols$1, X as stubArray, Y as arrayPush, Z as baseGetAllKeys, g as getTag, $ as getAllKeys, k as baseGet, c as baseIteratee, j as castPath, t as toKey, a0 as arrayMap$1, a1 as baseUniq, b as baseFlatten, a2 as useMustNotChange, a3 as useCurrentLayoutActions, a4 as useCurrentLayoutSelector, r as reportError, A as AppError, L as Logger, u as useGuaranteedContext, a5 as usePanelMosaicId, a6 as useSelectedPanels, a7 as PANEL_TITLE_CONFIG_KEY, a8 as noop$4, o as getPanelTypeFromId, M as useShallowMemo, T as TAB_PANEL_TYPE, J as filterMap, d as dist$3, a9 as useAppConfiguration, aa as useValueChangedDebugLog, ab as useJsonTreeTheme } from './tslib.es6-C73eoP_E.js';
 import { createStore, useStore } from 'zustand';
-import { g as generateUtilityClass, c as createAggregator, f as flatRest, b as baseSet, A as AnalyticsContext, P as PropTypes, E as ErrorDisplay, S as Stack$1, m as makeStyles$1, _ as _extends$1, W as WorkspaceContext, u as useAnalytics, a as AppEvent, L as LeftSidebarItemKeys, R as RightSidebarItemKeys, d as useTranslation, e as usePanelCatalog, h as EmptyState, i as isEmpty, j as PanelContext, k as PanelCatalogContext, l as usePanelStateStore, n as useDefaultPanelTitle, o as useWorkspaceStore, p as WorkspaceStoreSelectors, q as difference, r as usePanelContext, s as useMessagePipeline, v as v4, t as useHoverValue, w as useSetHoverValue, x as useClearHoverValue, y as useMessagePipelineGetter, z as usePanelSettingsTreeUpdate, B as PlayerCapabilities, C as assertNever, D as PlayerPresence, F as isEqual, G as isDesktopApp, H as createTheme, I as propTypesExports } from './index-C4JrCXqa.js';
+import { g as generateUtilityClass, c as createAggregator, f as flatRest, b as baseSet, A as AnalyticsContext, P as PropTypes, E as ErrorDisplay, S as Stack$1, m as makeStyles$1, _ as _extends$1, W as WorkspaceContext, u as useAnalytics, a as AppEvent, L as LeftSidebarItemKeys, R as RightSidebarItemKeys, d as useTranslation, e as usePanelCatalog, h as EmptyState, i as isEmpty, j as PanelContext, k as PanelCatalogContext, l as usePanelStateStore, n as useDefaultPanelTitle, o as useWorkspaceStore, p as WorkspaceStoreSelectors, q as difference, r as usePanelContext, s as useMessagePipeline, v as v4, t as useHoverValue, w as useSetHoverValue, x as useClearHoverValue, y as useMessagePipelineGetter, z as usePanelSettingsTreeUpdate, B as PlayerCapabilities, C as assertNever, D as PlayerPresence, F as isEqual, G as isDesktopApp, H as createTheme, I as propTypesExports } from './index-C05r9Gk7.js';
 import { MosaicDragType, MosaicContext, MosaicWindowContext, getOtherBranch, getNodeAtPath } from 'react-mosaic-component';
 import { t as typescript } from './useMessageReducer-jNx5e6JW.js';
 import { g as getDefaultExportFromCjs, c as commonjsGlobal, a as getAugmentedNamespace } from './_commonjsHelpers-E-ZsRS8r.js';

package/dist/{index-D6Dyzzev.js → index-DXdZ7iZZ.js}

@@ -1,4 +1,4 @@
-import { N as styleTags, O as tags, ad as javascriptLanguage, Q as LRLanguage, T as LanguageSupport, V as LRParser, aa as html, ab as parseMixed, U as ExternalTokenizer } from './index-C4JrCXqa.js';
+import { N as styleTags, O as tags, ad as javascriptLanguage, Q as LRLanguage, T as LanguageSupport, V as LRParser, aa as html, ab as parseMixed, U as ExternalTokenizer } from './index-C05r9Gk7.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/{index-B5bnTrz3.js → index-DeylskOS.js}

@@ -1,4 +1,4 @@
-import { ImagePanel } from './index-CmON-FIE.js';
+import { ImagePanel } from './index-DV-ASUfa.js';
 import 'react';
 import 'react-dom';
 import './tslib.es6-C73eoP_E.js';
@@ -7,7 +7,7 @@ import './_commonjsHelpers-E-ZsRS8r.js';
 import '@mui/material';
 import './isArrayLikeObject-Bytw9p-q.js';
 import 'zustand';
-import './index-C4JrCXqa.js';
+import './index-C05r9Gk7.js';
 import './utils-Cmsz3FxA.js';
 import './comlink-DHMAu6X7.js';
 import './FoxgloveServer-C39Uooyk.js';

package/dist/{index-DNFBslJY.js → index-DimpbTOv.js}

@@ -1,4 +1,4 @@
-import { a2 as ContextTracker, U as ExternalTokenizer, N as styleTags, O as tags, V as LRParser, Q as LRLanguage, J as indentNodeProp, a0 as delimitedIndent, M as foldNodeProp, a1 as foldInside, T as LanguageSupport, ab as parseMixed } from './index-C4JrCXqa.js';
+import { a2 as ContextTracker, U as ExternalTokenizer, N as styleTags, O as tags, V as LRParser, Q as LRLanguage, J as indentNodeProp, a0 as delimitedIndent, M as foldNodeProp, a1 as foldInside, T as LanguageSupport, ab as parseMixed } from './index-C05r9Gk7.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/{index-DNybfi0p.js → index-MupjT9zz.js}

@@ -1,4 +1,4 @@
-import { N as styleTags, O as tags, V as LRParser, Q as LRLanguage, J as indentNodeProp, K as continuedIndent, M as foldNodeProp, a1 as foldInside, T as LanguageSupport } from './index-C4JrCXqa.js';
+import { N as styleTags, O as tags, V as LRParser, Q as LRLanguage, J as indentNodeProp, K as continuedIndent, M as foldNodeProp, a1 as foldInside, T as LanguageSupport } from './index-C05r9Gk7.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/{index-DklUsnK1.js → index-xoIc0nWR.js}

@@ -1,4 +1,4 @@
-import { U as ExternalTokenizer, a2 as ContextTracker, N as styleTags, O as tags, V as LRParser, a3 as LocalTokenGroup, a4 as snippetCompletion, Z as syntaxTree, Q as LRLanguage, J as indentNodeProp, K as continuedIndent, $ as flatIndent, a0 as delimitedIndent, M as foldNodeProp, a1 as foldInside, T as LanguageSupport, X as ifNotIn, Y as completeFromList, a5 as IterMode, a6 as NodeWeakMap } from './index-C4JrCXqa.js';
+import { U as ExternalTokenizer, a2 as ContextTracker, N as styleTags, O as tags, V as LRParser, a3 as LocalTokenGroup, a4 as snippetCompletion, Z as syntaxTree, Q as LRLanguage, J as indentNodeProp, K as continuedIndent, $ as flatIndent, a0 as delimitedIndent, M as foldNodeProp, a1 as foldInside, T as LanguageSupport, X as ifNotIn, Y as completeFromList, a5 as IterMode, a6 as NodeWeakMap } from './index-C05r9Gk7.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/index.js

@@ -1,4 +1,4 @@
-export { ah as ImagePanel, ag as PanelLayout, ai as PointCloudPanel, ae as VisualizerConnection, af as VisualizerContext } from './index-C4JrCXqa.js';
+export { ah as ImagePanel, ag as PanelLayout, ai as PointCloudPanel, ae as VisualizerConnection, af as VisualizerContext } from './index-C05r9Gk7.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/lib/src/components/PanelToolbar.d.ts

@@ -1,3 +1,4 @@
+import "../output.css";
 import { type PanelTopic } from "./Panel.js";
 import type { ProtobufKind } from "../messaging/protobuf.js";
 import "@luxonis/common-fe-components/styles";

package/dist/lib/src/components/PanelToolbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PanelToolbar.d.ts","sourceRoot":"","sources":["../../../../src/components/PanelToolbar.tsx"],"names":[],"mappings":"AAyBA,OAAO,EAAE,KAAK,UAAU,EAAiB,MAAM,YAAY,CAAC;AAG5D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,sCAAsC,CAAC;AA4B9C,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,YAAY,CAAC;IACnB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,aAAa,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,MAAM,EAAE,UAAU,EAAE,KAAK,UAAU,EAAE,KAAK,IAAI,CAAC;IACrE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAmNpD,CAAC"}
+{"version":3,"file":"PanelToolbar.d.ts","sourceRoot":"","sources":["../../../../src/components/PanelToolbar.tsx"],"names":[],"mappings":"AAGA,OAAO,eAAe,CAAC;AAuBvB,OAAO,EAAE,KAAK,UAAU,EAAiB,MAAM,YAAY,CAAC;AAG5D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,sCAAsC,CAAC;AAqI9C,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,YAAY,CAAC;IACnB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,aAAa,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,MAAM,EAAE,UAAU,EAAE,KAAK,UAAU,EAAE,KAAK,IAAI,CAAC;IACrE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CA2KpD,CAAC"}

package/dist/lib/src/components/PanelToolbar.js

@@ -2,12 +2,29 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 // 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/
-import { ArrowDownIcon, ArrowUpIcon, Button, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, Flex, HelpIcon, Icon, Label, NormalText, SubHeader, Tooltip, CrossIcon } from "@luxonis/common-fe-components";
+import "../output.css";
+import { CiFilter } from "react-icons/ci";
+import { ArrowDownIcon, ArrowUpIcon, Button, CrossIcon, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, Flex, HelpIcon, Icon, Label, NormalText, SubHeader, Tooltip } from "@luxonis/common-fe-components";
 import { ImCheckboxChecked, ImCheckboxUnchecked } from "react-icons/im";
 import { useDetections } from "./Panel.js";
 import { useConnections } from "../context/ConnectionsProvider.js";
 import "@luxonis/common-fe-components/styles";
 import { createEventLoopDelaySampler } from "./measure-event-loop-delay";
+import { RiNumbersFill } from "react-icons/ri";
+function PanelToolbarMetrics({ renderedFps, targetFps, metrics }) {
+    const [variant, setVariant] = React.useState("full");
+    const eventLoopDelay = createEventLoopDelaySampler();
+    const descriptionRef = React.useRef(null);
+    React.useEffect(() => {
+        if (descriptionRef.current && descriptionRef.current.offsetWidth < 800) {
+            setVariant("compact");
+        }
+        else {
+            setVariant("full");
+        }
+    }, [descriptionRef.current?.offsetWidth]);
+    return (_jsx(Flex, { direction: "row", gap: "sm", align: "start", justify: "end", ref: descriptionRef, width: "full", children: variant === "compact" ? (_jsx(Tooltip, { content: _jsxs("ul", { children: [_jsxs("li", { children: ["Camera: ", targetFps === 0 ? "-" : targetFps, " FPS"] }), _jsxs("li", { children: ["Network:", " ", !metrics || metrics?.incomingMessagesFps === 0 ? "-" : metrics.incomingMessagesFps, " ", "FPS"] }), _jsxs("li", { children: ["Decoding:", " ", !metrics || metrics?.decodedMessagesFps === 0 ? "-" : metrics.decodedMessagesFps, " ", "FPS"] }), _jsxs("li", { children: ["Throughput:", " ", !metrics || metrics?.messageThroughput === 0 ? "-" : metrics.messageThroughput, " ", "Mbps"] }), _jsxs("li", { children: ["Rendering: ", renderedFps === 0 ? "-" : renderedFps, " FPS"] }), _jsxs("li", { children: ["Frontend Delay: ", eventLoopDelay.toFixed(2), " ms"] })] }), direction: "bottom", className: "ml-auto", children: _jsx(Button, { icon: RiNumbersFill, variant: "outline", colorVariant: "white", size: "sm", className: "text-gray-700" }) })) : (_jsxs(_Fragment, { children: [targetFps !== undefined && (_jsx(Label, { text: `Camera: ${targetFps === 0 ? "-" : targetFps} FPS` })), metrics?.incomingMessagesFps !== undefined && (_jsx(Label, { text: `Network: ${metrics.incomingMessagesFps === 0 ? "-" : metrics.incomingMessagesFps} FPS` })), metrics?.decodedMessagesFps !== undefined && (_jsx(Label, { text: `Decoding: ${metrics.decodedMessagesFps === 0 ? "-" : metrics.decodedMessagesFps} FPS` })), metrics?.messageThroughput !== undefined && (_jsx(Label, { text: `Throughput: ${metrics.messageThroughput === 0 ? "-" : metrics.messageThroughput} MB` })), renderedFps !== undefined && (_jsx(Label, { text: `Rendering: ${renderedFps === 0 ? "-" : renderedFps} FPS` })), eventLoopDelay !== undefined && (_jsx(Label, { text: `Frontend Delay: ${Math.ceil(eventLoopDelay)} ms` }))] })) }));
+}
 const PanelAnnotationButton = ({ topic, onClick }) => {
     const handleClick = React.useCallback((event) => {
         event.preventDefault();
@@ -15,11 +32,10 @@ const PanelAnnotationButton = ({ topic, onClick }) => {
     }, [onClick]);
     return (_jsx(DropdownMenuItem, { onClick: handleClick, children: _jsxs(Flex, { align: "center", gap: "sm", children: [_jsx(Icon, { color: "active", icon: topic.enabled ? ImCheckboxChecked : ImCheckboxUnchecked }), _jsx(NormalText, { text: topic.name })] }) }));
 };
-export const PanelToolbar = ({ topic, kind, setDetections, disableAnnotations = false, targetFps, triggerToast, renderedFps, toggleTopic, streamResolution }) => {
+export const PanelToolbar = ({ topic, kind, setDetections, disableAnnotations = false, targetFps, triggerToast, renderedFps, toggleTopic, streamResolution, }) => {
     const [metrics, setMetrics] = React.useState();
     const { detections } = useDetections();
     const connections = useConnections();
-    const eventLoopDelay = createEventLoopDelaySampler();
     React.useEffect(() => {
         const interval = setInterval(() => {
             setMetrics(connections[0]?.getTopicMetrics(topic));
@@ -29,7 +45,6 @@ export const PanelToolbar = ({ topic, kind, setDetections, disableAnnotations =
         };
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
-    const [annotationsOpened, setAnnotationsOpened] = React.useState(false);
     const hasExtra = React.useMemo(() => detections.some((detection) => detection.extra && !detection.enabled), [detections]);
     const [extraVisible, setExtraVisible] = React.useState(false);
     const onToggleTopic = React.useCallback((toggleTopicName) => {
@@ -44,9 +59,9 @@ export const PanelToolbar = ({ topic, kind, setDetections, disableAnnotations =
     const name = React.useMemo(() => {
         return topic;
     }, [topic]);
-    const nameWithResolution = React.useMemo(() => {
-        return streamResolution && streamResolution !== '-' ? `${name} (${streamResolution})` : name;
-    }, [name, streamResolution]);
+    const resolution = React.useMemo(() => {
+        return streamResolution && streamResolution !== "-" ? `(${streamResolution})` : undefined;
+    }, [streamResolution]);
     React.useEffect(() => {
         if (targetFps && metrics?.incomingMessagesFps && targetFps > metrics.incomingMessagesFps) {
             const timeout = setTimeout(() => {
@@ -63,20 +78,11 @@ export const PanelToolbar = ({ topic, kind, setDetections, disableAnnotations =
     const makeDetection = React.useCallback((detection, { extra }) => (extra ? detection.extra && !detection.enabled : !detection.extra || detection.enabled) && (_jsx(PanelAnnotationButton, { topic: detection, onClick: () => {
             onToggleTopic(detection.name);
         } }, detection.name)), [onToggleTopic]);
-    const descriptionRef = React.useRef(null);
-    return (_jsxs(Flex, { direction: "row", gap: "sm", align: "center", justify: "space-between", style: {
-            paddingLeft: 16,
-        }, children: [_jsxs(Flex, { direction: "column", gap: "xxs", align: "start", justify: "start", paddingY: "xs", children: [_jsxs(Flex, { direction: "row", gap: "sm", align: "center", justify: "start", children: [_jsx(SubHeader, { text: nameWithResolution }), _jsx(Button, { icon: CrossIcon, variant: "ghost", colorVariant: "white", size: "sm", onClick: () => toggleTopic?.(name) })] }), _jsx(Flex, { direction: "row", gap: "sm", align: "start", justify: "start", children: _jsxs(Flex, { direction: "row", gap: "sm", align: "start", justify: "start", ref: descriptionRef, children: [targetFps !== undefined && (_jsx(Label, { text: `Camera: ${targetFps === 0 ? '-' : targetFps} FPS` })), metrics?.incomingMessagesFps !== undefined && (_jsx(Label, { text: `Network: ${metrics.incomingMessagesFps === 0 ? '-' : metrics.incomingMessagesFps} FPS` })), metrics?.decodedMessagesFps !== undefined && (_jsx(Label, { text: `Decoding: ${metrics.decodedMessagesFps === 0 ? '-' : metrics.decodedMessagesFps} FPS` })), metrics?.messageThroughput !== undefined && (_jsx(Label, { text: `Throughput: ${metrics.messageThroughput === 0 ? '-' : metrics.messageThroughput} MB` })), renderedFps !== undefined && (_jsx(Label, { text: `Rendering: ${renderedFps === 0 ? '-' : renderedFps} FPS` })), eventLoopDelay !== undefined && (_jsx(Label, { text: `Frontend Delay: ${Math.ceil(eventLoopDelay)} ms` }))] }) })] }), !disableAnnotations && kind === "image" && (_jsxs(DropdownMenu, { onOpenChange: setAnnotationsOpened, children: [_jsx(DropdownMenuTrigger, { asChild: true, disabled: detections.length === 0, children: _jsx(Button, { variant: "outline", label: "Annotations", "aria-controls": annotationsOpened ? "basic-menu" : undefined, "aria-haspopup": "true", "aria-expanded": annotationsOpened ? "true" : undefined, icon: annotationsOpened ? ArrowUpIcon : ArrowDownIcon, disabled: detections.length === 0, style: {
-                                borderRadius: 0,
-                                borderTopRightRadius: 8,
-                                height: "100%",
-                            } }) }), _jsxs(DropdownMenuContent, { children: [detections.map((detection) => makeDetection(detection, { extra: false })), hasExtra && (_jsx(Button, { width: "full", paddingY: "xs", variant: "ghost", "aria-expanded": extraVisible ? "true" : undefined, onClick: () => {
-                                    setExtraVisible((current) => !current);
-                                }, icon: extraVisible ? ArrowUpIcon : ArrowDownIcon, style: {
-                                    borderRadius: 4,
-                                }, children: extraVisible ? "Less" : "More" })), extraVisible &&
-                                detections.map((detection) => makeDetection(detection, { extra: true }))] })] })), kind === "pointCloud" && (_jsx(Flex, { style: {
-                    paddingRight: 16,
-                }, children: _jsx(Tooltip, { content: _jsxs(_Fragment, { children: [_jsx(Label, { text: "To move camera:" }), _jsxs("ul", { children: [_jsx("li", { children: "W - Move camera forward" }), _jsx("li", { children: "A - Move camera backward" }), _jsx("li", { children: "S - Move camera to the left" }), _jsx("li", { children: "D - Move camera to the right" }), _jsx("li", { children: "Scroll \u2013 Zoom in and out" }), _jsx("li", { children: "Drag \u2013 Move camera parallel to the ground" }), _jsx("li", { children: `Right-click + Drag horizontally – Rotate the camera around the world's z-axis` }), _jsx("li", { children: `Right-click + Drag vertically – Pan the camera around the world's x- and y- axes` })] })] }), children: _jsx(Icon, { icon: HelpIcon, size: "sm", color: "gray", cursor: "help" }) }) }))] }));
+    return (_jsx(Flex, { direction: "row", gap: "sm", align: "center", justify: "space-between", className: "px-4", children: _jsxs(Flex, { direction: "row", gap: "xs", align: "center", justify: "start", width: "full", paddingY: "xs", children: [_jsxs(Flex, { width: "fit", gap: "xxs", className: "flex-col xl:flex-row items-start xl:items-end", children: [_jsx(SubHeader, { text: name, className: "whitespace-nowrap" }), resolution && _jsx(Label, { text: resolution, className: "h-fit" })] }), _jsx(PanelToolbarMetrics, { renderedFps: renderedFps, targetFps: targetFps, metrics: metrics }), _jsxs(Flex, { direction: "row", gap: "xs", align: "center", justify: "start", marginLeft: "auto", width: "fit", children: [!disableAnnotations && kind === "image" && (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, disabled: detections.length === 0, children: _jsx(Button, { variant: "outline", colorVariant: "white", size: "sm", icon: CiFilter, disabled: detections.length === 0 }) }), _jsxs(DropdownMenuContent, { children: [detections.map((detection) => makeDetection(detection, { extra: false })), hasExtra && (_jsx(Button, { width: "full", paddingY: "xs", variant: "ghost", "aria-expanded": extraVisible ? "true" : undefined, onClick: () => {
+                                                setExtraVisible((current) => !current);
+                                            }, icon: extraVisible ? ArrowUpIcon : ArrowDownIcon, style: {
+                                                borderRadius: 4,
+                                            }, children: extraVisible ? "Less" : "More" })), extraVisible &&
+                                            detections.map((detection) => makeDetection(detection, { extra: true }))] })] })), kind === "pointCloud" && (_jsx(Flex, { children: _jsx(Tooltip, { content: _jsxs(_Fragment, { children: [_jsx(Label, { text: "To move camera:" }), _jsxs("ul", { children: [_jsx("li", { children: "W - Move camera forward" }), _jsx("li", { children: "A - Move camera backward" }), _jsx("li", { children: "S - Move camera to the left" }), _jsx("li", { children: "D - Move camera to the right" }), _jsx("li", { children: "Scroll \u2013 Zoom in and out" }), _jsx("li", { children: "Drag \u2013 Move camera parallel to the ground" }), _jsx("li", { children: `Right-click + Drag horizontally – Rotate the camera around the world's z-axis` }), _jsx("li", { children: `Right-click + Drag vertically – Pan the camera around the world's x- and y- axes` })] })] }), children: _jsx(Button, { icon: HelpIcon, variant: "outline", colorVariant: "white", size: "sm", className: "text-gray-700" }) }) })), _jsx(Button, { icon: CrossIcon, variant: "outline", colorVariant: "white", size: "sm", onClick: () => toggleTopic?.(name) })] })] }) }));
 };
 //# sourceMappingURL=PanelToolbar.js.map

package/dist/lib/src/components/PanelToolbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"PanelToolbar.js","sourceRoot":"","sources":["../../../../src/components/PanelToolbar.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"PanelToolbar.js","sourceRoot":"","sources":["../../../../src/components/PanelToolbar.tsx"],"names":[],"mappings":";AAAA,sEAAsE;AACtE,oEAAoE;AACpE,0DAA0D;AAC1D,OAAO,eAAe,CAAC;AACvB,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAE1C,OAAO,EACL,aAAa,EACb,WAAW,EACX,MAAM,EACN,SAAS,EACT,YAAY,EACZ,mBAAmB,EACnB,gBAAgB,EAChB,mBAAmB,EACnB,IAAI,EACJ,QAAQ,EACR,IAAI,EACJ,KAAK,EACL,UAAU,EACV,SAAS,EACT,OAAO,EACR,MAAM,+BAA+B,CAAC;AAEvC,OAAO,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAExE,OAAO,EAAmB,aAAa,EAAE,MAAM,YAAY,CAAC;AAE5D,OAAO,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AAEnE,OAAO,sCAAsC,CAAC;AAC9C,OAAO,EAAE,2BAA2B,EAAE,MAAM,4BAA4B,CAAC;AACzE,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAa/C,SAAS,mBAAmB,CAAC,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAA4B;IACxF,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAqB,MAAM,CAAC,CAAC;IAEzE,MAAM,cAAc,GAAG,2BAA2B,EAAE,CAAC;IAErD,MAAM,cAAc,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE1D,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,cAAc,CAAC,OAAO,IAAI,cAAc,CAAC,OAAO,CAAC,WAAW,GAAG,GAAG,EAAE,CAAC;YACvE,UAAU,CAAC,SAAS,CAAC,CAAC;QACxB,CAAC;aAAM,CAAC;YACN,UAAU,CAAC,MAAM,CAAC,CAAC;QACrB,CAAC;IACH,CAAC,EAAE,CAAC,cAAc,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC;IAE1C,OAAO,CACL,KAAC,IAAI,IAAC,SAAS,EAAC,KAAK,EAAC,GAAG,EAAC,IAAI,EAAC,KAAK,EAAC,OAAO,EAAC,OAAO,EAAC,KAAK,EAAC,GAAG,EAAE,cAAc,EAAE,KAAK,EAAC,MAAM,YACzF,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,CACvB,KAAC,OAAO,IACN,OAAO,EACL,yBACE,qCAAa,SAAS,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,SAAS,YAAU,EACxD,qCACW,GAAG,EACX,CAAC,OAAO,IAAI,OAAO,EAAE,mBAAmB,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC,mBAAmB,EAAE,GAAG,WAErF,EACL,sCACY,GAAG,EACZ,CAAC,OAAO,IAAI,OAAO,EAAE,kBAAkB,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC,kBAAkB,EAAE,GAAG,WAEnF,EACL,wCACc,GAAG,EACd,CAAC,OAAO,IAAI,OAAO,EAAE,iBAAiB,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC,iBAAiB,EAAE,GAAG,YAEjF,EACL,wCAAgB,WAAW,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,WAAW,YAAU,EAC/D,6CAAqB,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,WAAS,IACpD,EAEP,SAAS,EAAC,QAAQ,EAClB,SAAS,EAAC,SAAS,YAEnB,KAAC,MAAM,IACL,IAAI,EAAE,aAAa,EACnB,OAAO,EAAC,SAAS,EACjB,YAAY,EAAC,OAAO,EACpB,IAAI,EAAC,IAAI,EACT,SAAS,EAAC,eAAe,GACzB,GACM,CACX,CAAC,CAAC,CAAC,CACF,8BACG,SAAS,KAAK,SAAS,IAAI,CAC1B,KAAC,KAAK,IAAC,IAAI,EAAE,WAAW,SAAS,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,SAAS,MAAM,GAAI,CACpE,EAEA,OAAO,EAAE,mBAAmB,KAAK,SAAS,IAAI,CAC7C,KAAC,KAAK,IACJ,IAAI,EAAE,YACJ,OAAO,CAAC,mBAAmB,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC,mBACpD,MAAM,GACN,CACH,EAEA,OAAO,EAAE,kBAAkB,KAAK,SAAS,IAAI,CAC5C,KAAC,KAAK,IACJ,IAAI,EAAE,aACJ,OAAO,CAAC,kBAAkB,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC,kBACnD,MAAM,GACN,CACH,EAEA,OAAO,EAAE,iBAAiB,KAAK,SAAS,IAAI,CAC3C,KAAC,KAAK,IACJ,IAAI,EAAE,eACJ,OAAO,CAAC,iBAAiB,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC,iBAClD,KAAK,GACL,CACH,EAEA,WAAW,KAAK,SAAS,IAAI,CAC5B,KAAC,KAAK,IAAC,IAAI,EAAE,cAAc,WAAW,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,WAAW,MAAM,GAAI,CAC3E,EAEA,cAAc,KAAK,SAAS,IAAI,CAC/B,KAAC,KAAK,IAAC,IAAI,EAAE,mBAAmB,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,KAAK,GAAI,CACnE,IAKA,CACJ,GACI,CACR,CAAC;AACJ,CAAC;AAED,MAAM,qBAAqB,GAAyC,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE;IACzF,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CACnC,CAAC,KAAK,EAAE,EAAE;QACR,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,OAAO,EAAE,CAAC;IACZ,CAAC,EACD,CAAC,OAAO,CAAC,CACV,CAAC;IAEF,OAAO,CACL,KAAC,gBAAgB,IAAC,OAAO,EAAE,WAAW,YACpC,MAAC,IAAI,IAAC,KAAK,EAAC,QAAQ,EAAC,GAAG,EAAC,IAAI,aAC3B,KAAC,IAAI,IAAC,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,mBAAmB,GAAI,EACtF,KAAC,UAAU,IAAC,IAAI,EAAE,KAAK,CAAC,IAAI,GAAI,IAC3B,GACU,CACpB,CAAC;AACJ,CAAC,CAAC;AAeF,MAAM,CAAC,MAAM,YAAY,GAAgC,CAAC,EACxD,KAAK,EACL,IAAI,EACJ,aAAa,EACb,kBAAkB,GAAG,KAAK,EAC1B,SAAS,EACT,YAAY,EACZ,WAAW,EACX,WAAW,EACX,gBAAgB,GACjB,EAAE,EAAE;IACH,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAW,CAAC;IAExD,MAAM,EAAE,UAAU,EAAE,GAAG,aAAa,EAAE,CAAC;IACvC,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IAErC,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,MAAM,QAAQ,GAAG,WAAW,CAAC,GAAG,EAAE;YAChC,UAAU,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,eAAe,CAAC,KAAK,CAAC,CAAC,CAAC;QACrD,CAAC,EAAE,GAAG,CAAC,CAAC;QACR,OAAO,GAAG,EAAE;YACV,aAAa,CAAC,QAAQ,CAAC,CAAC;QAC1B,CAAC,CAAC;QACF,uDAAuD;IACzD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,QAAQ,GAAG,KAAK,CAAC,OAAO,CAC5B,GAAG,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,SAAS,CAAC,KAAK,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,EAC3E,CAAC,UAAU,CAAC,CACb,CAAC;IACF,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE9D,MAAM,aAAa,GAAG,KAAK,CAAC,WAAW,CACrC,CAAC,eAAuB,EAAE,EAAE;QAC1B,aAAa,EAAE,CAAC,CAAC,OAAO,EAAE,EAAE,CAC1B,OAAO,CAAC,GAAG,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC;YAC1B,GAAG,SAAS;YACZ,GAAG,CAAC,eAAe,KAAK,SAAS,CAAC,IAAI,IAAI;gBACxC,OAAO,EAAE,CAAC,SAAS,CAAC,OAAO;aAC5B,CAAC;SACH,CAAC,CAAC,CACJ,CAAC;IACJ,CAAC,EACD,CAAC,aAAa,CAAC,CAChB,CAAC;IAEF,wCAAwC;IACxC,MAAM,IAAI,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAC9B,OAAO,KAAK,CAAC;IACf,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,MAAM,UAAU,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACpC,OAAO,gBAAgB,IAAI,gBAAgB,KAAK,GAAG,CAAC,CAAC,CAAC,IAAI,gBAAgB,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC;IAC5F,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAEvB,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,SAAS,IAAI,OAAO,EAAE,mBAAmB,IAAI,SAAS,GAAG,OAAO,CAAC,mBAAmB,EAAE,CAAC;YACzF,MAAM,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;gBAC9B,IAAI,SAAS,GAAG,GAAG,GAAG,OAAO,CAAC,mBAAmB,EAAE,CAAC;oBAClD,YAAY,EAAE,EAAE,CAAC;gBACnB,CAAC;YACH,CAAC,EAAE,MAAM,CAAC,CAAC;YACX,OAAO,GAAG,EAAE;gBACV,YAAY,CAAC,OAAO,CAAC,CAAC;YACxB,CAAC,CAAC;QACJ,CAAC;QACD,OAAO;IACT,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,EAAE,mBAAmB,EAAE,YAAY,CAAC,CAAC,CAAC;IAE5D,MAAM,aAAa,GAAG,KAAK,CAAC,WAAW,CACrC,CAAC,SAAqB,EAAE,EAAE,KAAK,EAAsB,EAAE,EAAE,CACvD,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,IAAI,SAAS,CAAC,OAAO,CAAC,IAAI,CACzF,KAAC,qBAAqB,IAEpB,KAAK,EAAE,SAAS,EAChB,OAAO,EAAE,GAAG,EAAE;YACZ,aAAa,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;QAChC,CAAC,IAJI,SAAS,CAAC,IAAI,CAKnB,CACH,EACH,CAAC,aAAa,CAAC,CAChB,CAAC;IAEF,OAAO,CACL,KAAC,IAAI,IAAC,SAAS,EAAC,KAAK,EAAC,GAAG,EAAC,IAAI,EAAC,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAC,eAAe,EAAC,SAAS,EAAC,MAAM,YACpF,MAAC,IAAI,IAAC,SAAS,EAAC,KAAK,EAAC,GAAG,EAAC,IAAI,EAAC,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAC,OAAO,EAAC,KAAK,EAAC,MAAM,EAAC,QAAQ,EAAC,IAAI,aACtF,MAAC,IAAI,IAAC,KAAK,EAAC,KAAK,EAAC,GAAG,EAAC,KAAK,EAAC,SAAS,EAAC,+CAA+C,aACnF,KAAC,SAAS,IAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAC,mBAAmB,GAAG,EACtD,UAAU,IAAI,KAAC,KAAK,IAAC,IAAI,EAAE,UAAU,EAAE,SAAS,EAAC,OAAO,GAAG,IACvD,EAEP,KAAC,mBAAmB,IAAC,WAAW,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,OAAO,GAAI,EAEzF,MAAC,IAAI,IAAC,SAAS,EAAC,KAAK,EAAC,GAAG,EAAC,IAAI,EAAC,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAC,OAAO,EAAC,UAAU,EAAC,MAAM,EAAC,KAAK,EAAC,KAAK,aACxF,CAAC,kBAAkB,IAAI,IAAI,KAAK,OAAO,IAAI,CAC1C,MAAC,YAAY,eACX,KAAC,mBAAmB,IAAC,OAAO,QAAC,QAAQ,EAAE,UAAU,CAAC,MAAM,KAAK,CAAC,YAC5D,KAAC,MAAM,IACL,OAAO,EAAC,SAAS,EACjB,YAAY,EAAC,OAAO,EACpB,IAAI,EAAC,IAAI,EACT,IAAI,EAAE,QAAQ,EACd,QAAQ,EAAE,UAAU,CAAC,MAAM,KAAK,CAAC,GACjC,GACkB,EACtB,MAAC,mBAAmB,eACjB,UAAU,CAAC,GAAG,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,aAAa,CAAC,SAAS,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC,EACzE,QAAQ,IAAI,CACX,KAAC,MAAM,IACL,KAAK,EAAC,MAAM,EACZ,QAAQ,EAAC,IAAI,EACb,OAAO,EAAC,OAAO,mBACA,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAChD,OAAO,EAAE,GAAG,EAAE;gDACZ,eAAe,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC;4CACzC,CAAC,EACD,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,aAAa,EAChD,KAAK,EAAE;gDACL,YAAY,EAAE,CAAC;6CAChB,YAEA,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,GACxB,CACV,EACA,YAAY;4CACX,UAAU,CAAC,GAAG,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,aAAa,CAAC,SAAS,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC,IACtD,IACT,CAChB,EAEA,IAAI,KAAK,YAAY,IAAI,CACxB,KAAC,IAAI,cACH,KAAC,OAAO,IACN,OAAO,EACL,8BACE,KAAC,KAAK,IAAC,IAAI,EAAC,iBAAiB,GAAG,EAChC,yBACE,mDAAgC,EAChC,oDAAiC,EACjC,uDAAoC,EACpC,wDAAqC,EACrC,yDAAiC,EACjC,0EAAkD,EAClD,uBAAK,+EAA+E,GAAM,EAC1F,uBAAK,kFAAkF,GAAM,IAC1F,IACJ,YAGL,KAAC,MAAM,IACL,IAAI,EAAE,QAAQ,EACd,OAAO,EAAC,SAAS,EACjB,YAAY,EAAC,OAAO,EACpB,IAAI,EAAC,IAAI,EACT,SAAS,EAAC,eAAe,GACzB,GACM,GACL,CACR,EAED,KAAC,MAAM,IACL,IAAI,EAAE,SAAS,EACf,OAAO,EAAC,SAAS,EACjB,YAAY,EAAC,OAAO,EACpB,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,EAAE,CAAC,IAAI,CAAC,GAClC,IACG,IACF,GACF,CACR,CAAC;AACJ,CAAC,CAAC"}

package/dist/lib/src/index.d.ts

@@ -1,3 +1,4 @@
+import './output.css';
 export type { PublicChannelData } from './connection/connection.js';
 export { VisualizerConnection } from './connection/connection.js';
 export type { WorkerOutputMessage as FoxgloveAdapterOutputMessage, WorkerInputMessage as FoxgloveAdapterInputMessage, FoxgloveMessage } from './connection/communicator.js';

package/dist/lib/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAIA,YAAY,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAA;AACnE,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAA;AAEjE,YAAY,EAAE,mBAAmB,IAAI,4BAA4B,EAAE,kBAAkB,IAAI,2BAA2B,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAE5K,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAEhE,OAAO,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAC;AAE1D,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjD,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAIA,OAAO,cAAc,CAAC;AAEtB,YAAY,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAA;AACnE,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAA;AAEjE,YAAY,EAAE,mBAAmB,IAAI,4BAA4B,EAAE,kBAAkB,IAAI,2BAA2B,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAE5K,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAEhE,OAAO,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAC;AAE1D,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjD,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC"}

package/dist/lib/src/index.js

@@ -1,6 +1,7 @@
 // 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/
+import './output.css';
 export { VisualizerConnection } from './connection/connection.js';
 export { VisualizerContext } from "./context/VisualizerContext";
 export { PanelLayout } from "./components/PanelLayout.js";

package/dist/lib/src/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAAA,sEAAsE;AACtE,oEAAoE;AACpE,0DAA0D;AAG1D,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAA;AAIjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAEhE,OAAO,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAC;AAE1D,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjD,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAAA,sEAAsE;AACtE,oEAAoE;AACpE,0DAA0D;AAE1D,OAAO,cAAc,CAAC;AAGtB,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAA;AAIjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAEhE,OAAO,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAC;AAE1D,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjD,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC"}

package/dist/lib/src/output.css

@@ -0,0 +1,219 @@
+/*! tailwindcss v4.0.17 | MIT License | https://tailwindcss.com */
+@layer theme, base, components, utilities;
+@layer theme {
+  :root, :host {
+    --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
+      "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
+      "Courier New", monospace;
+    --color-gray-700: oklch(0.373 0.034 259.733);
+    --spacing: 0.25rem;
+    --default-font-family: var(--font-sans);
+    --default-mono-font-family: var(--font-mono);
+  }
+}
+@layer base {
+  *, ::after, ::before, ::backdrop, ::file-selector-button {
+    box-sizing: border-box;
+    margin: 0;
+    padding: 0;
+    border: 0 solid;
+  }
+  html, :host {
+    line-height: 1.5;
+    -webkit-text-size-adjust: 100%;
+    tab-size: 4;
+    font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
+    font-feature-settings: var(--default-font-feature-settings, normal);
+    font-variation-settings: var(--default-font-variation-settings, normal);
+    -webkit-tap-highlight-color: transparent;
+  }
+  hr {
+    height: 0;
+    color: inherit;
+    border-top-width: 1px;
+  }
+  abbr:where([title]) {
+    -webkit-text-decoration: underline dotted;
+    text-decoration: underline dotted;
+  }
+  h1, h2, h3, h4, h5, h6 {
+    font-size: inherit;
+    font-weight: inherit;
+  }
+  a {
+    color: inherit;
+    -webkit-text-decoration: inherit;
+    text-decoration: inherit;
+  }
+  b, strong {
+    font-weight: bolder;
+  }
+  code, kbd, samp, pre {
+    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
+    font-feature-settings: var(--default-mono-font-feature-settings, normal);
+    font-variation-settings: var(--default-mono-font-variation-settings, normal);
+    font-size: 1em;
+  }
+  small {
+    font-size: 80%;
+  }
+  sub, sup {
+    font-size: 75%;
+    line-height: 0;
+    position: relative;
+    vertical-align: baseline;
+  }
+  sub {
+    bottom: -0.25em;
+  }
+  sup {
+    top: -0.5em;
+  }
+  table {
+    text-indent: 0;
+    border-color: inherit;
+    border-collapse: collapse;
+  }
+  :-moz-focusring {
+    outline: auto;
+  }
+  progress {
+    vertical-align: baseline;
+  }
+  summary {
+    display: list-item;
+  }
+  ol, ul, menu {
+    list-style: none;
+  }
+  img, svg, video, canvas, audio, iframe, embed, object {
+    display: block;
+    vertical-align: middle;
+  }
+  img, video {
+    max-width: 100%;
+    height: auto;
+  }
+  button, input, select, optgroup, textarea, ::file-selector-button {
+    font: inherit;
+    font-feature-settings: inherit;
+    font-variation-settings: inherit;
+    letter-spacing: inherit;
+    color: inherit;
+    border-radius: 0;
+    background-color: transparent;
+    opacity: 1;
+  }
+  :where(select:is([multiple], [size])) optgroup {
+    font-weight: bolder;
+  }
+  :where(select:is([multiple], [size])) optgroup option {
+    padding-inline-start: 20px;
+  }
+  ::file-selector-button {
+    margin-inline-end: 4px;
+  }
+  ::placeholder {
+    opacity: 1;
+  }
+  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {
+    ::placeholder {
+      color: color-mix(in oklab, currentColor 50%, transparent);
+    }
+  }
+  textarea {
+    resize: vertical;
+  }
+  ::-webkit-search-decoration {
+    -webkit-appearance: none;
+  }
+  ::-webkit-date-and-time-value {
+    min-height: 1lh;
+    text-align: inherit;
+  }
+  ::-webkit-datetime-edit {
+    display: inline-flex;
+  }
+  ::-webkit-datetime-edit-fields-wrapper {
+    padding: 0;
+  }
+  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
+    padding-block: 0;
+  }
+  :-moz-ui-invalid {
+    box-shadow: none;
+  }
+  button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {
+    appearance: button;
+  }
+  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
+    height: auto;
+  }
+  [hidden]:where(:not([hidden="until-found"])) {
+    display: none !important;
+  }
+}
+@layer utilities {
+  .visible {
+    visibility: visible;
+  }
+  .fixed {
+    position: fixed;
+  }
+  .ml-auto {
+    margin-left: auto;
+  }
+  .hidden {
+    display: none;
+  }
+  .h-fit {
+    height: fit-content;
+  }
+  .flex-col {
+    flex-direction: column;
+  }
+  .items-start {
+    align-items: flex-start;
+  }
+  .rounded {
+    border-radius: 0.25rem;
+  }
+  .border {
+    border-style: var(--tw-border-style);
+    border-width: 1px;
+  }
+  .px-4 {
+    padding-inline: calc(var(--spacing) * 4);
+  }
+  .whitespace-nowrap {
+    white-space: nowrap;
+  }
+  .text-gray-700 {
+    color: var(--color-gray-700);
+  }
+  .outline {
+    outline-style: var(--tw-outline-style);
+    outline-width: 1px;
+  }
+  .xl\:flex-row {
+    @media (width >= 80rem) {
+      flex-direction: row;
+    }
+  }
+  .xl\:items-end {
+    @media (width >= 80rem) {
+      align-items: flex-end;
+    }
+  }
+}
+@property --tw-border-style {
+  syntax: "*";
+  inherits: false;
+  initial-value: solid;
+}
+@property --tw-outline-style {
+  syntax: "*";
+  inherits: false;
+  initial-value: solid;
+}

package/dist/lib/src/utils/metrics-manager.js

@@ -44,7 +44,7 @@ export class ThroughputMetricsManager {
             return 0;
         }
         // Get time span in seconds
-        const timeSpanMs = topicMetrics[0].timestamp - topicMetrics[topicMetrics.length - 1].timestamp;
+        const timeSpanMs = topicMetrics.at(0)?.timestamp ?? 0 - (topicMetrics.at(-1)?.timestamp ?? 0);
         const timeSpanSec = timeSpanMs / 1000;
         if (timeSpanSec === 0) {
             return 0;

package/dist/lib/src/utils/metrics-manager.js.map

@@ -1 +1 @@
-{"version":3,"file":"metrics-manager.js","sourceRoot":"","sources":["../../../../src/utils/metrics-manager.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"metrics-manager.js","sourceRoot":"","sources":["../../../../src/utils/metrics-manager.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@luxonis/visualizer-protobuf",
-  "version": "2.20.0",
+  "version": "2.21.0",
   "type": "module",
   "description": "RobotHub Visualizer Library",
   "author": "Luxonis Corp",
@@ -8,7 +8,8 @@
   "types": "./dist/lib/src/index.js",
   "license": "UNLICENSED",
   "scripts": {
-    "build": "rm -rf dist && tsc && rollup -c && cp -r ./src/fonts dist/src",
+    "build": "npm run tailwind && rm -rf dist && tsc && rollup -c && cp -r ./src/fonts dist/src && cp ./src/output.css dist/lib/src",
+    "tailwind": "npx @tailwindcss/cli -i ./src/index.css -o ./src/output.css",
     "lint": "npx eslint . --fix",
     "gen:proto": "bash ./protobuf-gen.sh"
   },
@@ -20,6 +21,7 @@
     "@luxonis/remote-connection": "2.5.2",
     "@mui/icons-material": "5.15.5",
     "@mui/material": "5.15.6",
+    "@tailwindcss/cli": "4.0.17",
     "color": "^4.2.3",
     "lodash.curry": "^4.1.1",
     "nearley": "2.20.1",
@@ -28,6 +30,7 @@
     "react-dnd-html5-backend": "16.0.1",
     "react-icons": "5.2.1",
     "react-mosaic-component": "6.1.0",
+    "tailwindcss": "4.0.17",
     "ts-proto": "1.181.1",
     "uuidv7": "^1.0.2",
     "zustand": "4.5.0"