@luxonis/visualizer-protobuf 2.28.0 → 2.30.0

package/dist/{communicator-D49kmBTQ.js → communicator-1cvNRjMr.js}

@@ -1,4 +1,4 @@
-import { p as protobufsBySchema } from './protobuf-Cr0sn6Ua.js';
+import { p as protobufsBySchema } from './protobuf-By8duXQO.js';
 
 // 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

package/dist/{deserialization.worker-DsCOJqEa.js → deserialization.worker-d0xuPKYs.js}

@@ -1,7 +1,7 @@
 import { e as expose } from './comlink-DHMAu6X7.js';
 import { t as typescript } from './useMessageReducer-jNx5e6JW.js';
 import { e as estimateObjectSize, d as dist } from './tslib.es6-C73eoP_E.js';
-import { T as Type, P as PointsAnnotationType, p as protobufsBySchema, a as Profile } from './protobuf-Cr0sn6Ua.js';
+import { T as Type, P as PointsAnnotationType, p as protobufsBySchema, a as Profile } from './protobuf-By8duXQO.js';
 import 'react';
 import './_commonjsHelpers-E-ZsRS8r.js';
 import 'zustand';

package/dist/{index-CLPc3bUH.js → index--ExGcWRF.js}

@@ -1,4 +1,4 @@
-import { a8 as EditorView, a9 as EditorSelection, Q as LRLanguage, N as styleTags, O as tags, J as indentNodeProp, a0 as delimitedIndent, M as foldNodeProp, T as LanguageSupport, V as LRParser, Z as syntaxTree, aa as html, ab as parseMixed, U as ExternalTokenizer } from './index-BuRQ7ljn.js';
+import { a8 as EditorView, a9 as EditorSelection, Q as LRLanguage, N as styleTags, O as tags, J as indentNodeProp, a0 as delimitedIndent, M as foldNodeProp, T as LanguageSupport, V as LRParser, Z as syntaxTree, aa as html, ab as parseMixed, U as ExternalTokenizer } from './index-C4GjAqu3.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/{index-DE0_tKGA.js → index-3y-FxBOU.js}

