@luxonis/depthai-viewer-common 3.7.5 → 3.8.0

package/dist/index.d.ts

@@ -4,6 +4,7 @@ export * from './components/Pipeline.js';
 export * from './components/Resizable.js';
 export * from './components/Resizable.js';
 export * from './components/Streams.js';
+export * from './components/ThemeToggle.js';
 export * from './constants/connection.js';
 export * from './constants/streams.js';
 export * from './constants/url.js';
@@ -16,6 +17,7 @@ export * from './hooks/useFullScreen.js';
 export * from './models/device-configuration.js';
 export * from './providers/ConnectionProvider.js';
 export * from './providers/DataProvider.js';
+export * from './providers/ThemeProvider.js';
 export * from './providers/VisualizerRuntimeConfigProvider.js';
 export * from './utils/functions.js';
 export * from './utils/functions.js';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,6BAA6B,CAAC;AAC5C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,0BAA0B,CAAC;AACzC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC;AAEnC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,oCAAoC,CAAC;AAEnD,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,0BAA0B,CAAC;AAEzC,cAAc,kCAAkC,CAAC;AACjD,cAAc,mCAAmC,CAAC;AAClD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,gDAAgD,CAAC;AAC/D,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,YAAY,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AACnD,cAAc,kBAAkB,CAAC;AACjC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,yBAAyB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,6BAA6B,CAAC;AAC5C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,0BAA0B,CAAC;AACzC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,yBAAyB,CAAC;AACxC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC;AAEnC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,oCAAoC,CAAC;AAEnD,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,0BAA0B,CAAC;AAEzC,cAAc,kCAAkC,CAAC;AACjD,cAAc,mCAAmC,CAAC;AAClD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,gDAAgD,CAAC;AAC/D,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,YAAY,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AACnD,cAAc,kBAAkB,CAAC;AACjC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,yBAAyB,CAAC"}

package/dist/index.js

@@ -4,6 +4,7 @@ export * from './components/Pipeline.js';
 export * from './components/Resizable.js';
 export * from './components/Resizable.js';
 export * from './components/Streams.js';
+export * from './components/ThemeToggle.js';
 export * from './constants/connection.js';
 export * from './constants/streams.js';
 export * from './constants/url.js';
@@ -16,6 +17,7 @@ export * from './hooks/useFullScreen.js';
 export * from './models/device-configuration.js';
 export * from './providers/ConnectionProvider.js';
 export * from './providers/DataProvider.js';
+export * from './providers/ThemeProvider.js';
 export * from './providers/VisualizerRuntimeConfigProvider.js';
 export * from './utils/functions.js';
 export * from './utils/functions.js';

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,6BAA6B,CAAC;AAC5C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,0BAA0B,CAAC;AACzC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC;AAEnC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,oCAAoC,CAAC;AAEnD,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,0BAA0B,CAAC;AAEzC,cAAc,kCAAkC,CAAC;AACjD,cAAc,mCAAmC,CAAC;AAClD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,gDAAgD,CAAC;AAC/D,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AAEnC,cAAc,kBAAkB,CAAC;AACjC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,yBAAyB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,6BAA6B,CAAC;AAC5C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,0BAA0B,CAAC;AACzC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,yBAAyB,CAAC;AACxC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC;AAEnC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,oCAAoC,CAAC;AAEnD,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,0BAA0B,CAAC;AAEzC,cAAc,kCAAkC,CAAC;AACjD,cAAc,mCAAmC,CAAC;AAClD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,gDAAgD,CAAC;AAC/D,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AAEnC,cAAc,kBAAkB,CAAC;AACjC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,yBAAyB,CAAC"}

package/dist/models/device-configuration.d.ts