@@ -1,4 +1,4 @@
-import { 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-BuRQ7ljn.js';
+import { 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-C4GjAqu3.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/{index-LmBY2nOo.js → index-5qLvVfXR.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-BuRQ7ljn.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-C4GjAqu3.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/{index-DZgY6A3h.js → index-BDGOyJit.js}

@@ -1,4 +1,4 @@
-import { J as indentNodeProp, K as continuedIndent, M as foldNodeProp, N as styleTags, O as tags, Q as LRLanguage, T as LanguageSupport, U as ExternalTokenizer, V as LRParser, X as ifNotIn, Y as completeFromList, Z as syntaxTree } from './index-BuRQ7ljn.js';
+import { J as indentNodeProp, K as continuedIndent, M as foldNodeProp, N as styleTags, O as tags, Q as LRLanguage, T as LanguageSupport, U as ExternalTokenizer, V as LRParser, X as ifNotIn, Y as completeFromList, Z as syntaxTree } from './index-C4GjAqu3.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/{index-B1pNpslP.js → index-BJVD4ja7.js}

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

package/dist/{index-CJSOG1CX.js → index-BoavvIJ0.js}

@@ -1,4 +1,4 @@
-import { ImagePanel } from './index-CdXrBVPC.js';
+import { ImagePanel } from './index-CdxzudUl.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-BuRQ7ljn.js';
+import './index-C4GjAqu3.js';
 import './comlink-DHMAu6X7.js';
 import './utils-Hzt3wxhG.js';
 import './FoxgloveServer-C39Uooyk.js';

package/dist/{index-I0XgHBlj.js → index-BtVYSyU9.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-BuRQ7ljn.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-C4GjAqu3.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/{index-BuRQ7ljn.js → index-C4GjAqu3.js}

@@ -27,7 +27,7 @@ import { defineGlobalStyles, defineTokens as defineTokens$1, defineKeyframes, de
 
 var e=[],t$1=[];function n$1(n,r){if(n&&"undefined"!=typeof document){var a,s=!0===r.prepend?"prepend":"append",d=!0===r.singleTag,i="string"==typeof r.container?document.querySelector(r.container):document.getElementsByTagName("head")[0];if(d){var u=e.indexOf(i);-1===u&&(u=e.push(i)-1,t$1[u]={}),a=t$1[u]&&t$1[u][s]?t$1[u][s]:t$1[u][s]=c();}else a=c();65279===n.charCodeAt(0)&&(n=n.substring(1)),a.styleSheet?a.styleSheet.cssText+=n:a.appendChild(document.createTextNode(n));}function c(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),r.attributes)for(var t=Object.keys(r.attributes),n=0;n<t.length;n++)e.setAttribute(t[n],r.attributes[t[n]]);var a="prepend"===s?"afterbegin":"beforeend";return i.insertAdjacentElement(a,e),e}}
 
-var css$b = "/*! tailwindcss v4.0.17 | MIT License | https://tailwindcss.com */\n@layer theme, base, components, utilities;\n@layer theme {\n  :root, :host {\n    --font-sans: ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\",\n      \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n      \"Courier New\", monospace;\n    --color-gray-700: oklch(0.373 0.034 259.733);\n    --spacing: 0.25rem;\n    --default-font-family: var(--font-sans);\n    --default-mono-font-family: var(--font-mono);\n  }\n}\n@layer base {\n  *, ::after, ::before, ::backdrop, ::file-selector-button {\n    box-sizing: border-box;\n    margin: 0;\n    padding: 0;\n    border: 0 solid;\n  }\n  html, :host {\n    line-height: 1.5;\n    -webkit-text-size-adjust: 100%;\n    tab-size: 4;\n    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\");\n    font-feature-settings: var(--default-font-feature-settings, normal);\n    font-variation-settings: var(--default-font-variation-settings, normal);\n    -webkit-tap-highlight-color: transparent;\n  }\n  hr {\n    height: 0;\n    color: inherit;\n    border-top-width: 1px;\n  }\n  abbr:where([title]) {\n    -webkit-text-decoration: underline dotted;\n    text-decoration: underline dotted;\n  }\n  h1, h2, h3, h4, h5, h6 {\n    font-size: inherit;\n    font-weight: inherit;\n  }\n  a {\n    color: inherit;\n    -webkit-text-decoration: inherit;\n    text-decoration: inherit;\n  }\n  b, strong {\n    font-weight: bolder;\n  }\n  code, kbd, samp, pre {\n    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);\n    font-feature-settings: var(--default-mono-font-feature-settings, normal);\n    font-variation-settings: var(--default-mono-font-variation-settings, normal);\n    font-size: 1em;\n  }\n  small {\n    font-size: 80%;\n  }\n  sub, sup {\n    font-size: 75%;\n    line-height: 0;\n    position: relative;\n    vertical-align: baseline;\n  }\n  sub {\n    bottom: -0.25em;\n  }\n  sup {\n    top: -0.5em;\n  }\n  table {\n    text-indent: 0;\n    border-color: inherit;\n    border-collapse: collapse;\n  }\n  :-moz-focusring {\n    outline: auto;\n  }\n  progress {\n    vertical-align: baseline;\n  }\n  summary {\n    display: list-item;\n  }\n  ol, ul, menu {\n    list-style: none;\n  }\n  img, svg, video, canvas, audio, iframe, embed, object {\n    display: block;\n    vertical-align: middle;\n  }\n  img, video {\n    max-width: 100%;\n    height: auto;\n  }\n  button, input, select, optgroup, textarea, ::file-selector-button {\n    font: inherit;\n    font-feature-settings: inherit;\n    font-variation-settings: inherit;\n    letter-spacing: inherit;\n    color: inherit;\n    border-radius: 0;\n    background-color: transparent;\n    opacity: 1;\n  }\n  :where(select:is([multiple], [size])) optgroup {\n    font-weight: bolder;\n  }\n  :where(select:is([multiple], [size])) optgroup option {\n    padding-inline-start: 20px;\n  }\n  ::file-selector-button {\n    margin-inline-end: 4px;\n  }\n  ::placeholder {\n    opacity: 1;\n  }\n  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {\n    ::placeholder {\n      color: color-mix(in oklab, currentColor 50%, transparent);\n    }\n  }\n  textarea {\n    resize: vertical;\n  }\n  ::-webkit-search-decoration {\n    -webkit-appearance: none;\n  }\n  ::-webkit-date-and-time-value {\n    min-height: 1lh;\n    text-align: inherit;\n  }\n  ::-webkit-datetime-edit {\n    display: inline-flex;\n  }\n  ::-webkit-datetime-edit-fields-wrapper {\n    padding: 0;\n  }\n  ::-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 {\n    padding-block: 0;\n  }\n  :-moz-ui-invalid {\n    box-shadow: none;\n  }\n  button, input:where([type=\"button\"], [type=\"reset\"], [type=\"submit\"]), ::file-selector-button {\n    appearance: button;\n  }\n  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {\n    height: auto;\n  }\n  [hidden]:where(:not([hidden=\"until-found\"])) {\n    display: none !important;\n  }\n}\n@layer utilities {\n  .visible {\n    visibility: visible;\n  }\n  .fixed {\n    position: fixed;\n  }\n  .ml-auto {\n    margin-left: auto;\n  }\n  .hidden {\n    display: none;\n  }\n  .flex-col {\n    flex-direction: column;\n  }\n  .items-start {\n    align-items: flex-start;\n  }\n  .rounded {\n    border-radius: 0.25rem;\n  }\n  .border {\n    border-style: var(--tw-border-style);\n    border-width: 1px;\n  }\n  .px-4 {\n    padding-inline: calc(var(--spacing) * 4);\n  }\n  .text-\\[14px\\]\\/\\[14px\\] {\n    font-size: 14px;\n    line-height: 14px;\n  }\n  .text-\\[20px\\]\\/\\[20px\\] {\n    font-size: 20px;\n    line-height: 20px;\n  }\n  .whitespace-nowrap {\n    white-space: nowrap;\n  }\n  .text-gray-700 {\n    color: var(--color-gray-700);\n  }\n  .outline {\n    outline-style: var(--tw-outline-style);\n    outline-width: 1px;\n  }\n  .xl\\:flex-row {\n    @media (width >= 80rem) {\n      flex-direction: row;\n    }\n  }\n  .xl\\:items-end {\n    @media (width >= 80rem) {\n      align-items: flex-end;\n    }\n  }\n  .xl\\:pb-\\[2px\\] {\n    @media (width >= 80rem) {\n      padding-bottom: 2px;\n    }\n  }\n}\n@property --tw-border-style {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: solid;\n}\n@property --tw-outline-style {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: solid;\n}\n";
+var css$b = "/*! tailwindcss v4.0.17 | MIT License | https://tailwindcss.com */\n@layer theme, base, components, utilities;\n@layer theme {\n  :root, :host {\n    --font-sans: ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\",\n      \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n      \"Courier New\", monospace;\n    --color-gray-700: oklch(0.373 0.034 259.733);\n    --spacing: 0.25rem;\n    --font-weight-semibold: 600;\n    --default-font-family: var(--font-sans);\n    --default-mono-font-family: var(--font-mono);\n  }\n}\n@layer base {\n  *, ::after, ::before, ::backdrop, ::file-selector-button {\n    box-sizing: border-box;\n    margin: 0;\n    padding: 0;\n    border: 0 solid;\n  }\n  html, :host {\n    line-height: 1.5;\n    -webkit-text-size-adjust: 100%;\n    tab-size: 4;\n    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\");\n    font-feature-settings: var(--default-font-feature-settings, normal);\n    font-variation-settings: var(--default-font-variation-settings, normal);\n    -webkit-tap-highlight-color: transparent;\n  }\n  hr {\n    height: 0;\n    color: inherit;\n    border-top-width: 1px;\n  }\n  abbr:where([title]) {\n    -webkit-text-decoration: underline dotted;\n    text-decoration: underline dotted;\n  }\n  h1, h2, h3, h4, h5, h6 {\n    font-size: inherit;\n    font-weight: inherit;\n  }\n  a {\n    color: inherit;\n    -webkit-text-decoration: inherit;\n    text-decoration: inherit;\n  }\n  b, strong {\n    font-weight: bolder;\n  }\n  code, kbd, samp, pre {\n    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);\n    font-feature-settings: var(--default-mono-font-feature-settings, normal);\n    font-variation-settings: var(--default-mono-font-variation-settings, normal);\n    font-size: 1em;\n  }\n  small {\n    font-size: 80%;\n  }\n  sub, sup {\n    font-size: 75%;\n    line-height: 0;\n    position: relative;\n    vertical-align: baseline;\n  }\n  sub {\n    bottom: -0.25em;\n  }\n  sup {\n    top: -0.5em;\n  }\n  table {\n    text-indent: 0;\n    border-color: inherit;\n    border-collapse: collapse;\n  }\n  :-moz-focusring {\n    outline: auto;\n  }\n  progress {\n    vertical-align: baseline;\n  }\n  summary {\n    display: list-item;\n  }\n  ol, ul, menu {\n    list-style: none;\n  }\n  img, svg, video, canvas, audio, iframe, embed, object {\n    display: block;\n    vertical-align: middle;\n  }\n  img, video {\n    max-width: 100%;\n    height: auto;\n  }\n  button, input, select, optgroup, textarea, ::file-selector-button {\n    font: inherit;\n    font-feature-settings: inherit;\n    font-variation-settings: inherit;\n    letter-spacing: inherit;\n    color: inherit;\n    border-radius: 0;\n    background-color: transparent;\n    opacity: 1;\n  }\n  :where(select:is([multiple], [size])) optgroup {\n    font-weight: bolder;\n  }\n  :where(select:is([multiple], [size])) optgroup option {\n    padding-inline-start: 20px;\n  }\n  ::file-selector-button {\n    margin-inline-end: 4px;\n  }\n  ::placeholder {\n    opacity: 1;\n  }\n  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {\n    ::placeholder {\n      color: color-mix(in oklab, currentColor 50%, transparent);\n    }\n  }\n  textarea {\n    resize: vertical;\n  }\n  ::-webkit-search-decoration {\n    -webkit-appearance: none;\n  }\n  ::-webkit-date-and-time-value {\n    min-height: 1lh;\n    text-align: inherit;\n  }\n  ::-webkit-datetime-edit {\n    display: inline-flex;\n  }\n  ::-webkit-datetime-edit-fields-wrapper {\n    padding: 0;\n  }\n  ::-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 {\n    padding-block: 0;\n  }\n  :-moz-ui-invalid {\n    box-shadow: none;\n  }\n  button, input:where([type=\"button\"], [type=\"reset\"], [type=\"submit\"]), ::file-selector-button {\n    appearance: button;\n  }\n  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {\n    height: auto;\n  }\n  [hidden]:where(:not([hidden=\"until-found\"])) {\n    display: none !important;\n  }\n}\n@layer utilities {\n  .visible {\n    visibility: visible;\n  }\n  .fixed {\n    position: fixed;\n  }\n  .ml-auto {\n    margin-left: auto;\n  }\n  .hidden {\n    display: none;\n  }\n  .flex-col {\n    flex-direction: column;\n  }\n  .items-start {\n    align-items: flex-start;\n  }\n  .rounded {\n    border-radius: 0.25rem;\n  }\n  .border {\n    border-style: var(--tw-border-style);\n    border-width: 1px;\n  }\n  .px-4 {\n    padding-inline: calc(var(--spacing) * 4);\n  }\n  .text-\\[14px\\]\\/\\[14px\\] {\n    font-size: 14px;\n    line-height: 14px;\n  }\n  .text-\\[20px\\]\\/\\[20px\\] {\n    font-size: 20px;\n    line-height: 20px;\n  }\n  .font-semibold {\n    --tw-font-weight: var(--font-weight-semibold);\n    font-weight: var(--font-weight-semibold);\n  }\n  .whitespace-nowrap {\n    white-space: nowrap;\n  }\n  .text-gray-700 {\n    color: var(--color-gray-700);\n  }\n  .outline {\n    outline-style: var(--tw-outline-style);\n    outline-width: 1px;\n  }\n  .xl\\:flex-row {\n    @media (width >= 80rem) {\n      flex-direction: row;\n    }\n  }\n  .xl\\:items-end {\n    @media (width >= 80rem) {\n      align-items: flex-end;\n    }\n  }\n  .xl\\:pb-\\[2px\\] {\n    @media (width >= 80rem) {\n      padding-bottom: 2px;\n    }\n  }\n}\n@property --tw-border-style {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: solid;\n}\n@property --tw-font-weight {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-outline-style {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: solid;\n}\n";
 n$1(css$b,{});
 
 // This Source Code Form is subject to the terms of the Mozilla Public
@@ -530,9 +530,12 @@ class DepthToPointcloudWorkerPool {
   #processedFrameQueue = [];
   #isWebGpuSupported = false;
   #metrics;
+  #maximumStorageBufferSize;
   #FRAME_BATCH_SIZE;
   #targetDispatchIntervalMs;
   #maxProcessedQueueSize;
+  #prevColorFrameWidth;
+  #prevDepthFrameWidth;
   #dispatchCallback;
   #isProcessing = false;
   #dispatchTimeoutId = undefined;
@@ -544,6 +547,7 @@ class DepthToPointcloudWorkerPool {
           console.warn("WebGPU adapter not found. Falling back to CPU for all frames.");
         } else {
           this.#isWebGpuSupported = true;
+          this.#maximumStorageBufferSize = gpuAdapter.limits.maxStorageBufferBindingSize / 16;
           console.info("WebGPU potentially supported. Will attempt GPU processing.");
         }
       }).catch(err => {
@@ -554,33 +558,62 @@ class DepthToPointcloudWorkerPool {
       console.warn("navigator.gpu is undefined. WebGPU not supported. Falling back to CPU for all frames.");
       this.#isWebGpuSupported = false;
     }
+    this.#maximumStorageBufferSize = -1;
+    this.#prevDepthFrameWidth = 0;
+    this.#prevColorFrameWidth = 0;
     this.#dispatchCallback = callback;
     this.#FRAME_BATCH_SIZE = Math.max(1, batchSize);
     this.#targetDispatchIntervalMs = 1000 / Math.max(1, targetFps);
     this.#maxProcessedQueueSize = Math.max(1, maxProcessedQueueSize);
-    this.workerApis = new Array(WORKER_COUNT).fill(undefined).map(() => wrap$3(new Worker(new URL("pointcloudFromDepth.worker-JVTJ-r5q.js", import.meta.url), {
+    this.workerApis = new Array(WORKER_COUNT).fill(undefined).map(() => wrap$3(new Worker(new URL("pointcloudFromDepth.worker-hil48rbC.js", import.meta.url), {
       type: "module"
     })));
     this.#metrics = new EventMetricsManager();
     this.#metrics.registerEvent("pcl-pool.frameInput");
   }
   async queueDepthFrame(data) {
-    // @ts-expect-error
+    // @ts-expect-error - Known
     // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
     if (!(data.colorFrame.message?.data instanceof Uint8Array)) {
       console.warn("Skipping frame: colorFrame.message.data is not a Uint8Array", data.colorFrame);
       return;
     }
-    this.#frameQueue.push(data);
-    this.tryProcessBatch();
+    if (data.width !== this.#prevDepthFrameWidth || data.i420Width !== this.#prevColorFrameWidth) {
+      this.setMaxGpuQueueSize(data.width, data.height);
+      this.#prevDepthFrameWidth = data.width;
+      this.#prevColorFrameWidth = data.i420Width;
+      this.#frameQueue = [];
+    }
+    if (data.width === data.i420Width && data.height === data.i420Height) {
+      this.#frameQueue.push(data);
+      this.tryProcessBatch();
+    }
+  }
+  setMaxGpuQueueSize(width, height) {
+    if (!this.#isWebGpuSupported) {
+      return;
+    }
+    const numPixelsPerFrame = width * height;
+    const currentOutSize = numPixelsPerFrame * 16 * this.#FRAME_BATCH_SIZE;
+    if (currentOutSize > this.#maximumStorageBufferSize) {
+      console.warn(`GPU queue size ${currentOutSize} exceeds maximum storage buffer size ${this.#maximumStorageBufferSize}. Reducing batch size.`);
+      const frameBatchSize = Math.floor(this.#maximumStorageBufferSize / (numPixelsPerFrame * 16));
+      this.#FRAME_BATCH_SIZE = Math.max(1, frameBatchSize);
+      if (frameBatchSize < 1) {
+        console.warn("Output buffer size is too small to process. Falling back to CPU.");
+        this.#isWebGpuSupported = false;
+      }
+    }
   }
-  tryProcessBatch() {
+
+  // eslint-disable-next-line @foxglove/no-boolean-parameters
+  tryProcessBatch(force = false) {
     this.#metrics?.registerEvent("pcl-pool.batchSent");
     const fps = this.#metrics?.calculate("pcl-pool.batchSent");
     if (fps && fps > 0) {
       this.#targetDispatchIntervalMs = 1000 / Math.max(4, fps);
     }
-    if (this.#isProcessing || this.#frameQueue.length < this.#FRAME_BATCH_SIZE) {
+    if ((this.#isProcessing || this.#frameQueue.length < this.#FRAME_BATCH_SIZE) && !force) {
       return;
     }
     this.#isProcessing = true;
@@ -602,7 +635,7 @@ class DepthToPointcloudWorkerPool {
     const i420Height = firstFrame.i420Height;
     try {
       const depthDataArray = batchToProcess.map(f => uint8ArrayToUint16Array(f.depthFrame.data));
-      // @ts-expect-error
+      // @ts-expect-error - ITS unknow
       // eslint-disable-next-line @typescript-eslint/no-unsafe-argument, @typescript-eslint/no-unsafe-member-access
       const i420DataArray = batchToProcess.map(f => f.colorFrame.message.data);
       const workerIndex = this.lastUsedWorkerIndex;
@@ -670,6 +703,10 @@ class DepthToPointcloudWorkerPool {
   }
   #addToProcessedQueue(processedFrame) {
     if (this.#processedFrameQueue.length >= this.#maxProcessedQueueSize) {
+      const fps = this.#metrics?.calculate("pcl-pool.batchSent");
+      if (fps && fps > 0) {
+        this.#targetDispatchIntervalMs = 1000 / Math.max(4, fps + 1);
+      }
       this.#processedFrameQueue.shift();
       console.warn(`Processed frame queue full (>= ${this.#maxProcessedQueueSize}). Dropping oldest frame.`);
     }
@@ -717,7 +754,7 @@ class DepthToPointcloudWorkerPool {
 // file, You can obtain one at http://mozilla.org/MPL/2.0/
 
 function initWorker(callback) {
-  const workerWrap = wrap$3(new Worker(new URL("deserialization.worker-DsCOJqEa.js", import.meta.url), {
+  const workerWrap = wrap$3(new Worker(new URL("deserialization.worker-d0xuPKYs.js", import.meta.url), {
     type: "module",
     name: `message-decoder`
   }));
@@ -917,6 +954,10 @@ class FoxgloveConnection {
   }
   async handleParsePoitcloudMessage(coloredEvent) {
     const poitcloudFrame = this.PoitCloudSyncFramework.getFrame(coloredEvent.receiveTime.nsec);
+    const {
+      width: colorWith,
+      height: colorHeight
+    } = this.parseResolutionFromMessage(coloredEvent.message, coloredEvent.topic);
     if (poitcloudFrame) {
       const neuralCameraIntrinsics = JSON.parse(localStorage.getItem("neuralCameraIntrinsics") ?? "{}");
       await this.depthToPointcloudWorkerPool.queueDepthFrame({
@@ -928,18 +969,25 @@ class FoxgloveConnection {
         cx: neuralCameraIntrinsics.right.principalPoint.x,
         cy: neuralCameraIntrinsics.right.principalPoint.y,
         colorFrame: coloredEvent,
-        i420Width: poitcloudFrame.width ?? 0,
-        i420Height: poitcloudFrame.height ?? 0
+        i420Width: colorWith ?? poitcloudFrame.width ?? 0,
+        i420Height: colorHeight ?? poitcloudFrame.height ?? 0
       });
     }
   }
   parseResolutionFromMessage(message, topic) {
     // Check if usual width/height attributes are present
-    // @ts-ignore
+    // @ts-expect-error - ITS unknow
     if ('width' in message && 'height' in message) {
       this.resolutions.set(topic, `${message.width}x${message.height}`);
-      return;
+      return {
+        width: message.width,
+        height: message.height
+      };
     }
+    return {
+      width: undefined,
+      height: undefined
+    };
   }
   handleParsedMessage(event) {
     this.decodeMetrics.registerEvent(event.topic);
@@ -955,7 +1003,8 @@ class FoxgloveConnection {
     event.sizeInBytes = messageSize;
     this.messageEvents.push(event);
     this.emitState();
-    if (event.topic === "H.264 Stream") {
+    const poitcloudColorFrameName = this.subscribedTopics.get("_Point Cloud Color") ? "_Point Cloud Color" : "H.264 Stream";
+    if (event.topic === poitcloudColorFrameName) {
       void this.handleParsePoitcloudMessage(event);
     }
   }
@@ -19103,7 +19152,7 @@ class WebRtcBridge extends ArtificialWorker {
   constructor(automaticTokenRefresh) {
     super();
     this.automaticTokenRefresh = automaticTokenRefresh;
-    this.#worker = new Worker(new URL("worker-B5OJw-Fq.js", import.meta.url), {
+    this.#worker = new Worker(new URL("worker-CzUjMpCN.js", import.meta.url), {
       type: "module"
     });
     this.#setupArtificialWorker();
@@ -19319,7 +19368,7 @@ class VisualizerConnection extends FoxgloveConnection {
     let worker;
     if (type === 'ws') {
       this.#url = data.connectionUrl;
-      worker = new Worker(new URL("worker-aVL4LGa3.js", import.meta.url), {
+      worker = new Worker(new URL("worker-B7qK-cxf.js", import.meta.url), {
         type: "module"
       });
     } else {
@@ -19343,6 +19392,9 @@ class VisualizerConnection extends FoxgloveConnection {
   }
   subscribe(args) {
     this.#adapter?.subscribe(args);
+    for (const topic of args.topics) {
+      this.subscribedTopics.set(topic, topic);
+    }
   }
   unsubscribe(args) {
     this.#adapter?.unsubscribe(args);
@@ -85410,7 +85462,7 @@ function legacy(parser) {
     return new LanguageSupport(StreamLanguage.define(parser));
 }
 function sql$1(dialectName) {
-    return import('./index-DZgY6A3h.js').then(m => m.sql({ dialect: m[dialectName] }));
+    return import('./index-BDGOyJit.js').then(m => m.sql({ dialect: m[dialectName] }));
 }
 /**
 An array of language descriptions for known language packages.
@@ -85421,7 +85473,7 @@ const languages = [
         name: "C",
         extensions: ["c", "h", "ino"],
         load() {
-            return import('./index-I0XgHBlj.js').then(m => m.cpp());
+            return import('./index-BtVYSyU9.js').then(m => m.cpp());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -85429,7 +85481,7 @@ const languages = [
         alias: ["cpp"],
         extensions: ["cpp", "c++", "cc", "cxx", "hpp", "h++", "hh", "hxx"],
         load() {
-            return import('./index-I0XgHBlj.js').then(m => m.cpp());
+            return import('./index-BtVYSyU9.js').then(m => m.cpp());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -85449,7 +85501,7 @@ const languages = [
         name: "Go",
         extensions: ["go"],
         load() {
-            return import('./index-pwNtzQuf.js').then(m => m.go());
+            return import('./index-D7zKsndC.js').then(m => m.go());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -85464,7 +85516,7 @@ const languages = [
         name: "Java",
         extensions: ["java"],
         load() {
-            return import('./index-DE0_tKGA.js').then(m => m.java());
+            return import('./index-3y-FxBOU.js').then(m => m.java());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -85480,7 +85532,7 @@ const languages = [
         alias: ["json5"],
         extensions: ["json", "map"],
         load() {
-            return import('./index-BZ8z044k.js').then(m => m.json());
+            return import('./index-DC1kmt3c.js').then(m => m.json());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -85494,14 +85546,14 @@ const languages = [
         name: "LESS",
         extensions: ["less"],
         load() {
-            return import('./index-B1pNpslP.js').then(m => m.less());
+            return import('./index-BJVD4ja7.js').then(m => m.less());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
         name: "Liquid",
         extensions: ["liquid"],
         load() {
-            return import('./index-CLPc3bUH.js').then(m => m.liquid());
+            return import('./index--ExGcWRF.js').then(m => m.liquid());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -85527,7 +85579,7 @@ const languages = [
         name: "PHP",
         extensions: ["php", "php3", "php4", "php5", "php7", "phtml"],
         load() {
-            return import('./index-DsO3GPWF.js').then(m => m.php());
+            return import('./index-D3e3XAuV.js').then(m => m.php());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -85544,28 +85596,28 @@ const languages = [
         extensions: ["BUILD", "bzl", "py", "pyw"],
         filename: /^(BUCK|BUILD)$/,
         load() {
-            return import('./index-BNXdmaeO.js').then(m => m.python());
+            return import('./index-Dn4LK93L.js').then(m => m.python());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
         name: "Rust",
         extensions: ["rs"],
         load() {
-            return import('./index-B5_Aa-W3.js').then(m => m.rust());
+            return import('./index-DEnq90TB.js').then(m => m.rust());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
         name: "Sass",
         extensions: ["sass"],
         load() {
-            return import('./index-CGXxFWjz.js').then(m => m.sass({ indented: true }));
+            return import('./index-CgyrzKmo.js').then(m => m.sass({ indented: true }));
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
         name: "SCSS",
         extensions: ["scss"],
         load() {
-            return import('./index-CGXxFWjz.js').then(m => m.sass());
+            return import('./index-CgyrzKmo.js').then(m => m.sass());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -85596,7 +85648,7 @@ const languages = [
         name: "WebAssembly",
         extensions: ["wat", "wast"],
         load() {
-            return import('./index-CIHmVsn2.js').then(m => m.wast());
+            return import('./index-TJDtDUfC.js').then(m => m.wast());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -85604,7 +85656,7 @@ const languages = [
         alias: ["rss", "wsdl", "xsd"],
         extensions: ["xml", "xsl", "xsd", "svg"],
         load() {
-            return import('./index-B4d7dS8a.js').then(m => m.xml());
+            return import('./index-gihFGAxa.js').then(m => m.xml());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
@@ -85612,7 +85664,7 @@ const languages = [
         alias: ["yml"],
         extensions: ["yaml", "yml"],
         load() {
-            return import('./index-DbT8vr6l.js').then(m => m.yaml());
+            return import('./index-DG1LjJ38.js').then(m => m.yaml());
         }
     }),
     // Legacy modes ported from CodeMirror 5
@@ -86408,13 +86460,13 @@ const languages = [
         name: "Vue",
         extensions: ["vue"],
         load() {
-            return import('./index-CXdNn-IZ.js').then(m => m.vue());
+            return import('./index-DBfT810F.js').then(m => m.vue());
         }
     }),
     /*@__PURE__*/LanguageDescription.of({
         name: "Angular Template",
         load() {
-            return import('./index-LmBY2nOo.js').then(m => m.angular());
+            return import('./index-5qLvVfXR.js').then(m => m.angular());
         }
     })
 ];
@@ -162206,7 +162258,21 @@ function PanelToolbarMetrics({
     ref: descriptionRef,
     width: "full"
   }, variant === "compact" ? /*#__PURE__*/React__default.createElement(Tooltip, {
-    content: /*#__PURE__*/React__default.createElement("ul", null, /*#__PURE__*/React__default.createElement("li", null, "Camera: ", !targetFps || targetFps === 0 ? "-" : targetFps, " FPS"), /*#__PURE__*/React__default.createElement("li", null, "Network:", " ", !metrics || metrics?.incomingMessagesFps === 0 ? "-" : metrics.incomingMessagesFps, " ", "FPS"), /*#__PURE__*/React__default.createElement("li", null, "Decoding:", " ", !metrics || metrics?.decodedMessagesFps === 0 ? "-" : metrics.decodedMessagesFps, " ", "FPS"), /*#__PURE__*/React__default.createElement("li", null, "Rendering: ", !renderedFps || renderedFps === 0 ? "-" : renderedFps, " FPS"), /*#__PURE__*/React__default.createElement("li", null, "Annotations:", " ", !annotationsFps || annotationsFps === 0 || !Number.isFinite(annotationsFps) ? "-" : annotationsFps, " ", "FPS"), /*#__PURE__*/React__default.createElement("li", null, "Throughput:", " ", !metrics || metrics?.messageThroughput === 0 ? "-" : metrics.messageThroughput, " ", "Mbps"), /*#__PURE__*/React__default.createElement("li", null, "Frontend Delay: ", eventLoopDelay.toFixed(2), " ms")),
+    content: /*#__PURE__*/React__default.createElement("ul", null, /*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement("b", {
+      className: "font-semibold"
+    }, " Camera:"), " ", !targetFps || targetFps === 0 ? "-" : targetFps, " FPS"), /*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement("b", {
+      className: "font-semibold"
+    }, "Network:", " "), !metrics || metrics?.incomingMessagesFps === 0 ? "-" : metrics.incomingMessagesFps, " ", "FPS"), /*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement("b", {
+      className: "font-semibold"
+    }, "Decoding:", " "), !metrics || metrics?.decodedMessagesFps === 0 ? "-" : metrics.decodedMessagesFps, " ", "FPS"), /*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement("b", {
+      className: "font-semibold"
+    }, "Rendering:"), " ", !renderedFps || renderedFps === 0 ? "-" : renderedFps, " FPS"), /*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement("b", {
+      className: "font-semibold"
+    }, "Annotations:", " "), !annotationsFps || annotationsFps === 0 || !Number.isFinite(annotationsFps) ? "-" : annotationsFps, " ", "FPS"), /*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement("b", {
+      className: "font-semibold"
+    }, "Throughput:", " "), !metrics || metrics?.messageThroughput === 0 ? "-" : metrics.messageThroughput, " ", "Mbps"), /*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement("b", {
+      className: "font-semibold"
+    }, "Frontend Delay: "), eventLoopDelay.toFixed(2), " ms")),
     direction: "bottom",
     className: "ml-auto"
   }, /*#__PURE__*/React__default.createElement(Button, {
@@ -162377,9 +162443,16 @@ const PanelToolbar = ({
   }, extraVisible ? "Less" : "More"), extraVisible && detections.map(detection => makeDetection(detection, {
     extra: true
   })))), kind === "pointCloud" && /*#__PURE__*/React__default.createElement(Flex, null, /*#__PURE__*/React__default.createElement(Tooltip, {
+    side: "bottom",
     content: /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Label$3, {
       text: "To move camera:"
-    }), /*#__PURE__*/React__default.createElement("ul", null, /*#__PURE__*/React__default.createElement("li", null, "W - Move camera forward"), /*#__PURE__*/React__default.createElement("li", null, "A - Move camera backward"), /*#__PURE__*/React__default.createElement("li", null, "S - Move camera to the left"), /*#__PURE__*/React__default.createElement("li", null, "D - Move camera to the right"), /*#__PURE__*/React__default.createElement("li", null, "Scroll \u2013 Zoom in and out"), /*#__PURE__*/React__default.createElement("li", null, "Drag \u2013 Move camera parallel to the ground"), /*#__PURE__*/React__default.createElement("li", null, `Right-click + Drag horizontally – Rotate the camera around the world's z-axis`), /*#__PURE__*/React__default.createElement("li", null, `Right-click + Drag vertically – Pan the camera around the world's x- and y- axes`)))
+    }), /*#__PURE__*/React__default.createElement("ul", null, /*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement("b", {
+      className: "font-semibold"
+    }, "Scroll:"), " Zoom In and Out"), /*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement("b", {
+      className: "font-semibold"
+    }, "Left-click + Drag:"), " Rotate Camera"), /*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement("b", {
+      className: "font-semibold"
+    }, "Right-click + Drag:"), " Move Camera (X and Y axes)")))
   }, /*#__PURE__*/React__default.createElement(Button, {
     icon: MdHelpOutline,
     variant: "outline",
@@ -162491,7 +162564,7 @@ function createRenderDelaySampler() {
   };
 }
 
-const ImagePanelComponent = /*#__PURE__*/React__default.lazy(async () => await import('./index-CJSOG1CX.js'));
+const ImagePanelComponent = /*#__PURE__*/React__default.lazy(async () => await import('./index-BoavvIJ0.js'));
 const ImagePanelBody = ({
   topic,
   frameRenderedEvent,
@@ -162568,7 +162641,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-CdXrBVPC.js'));
+const ThreeDeeRenderComponent = /*#__PURE__*/React__default.lazy(async () => await import('./index-CdxzudUl.js'));
 const PointCloudPanelBody = ({
   topic,
   frameRenderedEvent

package/dist/{index-CdXrBVPC.js → index-CdxzudUl.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-BuRQ7ljn.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-C4GjAqu3.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';
@@ -60211,6 +60211,9 @@ class CameraStateSettings extends SceneExtension {
     canvas.addEventListener("mouseleave", this.#handleMouseLeave);
     canvas.addEventListener("contextmenu", event => event.preventDefault());
 
+    // CAMERA "ICON"
+    this.cameraIcon();
+
     // Set camera state to default
     setTimeout(() => {
       const activeCamera = this.getActiveCamera();
@@ -60236,6 +60239,39 @@ class CameraStateSettings extends SceneExtension {
       this.renderer.queueAnimationFrame();
     }, 100);
   }
+  cameraIcon() {
+    const dotRadius = 7.5;
+    const rodRadius = 2;
+    const rodLength = 60;
+    const rodColor = 0x5724E8;
+    const dotColor = 0xffffff;
+    const numRods = 4;
+    const forwardTiltAngle = -Math.PI / 6;
+    const dotMaterial = new MeshBasicMaterial({
+      color: dotColor
+    });
+    const rodMaterial = new MeshBasicMaterial({
+      color: rodColor
+    });
+    const dotGeometry = new SphereGeometry(dotRadius, 16, 16);
+    const rodGeometry = new CylinderGeometry(rodRadius, rodRadius, rodLength, 8);
+    const compositeObject = new Group();
+    const dotMesh = new Mesh(dotGeometry, dotMaterial);
+    compositeObject.add(dotMesh);
+    for (let i = 0; i < numRods; i++) {
+      const pivot = new Object3D();
+      const angle = Math.PI / 4 + i * (Math.PI / 2);
+      pivot.rotation.y = angle;
+      pivot.rotation.z = forwardTiltAngle;
+      const rodMesh = new Mesh(rodGeometry, rodMaterial);
+      rodMesh.rotation.z = Math.PI / 2;
+      rodMesh.position.x = rodLength / 2;
+      pivot.add(rodMesh);
+      compositeObject.add(pivot);
+    }
+    compositeObject.rotation.x = Math.PI / 2 * 3;
+    this.add(compositeObject);
+  }
   dispose() {
     this.renderer.off("transformTreeUpdated", this.#handleTransformTreeUpdated);
     this.renderer.settings.errors.off("update", this.#handleErrorChange);

package/dist/{index-CGXxFWjz.js → index-CgyrzKmo.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-BuRQ7ljn.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-C4GjAqu3.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/{index-DsO3GPWF.js → index-D3e3XAuV.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-BuRQ7ljn.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-C4GjAqu3.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/{index-pwNtzQuf.js → index-D7zKsndC.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-BuRQ7ljn.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-C4GjAqu3.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/{index-CXdNn-IZ.js → index-DBfT810F.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-BuRQ7ljn.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-C4GjAqu3.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/{index-BZ8z044k.js → index-DC1kmt3c.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-BuRQ7ljn.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-C4GjAqu3.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';

package/dist/{index-B5_Aa-W3.js → index-DEnq90TB.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-BuRQ7ljn.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-C4GjAqu3.js';
 import './tslib.es6-C73eoP_E.js';
 import 'react';
 import 'react-mosaic-component';