@@ -17,9 +17,9 @@ export declare const IrSchema: z.ZodObject<{
 }, z.core.$strip>;
 export type Ir = z.infer<typeof IrSchema>;
 export declare const PlatformSchema: z.ZodEnum<{
+    UNKNOWN: "UNKNOWN";
     RVC2: "RVC2";
     RVC4: "RVC4";
-    UNKNOWN: "UNKNOWN";
 }>;
 export type Platform = z.infer<typeof PlatformSchema>;
 export declare const PLATFORM_NAMES: {

package/dist/providers/ConnectionProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConnectionProvider.d.ts","sourceRoot":"","sources":["../../src/providers/ConnectionProvider.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,UAAU,EAAE,qBAAqB,EAAE,MAAM,iCAAiC,CAAC;AACzF,OAAO,EACN,KAAK,cAAc,EACnB,KAAK,mBAAmB,EAExB,MAAM,wBAAwB,CAAC;AAIhC,eAAO,MAAM,iBAAiB,+BAc5B,CAAC;AAEH,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CACxC,KAAK,CAAC,iBAAiB,CAAC;IACvB,cAAc,EAAE,UAAU,EAAE,CAAC;IAC7B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,EAAE,CAAC;IACzB,qBAAqB,CAAC,EAAE,qBAAqB,CAAC;IAC9C,YAAY,CAAC,EAAE,mBAAmB,CAAC;CACnC,CAAC,CA4BF,CAAC;AAEF,eAAO,MAAM,gBAAgB,sBAA4C,CAAC"}
+{"version":3,"file":"ConnectionProvider.d.ts","sourceRoot":"","sources":["../../src/providers/ConnectionProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,UAAU,EAAE,qBAAqB,EAAE,MAAM,iCAAiC,CAAC;AACzF,OAAO,EACN,KAAK,cAAc,EACnB,KAAK,mBAAmB,EAExB,MAAM,wBAAwB,CAAC;AAKhC,eAAO,MAAM,iBAAiB,+BAc5B,CAAC;AAEH,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CACxC,KAAK,CAAC,iBAAiB,CAAC;IACvB,cAAc,EAAE,UAAU,EAAE,CAAC;IAC7B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,EAAE,CAAC;IACzB,qBAAqB,CAAC,EAAE,qBAAqB,CAAC;IAC9C,YAAY,CAAC,EAAE,mBAAmB,CAAC;CACnC,CAAC,CA4BF,CAAC;AAEF,eAAO,MAAM,gBAAgB,sBAA4C,CAAC"}

package/dist/providers/ConnectionProvider.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { VisualizerContext } from '@luxonis/visualizer-protobuf';
 import React from 'react';
 import { useCreateConnection, } from '../hooks/connection.js';
 import { noop } from '../utils/functions.js';
+import { VisualizerContext } from '../visualizer/index.js';
 import { useData } from './DataProvider.js';
 export const ConnectionContext = React.createContext({
     daiConnection: null,

package/dist/providers/ConnectionProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"ConnectionProvider.js","sourceRoot":"","sources":["../../src/providers/ConnectionProvider.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AACjE,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAGN,mBAAmB,GACnB,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAE5C,MAAM,CAAC,MAAM,iBAAiB,GAAG,KAAK,CAAC,aAAa,CAAiB;IACpE,aAAa,EAAE,IAAI;IACnB,SAAS,EAAE,KAAK;IAChB,MAAM,EAAE,EAAE;IACV,aAAa,EAAE,KAAK;IACpB,iBAAiB,EAAE,EAAE;IACrB,QAAQ,EAAE,SAAS;IACnB,YAAY,EAAE,SAAS;IACvB,aAAa,EAAE,SAAS;IACxB,iBAAiB,EAAE,KAAK;IACxB,oBAAoB,EAAE,IAAI;IAC1B,WAAW,EAAE,EAAE;IACf,WAAW,EAAE,IAAI;IACjB,iBAAiB,EAAE,KAAK;CACxB,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,kBAAkB,GAQ3B,CAAC,EACJ,QAAQ,EACR,cAAc,EACd,aAAa,EACb,aAAa,EACb,qBAAqB,EACrB,YAAY,GACZ,EAAE,EAAE;IACJ,MAAM,EAAE,cAAc,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,OAAO,EAAE,CAAC;IAE7D,MAAM,cAAc,GAAG,mBAAmB,CAAC;QAC1C,IAAI,EAAE,cAAc;QACpB,KAAK;QACL,QAAQ;QACR,aAAa,EAAE,KAAK;QACpB,cAAc;QACd,aAAa;QACb,aAAa;QACb,qBAAqB,EAAE,qBAAqB;QAC5C,YAAY;KACZ,CAAC,CAAC;IAEH,OAAO,CACN,KAAC,iBAAiB,IAAC,WAAW,EAAE,cAAc,CAAC,WAAW,YACzD,KAAC,iBAAiB,CAAC,QAAQ,IAAC,KAAK,EAAE,cAAc,YAAG,QAAQ,GAA8B,GACvE,CACpB,CAAC;AACH,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,EAAE,CAAC,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,CAAC"}
+{"version":3,"file":"ConnectionProvider.js","sourceRoot":"","sources":["../../src/providers/ConnectionProvider.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAGN,mBAAmB,GACnB,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAE5C,MAAM,CAAC,MAAM,iBAAiB,GAAG,KAAK,CAAC,aAAa,CAAiB;IACpE,aAAa,EAAE,IAAI;IACnB,SAAS,EAAE,KAAK;IAChB,MAAM,EAAE,EAAE;IACV,aAAa,EAAE,KAAK;IACpB,iBAAiB,EAAE,EAAE;IACrB,QAAQ,EAAE,SAAS;IACnB,YAAY,EAAE,SAAS;IACvB,aAAa,EAAE,SAAS;IACxB,iBAAiB,EAAE,KAAK;IACxB,oBAAoB,EAAE,IAAI;IAC1B,WAAW,EAAE,EAAE;IACf,WAAW,EAAE,IAAI;IACjB,iBAAiB,EAAE,KAAK;CACxB,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,kBAAkB,GAQ3B,CAAC,EACJ,QAAQ,EACR,cAAc,EACd,aAAa,EACb,aAAa,EACb,qBAAqB,EACrB,YAAY,GACZ,EAAE,EAAE;IACJ,MAAM,EAAE,cAAc,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,OAAO,EAAE,CAAC;IAE7D,MAAM,cAAc,GAAG,mBAAmB,CAAC;QAC1C,IAAI,EAAE,cAAc;QACpB,KAAK;QACL,QAAQ;QACR,aAAa,EAAE,KAAK;QACpB,cAAc;QACd,aAAa;QACb,aAAa;QACb,qBAAqB,EAAE,qBAAqB;QAC5C,YAAY;KACZ,CAAC,CAAC;IAEH,OAAO,CACN,KAAC,iBAAiB,IAAC,WAAW,EAAE,cAAc,CAAC,WAAW,YACzD,KAAC,iBAAiB,CAAC,QAAQ,IAAC,KAAK,EAAE,cAAc,YAAG,QAAQ,GAA8B,GACvE,CACpB,CAAC;AACH,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,EAAE,CAAC,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,CAAC"}

package/dist/providers/ThemeProvider.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+/** What the user picked. `system` follows the OS and keeps following it. */
+export type ThemePreference = 'light' | 'dark' | 'system';
+/** What is actually on screen. `system` has already been resolved. */
+export type ResolvedTheme = 'light' | 'dark';
+export declare const THEME_PREFERENCES: ThemePreference[];
+export declare const resolveTheme: (preference: ThemePreference) => ResolvedTheme;
+export declare const readStoredTheme: () => ThemePreference;
+/**
+ * Applied both from React and from the inline bootstrap script in index.html, which
+ * runs before first paint so the app never flashes the light theme on load.
+ */
+export declare const applyTheme: (theme: ResolvedTheme) => void;
+export type ThemeContext = {
+    /** The user's choice, including `system`. */
+    theme: ThemePreference;
+    /** The theme currently rendered. */
+    resolvedTheme: ResolvedTheme;
+    setTheme: (theme: ThemePreference) => void;
+    /** Flips between light and dark, resolving `system` first. */
+    toggleTheme: () => void;
+};
+export declare const useTheme: () => ThemeContext;
+export declare const ThemeProvider: React.FC<React.PropsWithChildren>;
+//# sourceMappingURL=ThemeProvider.d.ts.map

package/dist/providers/ThemeProvider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../src/providers/ThemeProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,4EAA4E;AAC5E,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,CAAC;AAE1D,sEAAsE;AACtE,MAAM,MAAM,aAAa,GAAG,OAAO,GAAG,MAAM,CAAC;AAE7C,eAAO,MAAM,iBAAiB,EAAE,eAAe,EAAgC,CAAC;AAWhF,eAAO,MAAM,YAAY,GAAI,YAAY,eAAe,KAAG,aACe,CAAC;AAE3E,eAAO,MAAM,eAAe,QAAO,eAGlC,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,UAAU,GAAI,OAAO,aAAa,SAE9C,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IAC1B,6CAA6C;IAC7C,KAAK,EAAE,eAAe,CAAC;IACvB,oCAAoC;IACpC,aAAa,EAAE,aAAa,CAAC;IAC7B,QAAQ,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAC3C,8DAA8D;IAC9D,WAAW,EAAE,MAAM,IAAI,CAAC;CACxB,CAAC;AASF,eAAO,MAAM,QAAQ,oBAAuC,CAAC;AAE7D,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAsC3D,CAAC"}

package/dist/providers/ThemeProvider.js

@@ -0,0 +1,55 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import { noop } from '../utils/functions.js';
+import { getItemFromLocalStorage, setItemToLocalStorage } from '../utils/local-storage.js';
+export const THEME_PREFERENCES = ['light', 'dark', 'system'];
+const DARK_CLASS = 'dark';
+const COLOR_SCHEME_QUERY = '(prefers-color-scheme: dark)';
+const isThemePreference = (value) => THEME_PREFERENCES.includes(value);
+const prefersDark = () => typeof window !== 'undefined' && window.matchMedia(COLOR_SCHEME_QUERY).matches;
+export const resolveTheme = (preference) => preference === 'system' ? (prefersDark() ? 'dark' : 'light') : preference;
+export const readStoredTheme = () => {
+    const stored = getItemFromLocalStorage('theme');
+    return isThemePreference(stored) ? stored : 'system';
+};
+/**
+ * Applied both from React and from the inline bootstrap script in index.html, which
+ * runs before first paint so the app never flashes the light theme on load.
+ */
+export const applyTheme = (theme) => {
+    document.documentElement.classList.toggle(DARK_CLASS, theme === 'dark');
+};
+const ThemeContext = React.createContext({
+    theme: 'system',
+    resolvedTheme: 'light',
+    setTheme: noop,
+    toggleTheme: noop,
+});
+export const useTheme = () => React.useContext(ThemeContext);
+export const ThemeProvider = ({ children }) => {
+    const [theme, setThemeState] = React.useState(readStoredTheme);
+    const [systemTheme, setSystemTheme] = React.useState(() => prefersDark() ? 'dark' : 'light');
+    const resolvedTheme = theme === 'system' ? systemTheme : theme;
+    // Keep following the OS while the preference is `system`.
+    React.useEffect(() => {
+        const query = window.matchMedia(COLOR_SCHEME_QUERY);
+        const handleChange = (event) => {
+            setSystemTheme(event.matches ? 'dark' : 'light');
+        };
+        query.addEventListener('change', handleChange);
+        return () => query.removeEventListener('change', handleChange);
+    }, []);
+    React.useEffect(() => {
+        applyTheme(resolvedTheme);
+    }, [resolvedTheme]);
+    const setTheme = React.useCallback((next) => {
+        setThemeState(next);
+        setItemToLocalStorage('theme', next);
+    }, []);
+    const toggleTheme = React.useCallback(() => {
+        setTheme(resolvedTheme === 'dark' ? 'light' : 'dark');
+    }, [resolvedTheme, setTheme]);
+    const value = React.useMemo(() => ({ theme, resolvedTheme, setTheme, toggleTheme }), [theme, resolvedTheme, setTheme, toggleTheme]);
+    return _jsx(ThemeContext.Provider, { value: value, children: children });
+};
+//# sourceMappingURL=ThemeProvider.js.map

package/dist/providers/ThemeProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeProvider.js","sourceRoot":"","sources":["../../src/providers/ThemeProvider.tsx"],"names":[],"mappings":"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"}

package/dist/providers/VisualizerRuntimeConfigProvider.d.ts

@@ -1,5 +1,6 @@
-import { type RuntimeConfig } from '@luxonis/visualizer-protobuf';
 import React from 'react';
+import { type RuntimeConfig } from '../visualizer/index.js';
+export declare const STREAM_DIAGNOSTICS_LOCAL_STORAGE_KEY: "viewer-stream-diagnostics-enabled";
 type VisualizerRuntimeConfigContextValue = {
     runtimeConfig: Readonly<RuntimeConfig>;
     updateRuntimeConfig: (runtimeConfig: Readonly<RuntimeConfig>) => void;

package/dist/providers/VisualizerRuntimeConfigProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VisualizerRuntimeConfigProvider.d.ts","sourceRoot":"","sources":["../../src/providers/VisualizerRuntimeConfigProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEN,KAAK,aAAa,EAClB,MAAM,8BAA8B,CAAC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,KAAK,mCAAmC,GAAG;IAC1C,aAAa,EAAE,QAAQ,CAAC,aAAa,CAAC,CAAC;IACvC,mBAAmB,EAAE,CAAC,aAAa,EAAE,QAAQ,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC;IACtE,sBAAsB,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;IAC5D,cAAc,EAAE,CAAC,KAAK,EAAE,OAAO,GAAG,SAAS,KAAK,IAAI,CAAC;IACrD,yBAAyB,EAAE,CAAC,KAAK,EAAE,aAAa,CAAC,wBAAwB,CAAC,KAAK,IAAI,CAAC;CACpF,CAAC;AAuBF,KAAK,oCAAoC,GAAG,KAAK,CAAC,iBAAiB,CAAC;IACnE,oBAAoB,CAAC,EAAE,QAAQ,CAAC,aAAa,CAAC,CAAC;CAC/C,CAAC,CAAC;AAEH,eAAO,MAAM,+BAA+B,EAAE,KAAK,CAAC,EAAE,CAAC,oCAAoC,CAkF1F,CAAC;AAEF,wBAAgB,0BAA0B,IAAI,mCAAmC,CAEhF"}
+{"version":3,"file":"VisualizerRuntimeConfigProvider.d.ts","sourceRoot":"","sources":["../../src/providers/VisualizerRuntimeConfigProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAEN,KAAK,aAAa,EAClB,MAAM,wBAAwB,CAAC;AAGhC,eAAO,MAAM,oCAAoC,EAAG,mCAA4C,CAAC;AAGjG,KAAK,mCAAmC,GAAG;IAC1C,aAAa,EAAE,QAAQ,CAAC,aAAa,CAAC,CAAC;IACvC,mBAAmB,EAAE,CAAC,aAAa,EAAE,QAAQ,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC;IACtE,sBAAsB,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;IAC5D,cAAc,EAAE,CAAC,KAAK,EAAE,OAAO,GAAG,SAAS,KAAK,IAAI,CAAC;IACrD,yBAAyB,EAAE,CAAC,KAAK,EAAE,aAAa,CAAC,wBAAwB,CAAC,KAAK,IAAI,CAAC;CACpF,CAAC;AA2BF,KAAK,oCAAoC,GAAG,KAAK,CAAC,iBAAiB,CAAC;IACnE,oBAAoB,CAAC,EAAE,QAAQ,CAAC,aAAa,CAAC,CAAC;CAC/C,CAAC,CAAC;AAEH,eAAO,MAAM,+BAA+B,EAAE,KAAK,CAAC,EAAE,CAAC,oCAAoC,CAkF1F,CAAC;AAEF,wBAAgB,0BAA0B,IAAI,mCAAmC,CAEhF"}

package/dist/providers/VisualizerRuntimeConfigProvider.js

@@ -1,8 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { setRuntimeConfig as applyVisualizerRuntimeConfig, } from '@luxonis/visualizer-protobuf';
 import React from 'react';
 import { noop } from '../utils/functions.js';
+import { setRuntimeConfig as applyVisualizerRuntimeConfig, } from '../visualizer/index.js';
 const STEREO_DEPTH_MAX_VALUE_STORAGE_KEY = 'stereoDepthMaxValue';
+export const STREAM_DIAGNOSTICS_LOCAL_STORAGE_KEY = 'viewer-stream-diagnostics-enabled';
 const DEFAULT_STEREO_DEPTH_MAX_VALUE = 8000;
 const VisualizerRuntimeConfigContext = React.createContext({
     runtimeConfig: {},
@@ -11,6 +12,9 @@ const VisualizerRuntimeConfigContext = React.createContext({
     setPerspective: noop,
     setNeuralCameraIntrinsics: noop,
 });
+function readPersistedStreamDiagnostics() {
+    return globalThis.localStorage?.getItem(STREAM_DIAGNOSTICS_LOCAL_STORAGE_KEY) === 'true';
+}
 function readPersistedStereoDepthMaxValue() {
     const rawValue = globalThis.localStorage?.getItem(STEREO_DEPTH_MAX_VALUE_STORAGE_KEY);
     // biome-ignore lint/suspicious/noDoubleEquals: <explanation>
@@ -28,7 +32,7 @@ export const VisualizerRuntimeConfigProvider = ({ children, initialRuntimeConfig
         perspective: initialRuntimeConfig?.perspective,
         neuralCameraIntrinsics: initialRuntimeConfig?.neuralCameraIntrinsics,
         debugLogs: initialRuntimeConfig?.debugLogs,
-        streamDiagnostics: initialRuntimeConfig?.streamDiagnostics,
+        streamDiagnostics: initialRuntimeConfig?.streamDiagnostics ?? readPersistedStreamDiagnostics(),
     }));
     const updateRuntimeConfig = React.useCallback((nextRuntimeConfig) => {
         // biome-ignore lint/suspicious/noExplicitAny: <explanation>

package/dist/providers/VisualizerRuntimeConfigProvider.js.map

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

package/dist/utils/local-storage.d.ts

@@ -1,4 +1,4 @@
-export type LocalStorageItems = 'topicList' | 'analyticsEnabled';
+export type LocalStorageItems = 'topicList' | 'analyticsEnabled' | 'theme';
 export declare function getItemFromLocalStorage<T>(key: LocalStorageItems): T | null;
 export declare function setItemToLocalStorage(key: LocalStorageItems, value: unknown): void;
 export declare function removeItemFromLocalStorage(key: LocalStorageItems): void;

package/dist/utils/local-storage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"local-storage.d.ts","sourceRoot":"","sources":["../../src/utils/local-storage.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,iBAAiB,GAAG,WAAW,GAAG,kBAAkB,CAAC;AAEjE,wBAAgB,uBAAuB,CAAC,CAAC,EAAE,GAAG,EAAE,iBAAiB,GAAG,CAAC,GAAG,IAAI,CAQ3E;AAED,wBAAgB,qBAAqB,CAAC,GAAG,EAAE,iBAAiB,EAAE,KAAK,EAAE,OAAO,QAE3E;AAED,wBAAgB,0BAA0B,CAAC,GAAG,EAAE,iBAAiB,QAEhE"}
+{"version":3,"file":"local-storage.d.ts","sourceRoot":"","sources":["../../src/utils/local-storage.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,iBAAiB,GAAG,WAAW,GAAG,kBAAkB,GAAG,OAAO,CAAC;AAE3E,wBAAgB,uBAAuB,CAAC,CAAC,EAAE,GAAG,EAAE,iBAAiB,GAAG,CAAC,GAAG,IAAI,CAQ3E;AAED,wBAAgB,qBAAqB,CAAC,GAAG,EAAE,iBAAiB,EAAE,KAAK,EAAE,OAAO,QAE3E;AAED,wBAAgB,0BAA0B,CAAC,GAAG,EAAE,iBAAiB,QAEhE"}

package/dist/utils/vite-dev-fix.js

@@ -36,7 +36,7 @@ export function viewerViteDevFixPlugin(overrides = {}) {
         '@emotion/styled',
         'color',
     ];
-    const baseExclude = ['@luxonis/depthai-viewer-common', '@luxonis/visualizer-protobuf'];
+    const baseExclude = ['@luxonis/depthai-viewer-common'];
     return {
         name: 'shared-optimize-deps',
         enforce: 'post',

package/dist/utils/vite-dev-fix.js.map

@@ -1 +1 @@
-{"version":3,"file":"vite-dev-fix.js","sourceRoot":"","sources":["../../src/utils/vite-dev-fix.ts"],"names":[],"mappings":"AAEA,MAAM,UAAU,sBAAsB,CACrC,YAAwD,EAAE;IAE1D,MAAM,WAAW,GAAG;QACnB,iBAAiB;QACjB,yBAAyB;QACzB,eAAe;QACf,IAAI;QACJ,YAAY;QACZ,UAAU;QACV,8BAA8B;QAC9B,aAAa;QACb,eAAe;QACf,qBAAqB;QACrB,4BAA4B;QAC5B,kCAAkC;QAClC,+BAA+B;QAC/B,8BAA8B;QAC9B,4BAA4B;QAC5B,4BAA4B;QAC5B,8BAA8B;QAC9B,oCAAoC;QACpC,cAAc;QACd,SAAS;QACT,QAAQ;QACR,SAAS;QACT,0BAA0B;QAC1B,yBAAyB;QACzB,WAAW;QACX,WAAW;QACX,aAAa;QACb,wBAAwB;QACxB,OAAO;QACP,kBAAkB;QAClB,mBAAmB;QACnB,SAAS;QACT,gBAAgB;QAChB,iBAAiB;QACjB,OAAO;KACP,CAAC;IAEF,MAAM,WAAW,GAAG,CAAC,gCAAgC,EAAE,8BAA8B,CAAC,CAAC;IAEvF,OAAO;QACN,IAAI,EAAE,sBAAsB;QAC5B,OAAO,EAAE,MAAM;QACf,MAAM,CAAC,UAAsB;YAC5B,MAAM,OAAO,GAAG,UAAU,CAAC,YAAY,IAAI,EAAE,CAAC;YAE9C,OAAO;gBACN,GAAG,UAAU;gBACb,YAAY,EAAE;oBACb,GAAG,OAAO;oBACV,OAAO,EAAE;wBACR,GAAG,IAAI,GAAG,CAAC,CAAC,GAAG,CAAC,OAAO,CAAC,OAAO,IAAI,EAAE,CAAC,EAAE,GAAG,WAAW,EAAE,GAAG,CAAC,SAAS,CAAC,OAAO,IAAI,EAAE,CAAC,CAAC,CAAC;qBACtF;oBACD,OAAO,EAAE;wBACR,GAAG,IAAI,GAAG,CAAC,CAAC,GAAG,CAAC,OAAO,CAAC,OAAO,IAAI,EAAE,CAAC,EAAE,GAAG,WAAW,EAAE,GAAG,CAAC,SAAS,CAAC,OAAO,IAAI,EAAE,CAAC,CAAC,CAAC;qBACtF;iBACD;aACD,CAAC;QACH,CAAC;KACD,CAAC;AACH,CAAC"}
+{"version":3,"file":"vite-dev-fix.js","sourceRoot":"","sources":["../../src/utils/vite-dev-fix.ts"],"names":[],"mappings":"AAEA,MAAM,UAAU,sBAAsB,CACrC,YAAwD,EAAE;IAE1D,MAAM,WAAW,GAAG;QACnB,iBAAiB;QACjB,yBAAyB;QACzB,eAAe;QACf,IAAI;QACJ,YAAY;QACZ,UAAU;QACV,8BAA8B;QAC9B,aAAa;QACb,eAAe;QACf,qBAAqB;QACrB,4BAA4B;QAC5B,kCAAkC;QAClC,+BAA+B;QAC/B,8BAA8B;QAC9B,4BAA4B;QAC5B,4BAA4B;QAC5B,8BAA8B;QAC9B,oCAAoC;QACpC,cAAc;QACd,SAAS;QACT,QAAQ;QACR,SAAS;QACT,0BAA0B;QAC1B,yBAAyB;QACzB,WAAW;QACX,WAAW;QACX,aAAa;QACb,wBAAwB;QACxB,OAAO;QACP,kBAAkB;QAClB,mBAAmB;QACnB,SAAS;QACT,gBAAgB;QAChB,iBAAiB;QACjB,OAAO;KACP,CAAC;IAEF,MAAM,WAAW,GAAG,CAAC,gCAAgC,CAAC,CAAC;IAEvD,OAAO;QACN,IAAI,EAAE,sBAAsB;QAC5B,OAAO,EAAE,MAAM;QACf,MAAM,CAAC,UAAsB;YAC5B,MAAM,OAAO,GAAG,UAAU,CAAC,YAAY,IAAI,EAAE,CAAC;YAE9C,OAAO;gBACN,GAAG,UAAU;gBACb,YAAY,EAAE;oBACb,GAAG,OAAO;oBACV,OAAO,EAAE;wBACR,GAAG,IAAI,GAAG,CAAC,CAAC,GAAG,CAAC,OAAO,CAAC,OAAO,IAAI,EAAE,CAAC,EAAE,GAAG,WAAW,EAAE,GAAG,CAAC,SAAS,CAAC,OAAO,IAAI,EAAE,CAAC,CAAC,CAAC;qBACtF;oBACD,OAAO,EAAE;wBACR,GAAG,IAAI,GAAG,CAAC,CAAC,GAAG,CAAC,OAAO,CAAC,OAAO,IAAI,EAAE,CAAC,EAAE,GAAG,WAAW,EAAE,GAAG,CAAC,SAAS,CAAC,OAAO,IAAI,EAAE,CAAC,CAAC,CAAC;qBACtF;iBACD;aACD,CAAC;QACH,CAAC;KACD,CAAC;AACH,CAAC"}

package/dist/visualizer/browser-decoder-fixtures-entry.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=browser-decoder-fixtures-entry.d.ts.map

package/dist/visualizer/browser-decoder-fixtures-entry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"browser-decoder-fixtures-entry.d.ts","sourceRoot":"","sources":["../../src/visualizer/browser-decoder-fixtures-entry.ts"],"names":[],"mappings":""}

package/dist/visualizer/browser-decoder-fixtures-entry.js

@@ -0,0 +1,28 @@
+// 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 { runBuiltInBrowserDecoderFixtures } from "./messaging/browser-decoder-fixtures.js";
+function formatError(error) {
+    if (error instanceof Error) {
+        return error.stack ?? error.message;
+    }
+    return String(error);
+}
+async function main() {
+    const output = document.getElementById("results");
+    if (!output) {
+        throw new Error("Missing #results output container.");
+    }
+    try {
+        const results = await runBuiltInBrowserDecoderFixtures();
+        document.body.dataset.status = "passed";
+        output.textContent = JSON.stringify(results, null, 2);
+    }
+    catch (error) {
+        document.body.dataset.status = "failed";
+        output.textContent = formatError(error);
+        throw error;
+    }
+}
+void main();
+//# sourceMappingURL=browser-decoder-fixtures-entry.js.map

package/dist/visualizer/browser-decoder-fixtures-entry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"browser-decoder-fixtures-entry.js","sourceRoot":"","sources":["../../src/visualizer/browser-decoder-fixtures-entry.ts"],"names":[],"mappings":"AAAA,sEAAsE;AACtE,oEAAoE;AACpE,0DAA0D;AAE1D,OAAO,EAAE,gCAAgC,EAAE,MAAM,yCAAyC,CAAC;AAE3F,SAAS,WAAW,CAAC,KAAc;IACjC,IAAI,KAAK,YAAY,KAAK,EAAE,CAAC;QAC3B,OAAO,KAAK,CAAC,KAAK,IAAI,KAAK,CAAC,OAAO,CAAC;IACtC,CAAC;IACD,OAAO,MAAM,CAAC,KAAK,CAAC,CAAC;AACvB,CAAC;AAED,KAAK,UAAU,IAAI;IACjB,MAAM,MAAM,GAAG,QAAQ,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC;IAClD,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,MAAM,IAAI,KAAK,CAAC,oCAAoC,CAAC,CAAC;IACxD,CAAC;IAED,IAAI,CAAC;QACH,MAAM,OAAO,GAAG,MAAM,gCAAgC,EAAE,CAAC;QACzD,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,QAAQ,CAAC;QACxC,MAAM,CAAC,WAAW,GAAG,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;IACxD,CAAC;IAAC,OAAO,KAAK,EAAE,CAAC;QACf,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,QAAQ,CAAC;QACxC,MAAM,CAAC,WAAW,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;QACxC,MAAM,KAAK,CAAC;IACd,CAAC;AACH,CAAC;AAED,KAAK,IAAI,EAAE,CAAC"}

package/dist/visualizer/components/CssBaseline.d.ts

@@ -0,0 +1,5 @@
+import type React from "react";
+type Props = React.PropsWithChildren;
+export default function CssBaseline({ children }: Props): JSX.Element;
+export {};
+//# sourceMappingURL=CssBaseline.d.ts.map

package/dist/visualizer/components/CssBaseline.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CssBaseline.d.ts","sourceRoot":"","sources":["../../../src/visualizer/components/CssBaseline.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,KAAK,KAAK,GAAG,KAAK,CAAC,iBAAiB,CAAC;AAErC,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAAE,QAAQ,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAEpE"}

package/dist/visualizer/components/CssBaseline.js

@@ -0,0 +1,5 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+export default function CssBaseline({ children }) {
+    return _jsx(_Fragment, { children: children });
+}
+//# sourceMappingURL=CssBaseline.js.map

package/dist/visualizer/components/CssBaseline.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CssBaseline.js","sourceRoot":"","sources":["../../../src/visualizer/components/CssBaseline.tsx"],"names":[],"mappings":";AAIA,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAAE,QAAQ,EAAS;IACrD,OAAO,4BAAG,QAAQ,GAAI,CAAC;AACzB,CAAC"}

package/dist/visualizer/components/EmptyState.d.ts

@@ -0,0 +1,7 @@
+import type React from "react";
+type EmptyStateProps = React.PropsWithChildren<{
+    className?: string;
+}>;
+export default function EmptyState({ children, className }: EmptyStateProps): React.ReactElement;
+export {};
+//# sourceMappingURL=EmptyState.d.ts.map

package/dist/visualizer/components/EmptyState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../../src/visualizer/components/EmptyState.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,KAAK,eAAe,GAAG,KAAK,CAAC,iBAAiB,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC,CAAC;AAEH,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,eAAe,GAAG,KAAK,CAAC,YAAY,CAQ/F"}

package/dist/visualizer/components/EmptyState.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export default function EmptyState({ children, className }) {
+    return (_jsx("div", { className: `flex h-full min-h-0 w-full items-center justify-center bg-card p-6 text-center text-sm text-muted-foreground ${className ?? ""}`.trim(), children: _jsx("div", { className: "max-w-full", children: children }) }));
+}
+//# sourceMappingURL=EmptyState.js.map

package/dist/visualizer/components/EmptyState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState.js","sourceRoot":"","sources":["../../../src/visualizer/components/EmptyState.tsx"],"names":[],"mappings":";AAUA,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAmB;IACzE,OAAO,CACL,cACE,SAAS,EAAE,gHAAgH,SAAS,IAAI,EAAE,EAAE,CAAC,IAAI,EAAE,YAEnJ,cAAK,SAAS,EAAC,YAAY,YAAE,QAAQ,GAAO,GACxC,CACP,CAAC;AACJ,CAAC"}

package/dist/visualizer/components/ErrorBoundary.d.ts

@@ -0,0 +1,16 @@
+import React from "react";
+type ErrorBoundaryProps = React.PropsWithChildren<{
+    fallback?: React.ReactNode;
+    resetKey?: unknown;
+}>;
+type ErrorBoundaryState = {
+    error?: Error;
+};
+export default class ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {
+    constructor(props: ErrorBoundaryProps);
+    static getDerivedStateFromError(error: Error): ErrorBoundaryState;
+    componentDidUpdate(prevProps: ErrorBoundaryProps): void;
+    render(): React.ReactNode;
+}
+export {};
+//# sourceMappingURL=ErrorBoundary.d.ts.map

package/dist/visualizer/components/ErrorBoundary.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorBoundary.d.ts","sourceRoot":"","sources":["../../../src/visualizer/components/ErrorBoundary.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,KAAK,kBAAkB,GAAG,KAAK,CAAC,iBAAiB,CAAC;IAChD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC,CAAC;AAEH,KAAK,kBAAkB,GAAG;IACxB,KAAK,CAAC,EAAE,KAAK,CAAC;CACf,CAAC;AAEF,MAAM,CAAC,OAAO,OAAO,aAAc,SAAQ,KAAK,CAAC,SAAS,CAAC,kBAAkB,EAAE,kBAAkB,CAAC;gBAC7E,KAAK,EAAE,kBAAkB;WAK9B,wBAAwB,CAAC,KAAK,EAAE,KAAK,GAAG,kBAAkB;IAIxD,kBAAkB,CAAC,SAAS,EAAE,kBAAkB,GAAG,IAAI;IAMvD,MAAM,IAAI,KAAK,CAAC,SAAS;CAe1C"}

package/dist/visualizer/components/ErrorBoundary.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// 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 React from "react";
+import EmptyState from "./EmptyState.js";
+export default class ErrorBoundary extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = {};
+    }
+    static getDerivedStateFromError(error) {
+        return { error };
+    }
+    componentDidUpdate(prevProps) {
+        if (prevProps.resetKey !== this.props.resetKey && this.state.error) {
+            this.setState({});
+        }
+    }
+    render() {
+        if (this.state.error) {
+            return (this.props.fallback ?? (_jsxs(EmptyState, { children: [_jsx("strong", { children: "Rendering failed" }), _jsx("br", {}), this.state.error.message] })));
+        }
+        return this.props.children;
+    }
+}
+//# sourceMappingURL=ErrorBoundary.js.map

package/dist/visualizer/components/ErrorBoundary.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorBoundary.js","sourceRoot":"","sources":["../../../src/visualizer/components/ErrorBoundary.tsx"],"names":[],"mappings":";AAAA,sEAAsE;AACtE,oEAAoE;AACpE,0DAA0D;AAE1D,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,UAAU,MAAM,iBAAiB,CAAC;AAWzC,MAAM,CAAC,OAAO,OAAO,aAAc,SAAQ,KAAK,CAAC,SAAiD;IAChG,YAAmB,KAAyB;QAC1C,KAAK,CAAC,KAAK,CAAC,CAAC;QACb,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;IAClB,CAAC;IAEM,MAAM,CAAC,wBAAwB,CAAC,KAAY;QACjD,OAAO,EAAE,KAAK,EAAE,CAAC;IACnB,CAAC;IAEe,kBAAkB,CAAC,SAA6B;QAC9D,IAAI,SAAS,CAAC,QAAQ,KAAK,IAAI,CAAC,KAAK,CAAC,QAAQ,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;YACnE,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;QACpB,CAAC;IACH,CAAC;IAEe,MAAM;QACpB,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;YACrB,OAAO,CACL,IAAI,CAAC,KAAK,CAAC,QAAQ,IAAI,CACrB,MAAC,UAAU,eACT,gDAAiC,EACjC,cAAM,EACL,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,IACd,CACd,CACF,CAAC;QACJ,CAAC;QAED,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC;IAC7B,CAAC;CACF"}

package/dist/visualizer/components/GlobalCss.d.ts

@@ -0,0 +1,2 @@
+export default function GlobalCss(): JSX.Element | null;
+//# sourceMappingURL=GlobalCss.d.ts.map

package/dist/visualizer/components/GlobalCss.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalCss.d.ts","sourceRoot":"","sources":["../../../src/visualizer/components/GlobalCss.tsx"],"names":[],"mappings":"AAAA,MAAM,CAAC,OAAO,UAAU,SAAS,IAAI,GAAG,CAAC,OAAO,GAAG,IAAI,CAEtD"}

package/dist/visualizer/components/GlobalCss.js

@@ -0,0 +1,4 @@
+export default function GlobalCss() {
+    return null;
+}
+//# sourceMappingURL=GlobalCss.js.map

package/dist/visualizer/components/GlobalCss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalCss.js","sourceRoot":"","sources":["../../../src/visualizer/components/GlobalCss.tsx"],"names":[],"mappings":"AAAA,MAAM,CAAC,OAAO,UAAU,SAAS;IAC/B,OAAO,IAAI,CAAC;AACd,CAAC"}

package/dist/visualizer/components/Panel.d.ts

@@ -0,0 +1,37 @@
+import React, { type MutableRefObject } from "react";
+import type { ProtobufKind } from "../messaging/protobuf.js";
+import type { PanelRenderer } from "../panels/panel-renderer.js";
+export type PanelTopic = {
+    name: string;
+    extra: boolean;
+    enabled: boolean;
+};
+export type PanelProps = React.PropsWithChildren<{
+    topic: string;
+    fakedAs?: string;
+    kind: ProtobufKind;
+    disableAnnotations?: boolean;
+    showPerformanceMetrics?: boolean;
+    annotationTopics?: string[];
+    extraAnnotationTopics?: string[];
+    targetFps?: number;
+    triggerToast?: () => void;
+    toggleTopic?: (topic: string) => void;
+    toggleFullscreen?: (panelRef: MutableRefObject<HTMLElement>) => void;
+    hideToolbar?: boolean;
+    canMoveUp?: boolean;
+    moveUp?: () => void;
+    canMoveDown?: boolean;
+    moveDown?: () => void;
+    registerRendered?: (renderer: PanelRenderer) => void;
+    unregisterRendered?: () => void;
+    panelToolbarActions?: JSX.Element;
+    panelOverlay?: JSX.Element;
+}>;
+export type PanelDetections = Record<string, boolean>;
+export type AllDetections = {
+    detections: PanelTopic[];
+};
+export declare const useDetections: () => AllDetections;
+export declare const Panel: React.FC<PanelProps>;
+//# sourceMappingURL=Panel.d.ts.map

package/dist/visualizer/components/Panel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Panel.d.ts","sourceRoot":"","sources":["../../../src/visualizer/components/Panel.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,EAAE,KAAK,gBAAgB,EAAoB,MAAM,OAAO,CAAC;AAIvE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAYjE,MAAM,MAAM,UAAU,GAAG;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,OAAO,CAAC;IACf,OAAO,EAAE,OAAO,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,KAAK,CAAC,iBAAiB,CAAC;IAC/C,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,YAAY,CAAC;IACnB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC5B,qBAAqB,CAAC,EAAE,MAAM,EAAE,CAAC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,gBAAgB,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACrE,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,aAAa,KAAK,IAAI,CAAC;IACrD,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;IAChC,mBAAmB,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAClC,YAAY,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;CAC5B,CAAC,CAAC;AAEH,MAAM,MAAM,eAAe,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AAEtD,MAAM,MAAM,aAAa,GAAG;IAC1B,UAAU,EAAE,UAAU,EAAE,CAAC;CAC1B,CAAC;AAMF,eAAO,MAAM,aAAa,QAAO,aAEhC,CAAC;AA8CF,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CA2MtC,CAAC"}

package/dist/visualizer/components/Panel.js

@@ -0,0 +1,129 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// 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 { Flex, Tooltip } from "@luxonis/ui-components";
+import React, { Suspense, useRef } from "react";
+import { useConnections } from "../context/ConnectionsProvider.js";
+import { useTopicDecodingError } from "../context/VisualizerContext.js";
+import { constructKeyForTopicRenderMetrics, globalInputEventMetricsManager, globalRenderMetricsManager, } from "../utils/metrics-manager.js";
+import EmptyState from "./EmptyState.js";
+import ErrorBoundary from "./ErrorBoundary.js";
+import { PanelToolbar } from "./PanelToolbar.js";
+import RemountOnValueChange from "./RemountOnValueChange.js";
+import { useSharedIntervalTick } from "./shared-interval.js";
+const EMPTY_ANNOTATION_TOPICS = [];
+const DetectionContext = React.createContext({ detections: [] });
+export const useDetections = () => {
+    return React.useContext(DetectionContext);
+};
+const rawToAnnotations = (rawAnnotations, kind, current) => rawAnnotations.map((annotationTopic) => ({
+    name: annotationTopic,
+    extra: kind === "extra",
+    enabled: current.find(({ name }) => name === annotationTopic)?.enabled ?? kind === "main",
+}));
+const detectionsEqual = (left, right) => {
+    if (left.length !== right.length) {
+        return false;
+    }
+    return left.every((detection, index) => {
+        const other = right[index];
+        return (other != undefined &&
+            detection.name === other.name &&
+            detection.extra === other.extra &&
+            detection.enabled === other.enabled);
+    });
+};
+function MetricItem({ label, value, description }) {
+    return (_jsx(Tooltip, { content: description, children: _jsxs("div", { className: "flex w-full items-center justify-between gap-0.5 px-1 py-0.5 text-[12px]/[12px] text-gray-700 cursor-help", children: [_jsx("span", { className: "font-medium pointer-events-none", children: label }), _jsx("span", { className: "pointer-events-none", children: value })] }) }));
+}
+export const Panel = ({ children, kind, topic, fakedAs, disableAnnotations = false, annotationTopics: annotationTopicsProp, extraAnnotationTopics: extraAnnotationTopicsProp, targetFps, toggleTopic, triggerToast, showPerformanceMetrics = false, hideToolbar = false, toggleFullscreen, canMoveUp, moveUp, canMoveDown, moveDown, panelOverlay, panelToolbarActions, }) => {
+    const [detections, setDetections] = React.useState([]);
+    const sectionRef = useRef(null);
+    const decodingError = useTopicDecodingError(topic);
+    const annotationTopics = annotationTopicsProp ?? EMPTY_ANNOTATION_TOPICS;
+    const extraAnnotationTopics = extraAnnotationTopicsProp ?? EMPTY_ANNOTATION_TOPICS;
+    const connections = useConnections();
+    const connection = connections.at(0);
+    const metricsTopic = fakedAs ?? topic;
+    const [metrics, setMetrics] = React.useState(() => connection?.getTopicMetrics(metricsTopic));
+    const metricsTick = useSharedIntervalTick(1_000);
+    React.useEffect(() => {
+        if (disableAnnotations) {
+            setDetections((current) => (current.length === 0 ? current : []));
+            return;
+        }
+        setDetections((current) => {
+            const next = [
+                ...rawToAnnotations(annotationTopics, "main", current),
+                ...rawToAnnotations(extraAnnotationTopics, "extra", current),
+            ];
+            return detectionsEqual(current, next) ? current : next;
+        });
+    }, [annotationTopics, extraAnnotationTopics, disableAnnotations]);
+    const toggleFullscreenForThisPanel = () => {
+        if (!toggleFullscreen || !sectionRef.current) {
+            return;
+        }
+        toggleFullscreen(sectionRef);
+    };
+    const resolution = metrics?.resolutions.get(topic);
+    React.useEffect(() => {
+        setMetrics(connection?.getTopicMetrics(metricsTopic));
+    }, [connection, metricsTopic]);
+    React.useEffect(() => {
+        if (!showPerformanceMetrics) {
+            return;
+        }
+        void metricsTick;
+        setMetrics(connection?.getTopicMetrics(metricsTopic));
+    }, [connection, metricsTick, metricsTopic, showPerformanceMetrics]);
+    const performanceMetrics = React.useMemo(() => {
+        const values = [];
+        if (targetFps !== undefined) {
+            values.push({
+                label: "Target",
+                value: `${targetFps} FPS`,
+                description: "Configured stream FPS requested from the device.",
+            });
+        }
+        const incomingMetricsKind = kind === "pointCloud" ? "incomingPointCloudFrame" : "incomingImageFrame";
+        const networkFps = globalInputEventMetricsManager.calculate(constructKeyForTopicRenderMetrics(incomingMetricsKind, topic)) ??
+            (fakedAs
+                ? globalInputEventMetricsManager.calculate(constructKeyForTopicRenderMetrics("incomingPointCloudFrame", fakedAs))
+                : undefined);
+        if (networkFps !== undefined) {
+            values.push({
+                label: "Network",
+                value: `${networkFps} FPS`,
+                description: "Rate of frames received by the browser for this stream.",
+            });
+        }
+        const decodedMessagesFps = connection?.getTopicMetrics(topic)?.decodedMessagesFps ?? metrics?.decodedMessagesFps;
+        if (decodedMessagesFps !== undefined) {
+            values.push({
+                label: "Decode",
+                value: `${decodedMessagesFps} FPS`,
+                description: "Rate of frames decoded into renderable data for this stream.",
+            });
+        }
+        const renderingFps = globalRenderMetricsManager.calculate(constructKeyForTopicRenderMetrics(kind === "pointCloud" ? "renderPointCloudFrame" : "renderImageFrame", topic));
+        if (renderingFps !== undefined) {
+            values.push({
+                label: "Render",
+                value: `${renderingFps} FPS`,
+                description: "Rate of frames drawn by the panel renderer for this stream.",
+            });
+        }
+        if (metrics?.messageThroughput !== undefined) {
+            values.push({
+                label: "Throughput",
+                value: `${metrics.messageThroughput.toFixed(2)} Mbps`,
+                description: "Network data throughput received by the browser for this stream.",
+            });
+        }
+        return values;
+    }, [connection, fakedAs, kind, metrics, targetFps, topic]);
+    return (_jsx(RemountOnValueChange, { value: "internal-player", children: _jsx(ErrorBoundary, { resetKey: topic, children: _jsx(DetectionContext.Provider, { value: { detections }, children: _jsxs("section", { className: "flex flex-col grow border border-solid border-divider overflow-hidden rounded-lg", ref: sectionRef, children: [showPerformanceMetrics && (_jsx(Flex, { position: "absolute", className: "w-[175px] z-10 bottom-2 right-2", children: _jsx(Flex, { direction: "column", gap: "xs", className: "bg-muted w-full h-auto p-2 rounded-md", children: performanceMetrics.map((metric) => (_jsx(MetricItem, { ...metric }, metric.label))) }) })), panelOverlay, !hideToolbar && (_jsx(PanelToolbar, { kind: kind, topic: topic, setDetections: setDetections, disableAnnotations: disableAnnotations, targetFps: targetFps, toggleTopic: toggleTopic, toggleFullscreen: toggleFullscreenForThisPanel, triggerToast: triggerToast, canMoveUp: canMoveUp, moveUp: moveUp, canMoveDown: canMoveDown, moveDown: moveDown, touchesBreakpoint: sectionRef.current?.clientWidth ? sectionRef.current.clientWidth <= 550 : false, actions: panelToolbarActions, metrics: metrics, resolution: resolution })), _jsx(Suspense, { fallback: _jsx(EmptyState, { children: _jsx("span", { children: "Loading..." }) }), children: decodingError ? (_jsxs(EmptyState, { children: [_jsx("strong", { children: topic }), _jsx("br", {}), decodingError.message] })) : (_jsx(RemountOnValueChange, { value: detections, children: children })) })] }) }) }) }));
+};
+//# sourceMappingURL=Panel.js.map