react-native-inapp-inspector 1.1.28 → 1.1.31

package/dist/commonjs/customHooks/reduxLogger.js

@@ -14,6 +14,7 @@
 //      and per-reducer "last action" consistently.
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.connectReduxStore = exports.inspectorReduxMiddleware = exports.subscribeReduxState = exports.setReduxState = exports.clearActionHistory = exports.getActionHistory = exports.clearLastActionForReducer = exports.getLastActionForReducer = exports.getReduxAutoRefresh = exports.setReduxAutoRefresh = exports.getReduxState = exports.isReduxConnected = void 0;
+const helpers_1 = require("../helpers");
 let currentReduxState = null;
 const listeners = new Set();
 let globalReduxAutoRefresh = true;
@@ -76,7 +77,106 @@ function actionTypeOf(action) {
     }
     return 'UNKNOWN_ACTION';
 }
-function recordAction(action, prevState, nextState) {
+function detectActionOrigin(stack, actionType, actionObj) {
+    const stackLower = (stack || '').toLowerCase();
+    const typeLower = (actionType || '').toLowerCase();
+    // Explicit hint on action if developer tagged it
+    if (actionObj && actionObj.__origin) {
+        const raw = String(actionObj.__origin).toLowerCase();
+        if (raw.includes('saga'))
+            return { originType: 'saga' };
+        if (raw.includes('thunk'))
+            return { originType: 'thunk' };
+        if (raw.includes('ui'))
+            return { originType: 'ui' };
+    }
+    // 1. Saga Detection (Stack + Action naming conventions)
+    const isSaga = stackLower.includes('redux-saga') ||
+        stackLower.includes('runputeffect') ||
+        stackLower.includes('proc.js') ||
+        stackLower.includes('effects.js') ||
+        stackLower.includes('sagamiddleware') ||
+        stackLower.includes('saga.ts') ||
+        stackLower.includes('saga.js') ||
+        stackLower.includes('sagas') ||
+        typeLower.includes('saga') ||
+        typeLower.startsWith('saga/') ||
+        typeLower.startsWith('@saga/');
+    // 2. Thunk / RTK Query Detection
+    const isThunk = stackLower.includes('createasyncthunk') ||
+        stackLower.includes('redux-thunk') ||
+        stackLower.includes('rtk-query') ||
+        stackLower.includes('thunkmiddleware') ||
+        stackLower.includes('actioncreator') ||
+        typeLower.includes('thunk') ||
+        typeLower.endsWith('/pending') ||
+        typeLower.endsWith('/fulfilled') ||
+        typeLower.endsWith('/rejected');
+    // 3. Parse Stack Frames to find best application caller
+    const lines = (stack || '').split('\n').map(l => l.trim()).filter(Boolean);
+    let bestFrame = null;
+    for (let i = 0; i < lines.length; i++) {
+        const line = lines[i];
+        // Ignore logger / middleware lines inside inspector
+        if (line.includes('reduxLogger') ||
+            line.includes('inspectorReduxMiddleware') ||
+            line.includes('recordAction') ||
+            line.includes('redux.js') ||
+            line.includes('redux.cjs')) {
+            continue;
+        }
+        const parsed = (0, helpers_1.parseStackLine)(line, false);
+        if (parsed.frameType === 'app' || (!parsed.isRuntimeNoise && parsed.fileName !== 'Unknown')) {
+            bestFrame = parsed;
+            break;
+        }
+    }
+    if (!bestFrame && lines.length > 0) {
+        for (let i = 0; i < lines.length; i++) {
+            if (!lines[i].includes('reduxLogger') && !lines[i].includes('inspectorReduxMiddleware')) {
+                bestFrame = (0, helpers_1.parseStackLine)(lines[i], false);
+                break;
+            }
+        }
+    }
+    let originType = 'direct';
+    if (isSaga || (bestFrame && bestFrame.fileName?.toLowerCase().includes('saga'))) {
+        originType = 'saga';
+    }
+    else if (isThunk || (bestFrame && bestFrame.fileName?.toLowerCase().includes('thunk'))) {
+        originType = 'thunk';
+    }
+    else if (bestFrame &&
+        (bestFrame.fileName?.endsWith('.tsx') ||
+            bestFrame.functionName?.includes('onPress') ||
+            bestFrame.functionName?.includes('touchable') ||
+            bestFrame.functionName?.includes('Effect'))) {
+        originType = 'ui';
+    }
+    else if (stackLower.includes('listener') || stackLower.includes('subscribe')) {
+        originType = 'listener';
+    }
+    return {
+        originType,
+        caller: bestFrame?.copyableLocation || bestFrame?.raw || undefined,
+        callerFile: bestFrame?.fullPath || bestFrame?.fileName || undefined,
+        callerLine: bestFrame?.lineNumber ? Number(bestFrame.lineNumber) : undefined,
+        callerCol: bestFrame?.columnNumber ? Number(bestFrame.columnNumber) : undefined,
+    };
+}
+function extractSliceName(actionType, affectedSlices) {
+    if (affectedSlices && affectedSlices.length > 0) {
+        return affectedSlices[0];
+    }
+    // If Redux Toolkit action format: e.g. "users/fetchById" -> "users"
+    const match = actionType.match(/^([a-zA-Z0-9_\-]+)\//);
+    if (match && match[1] && !match[1].startsWith('@@')) {
+        return match[1];
+    }
+    return undefined;
+}
+function recordAction(action, prevState, nextState, rawStack) {
+    const stack = rawStack || new Error().stack || '';
     const type = actionTypeOf(action);
     const payload = action && typeof action === 'object' && action.payload !== undefined
         ? action.payload
@@ -84,13 +184,26 @@ function recordAction(action, prevState, nextState) {
     const now = Date.now();
     const timestamp = new Date(now).toLocaleTimeString();
     const affectedSlices = [];
+    const origin = detectActionOrigin(stack, type, action);
+    const sliceName = extractSliceName(type, affectedSlices);
     if (prevState &&
         nextState &&
         typeof prevState === 'object' &&
         typeof nextState === 'object') {
         Object.keys(nextState).forEach(key => {
             if (prevState[key] !== nextState[key]) {
-                lastActionForReducer[key] = { type, payload, timestamp, updatedAt: now };
+                lastActionForReducer[key] = {
+                    type,
+                    payload,
+                    timestamp,
+                    updatedAt: now,
+                    originType: origin.originType,
+                    callerFile: origin.callerFile,
+                    callerLine: origin.callerLine,
+                    callerCol: origin.callerCol,
+                    caller: origin.caller,
+                    stack,
+                };
                 affectedSlices.push(key);
             }
         });
@@ -104,6 +217,13 @@ function recordAction(action, prevState, nextState) {
         affectedSlices,
         prevState,
         nextState,
+        stack,
+        caller: origin.caller,
+        callerFile: origin.callerFile,
+        callerLine: origin.callerLine,
+        callerCol: origin.callerCol,
+        originType: origin.originType,
+        sliceName,
     });
     if (actionHistory.length > MAX_HISTORY) {
         actionHistory.length = MAX_HISTORY;
@@ -129,6 +249,7 @@ function recordAction(action, prevState, nextState) {
  */
 const inspectorReduxMiddleware = (storeApi) => (next) => (action) => {
     middlewareAttached = true;
+    const capturedStack = new Error().stack || '';
     // Thunks are functions — let them run; their inner plain-action dispatches
     // pass back through this same middleware, so nothing is lost.
     if (typeof action === 'function') {
@@ -139,7 +260,7 @@ const inspectorReduxMiddleware = (storeApi) => (next) => (action) => {
     const nextState = storeApi.getState();
     if (currentReduxState == null)
         currentReduxState = nextState;
-    recordAction(action, prevState, nextState);
+    recordAction(action, prevState, nextState, capturedStack);
     return result;
 };
 exports.inspectorReduxMiddleware = inspectorReduxMiddleware;
@@ -162,6 +283,7 @@ const connectReduxStore = (store) => {
     const originalDispatch = store.dispatch.bind(store);
     let inWrappedDispatch = false;
     store.dispatch = (action) => {
+        const capturedStack = new Error().stack || '';
         if (middlewareAttached || typeof action === 'function') {
             // Middleware handles recording, or it's a thunk whose inner dispatches
             // will be picked up individually.
@@ -182,7 +304,7 @@ const connectReduxStore = (store) => {
         finally {
             inWrappedDispatch = false;
         }
-        recordAction(action, prevState, store.getState());
+        recordAction(action, prevState, store.getState(), capturedStack);
         return result;
     };
     (0, exports.setReduxState)(store.getState());
@@ -206,7 +328,8 @@ const connectReduxStore = (store) => {
         }
         // Change arrived outside the wrapped dispatch — record it so the
         // timeline stays consistent, even without the original action type.
-        recordAction({ type: '@@inspector/EXTERNAL_STATE_CHANGE' }, prevState, nextState);
+        const subStack = new Error().stack || '';
+        recordAction({ type: '@@inspector/EXTERNAL_STATE_CHANGE' }, prevState, nextState, subStack);
     });
 };
 exports.connectReduxStore = connectReduxStore;

package/dist/commonjs/helpers/index.d.ts

@@ -1,6 +1,7 @@
 import { NetworkLog, RouteInfo, DiffResult, JsonContent, StackFrameType } from '../types';
 export declare const getDomainColor: (domain: string) => string;
 export declare const formatDateTime: (timestamp: number) => string;
+export declare const formatTimestamp: (timestamp: number) => string;
 export declare const getStatusColor: (status: number | null) => string;
 export declare const getDurationColor: (duration: number | null) => string;
 export declare const getSize: (data: unknown) => string;
@@ -44,6 +45,7 @@ export interface ParsedStackFrame {
     frameType: StackFrameType | 'app' | 'dependency' | 'runtime' | 'native';
     isUserCode: boolean;
     isRuntimeNoise: boolean;
+    rawFilePath?: string;
     lineNumber?: string;
     columnNumber?: string;
     isOrigin?: boolean;
@@ -51,6 +53,8 @@ export interface ParsedStackFrame {
 }
 /** Parses a stack trace line to extract function name, file name, extension (.tsx/.jsx/.ts), line, and column numbers */
 export declare const parseStackLine: (rawLine: string, isOrigin?: boolean) => ParsedStackFrame;
+/** Opens a file and line number directly in VS Code / system editor */
+export declare const openInVSCode: (filePath: string, lineNumber?: string | number, columnNumber?: string | number) => void;
 export declare const ANALYTICS_EVENT_PALETTE: string[];
 export declare const getEventColor: (name: string) => string;
 export { getEventCategory, registerGAPlugin, type GAEventCategory, type GAPlugin, } from './gaAnalyticsRegistry';

package/dist/commonjs/helpers/index.js

@@ -1,7 +1,12 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getRuntimeDiagnostics = exports.getCategoryColors = exports.registerGAPlugin = exports.getEventCategory = exports.getEventColor = exports.ANALYTICS_EVENT_PALETTE = exports.parseStackLine = exports.getJsonPreviewText = exports.getJsonContent = exports.formatGap = exports.formatTime = exports.formatTimeShort = exports.handleOpenExternalLink = exports.getAppName = exports.getBundleIdentifier = exports.formatDateTimeToAnalytics = exports.isAllValuesEmpty = exports.getLocalizedFilePathWithSlash = exports.getLocalizedFilePath = exports.formatDisplayUrl = exports.getDiff = exports.flattenObject = exports.getNavigationInfo = exports.escapeRegex = exports.deduplicateLogs = exports.getFetchCommand = exports.getCurlCommand = exports.getBaseUrl = exports.getPath = exports.copyToClipboard = exports.getSize = exports.getDurationColor = exports.getStatusColor = exports.formatDateTime = exports.getDomainColor = void 0;
+exports.getRuntimeDiagnostics = exports.getCategoryColors = exports.registerGAPlugin = exports.getEventCategory = exports.getEventColor = exports.ANALYTICS_EVENT_PALETTE = exports.openInVSCode = exports.parseStackLine = exports.getJsonPreviewText = exports.getJsonContent = exports.formatGap = exports.formatTime = exports.formatTimeShort = exports.handleOpenExternalLink = exports.getAppName = exports.getBundleIdentifier = exports.formatDateTimeToAnalytics = exports.isAllValuesEmpty = exports.getLocalizedFilePathWithSlash = exports.getLocalizedFilePath = exports.formatDisplayUrl = exports.getDiff = exports.flattenObject = exports.getNavigationInfo = exports.escapeRegex = exports.deduplicateLogs = exports.getFetchCommand = exports.getCurlCommand = exports.getBaseUrl = exports.getPath = exports.copyToClipboard = exports.getSize = exports.getDurationColor = exports.getStatusColor = exports.formatTimestamp = exports.formatDateTime = exports.getDomainColor = void 0;
 const react_native_1 = require("react-native");
+const clipboard_1 = __importDefault(require("@react-native-clipboard/clipboard"));
+const toast_1 = require("./toast");
 // Stylesheet
 const AppColors_1 = require("../styles/AppColors");
 // Constants
@@ -28,6 +33,20 @@ const formatDateTime = (timestamp) => {
     return `${day}/${month}/${year}  ${hours}:${minutes}:${seconds}`;
 };
 exports.formatDateTime = formatDateTime;
+const formatTimestamp = (timestamp) => {
+    try {
+        const date = new Date(timestamp);
+        const hours = date.getHours().toString().padStart(2, '0');
+        const minutes = date.getMinutes().toString().padStart(2, '0');
+        const seconds = date.getSeconds().toString().padStart(2, '0');
+        const ms = date.getMilliseconds().toString().padStart(3, '0');
+        return `${hours}:${minutes}:${seconds}.${ms}`;
+    }
+    catch {
+        return '—';
+    }
+};
+exports.formatTimestamp = formatTimestamp;
 const getStatusColor = (status) => {
     if (!status || status === 0)
         return AppColors_1.AppColors.errorColor;
@@ -60,104 +79,43 @@ const getSize = (data) => {
     }
 };
 exports.getSize = getSize;
-// Safely detect and load clipboard natively without static require() calls that Metro fails on
-const getClipboardModule = () => {
-    // 1. Check our built-in native module (NetworkInspectorModule)
-    try {
-        const tmReg = react_native_1.TurboModuleRegistry || globalThis.__turboModuleProxy;
-        const inspectorMod = react_native_1.NativeModules?.NetworkInspectorModule ||
-            (tmReg?.get ? tmReg.get('NetworkInspectorModule') : null);
-        if (inspectorMod && typeof inspectorMod.copyToClipboard === 'function') {
-            return {
-                setString: (str) => inspectorMod.copyToClipboard(str),
-                setStringAsync: (str) => inspectorMod.copyToClipboard(str),
-            };
-        }
+const copyToClipboard = (value, label) => {
+    const resolved = typeof value === 'function' ? value() : value;
+    let textToCopy = '';
+    if (typeof resolved === 'string') {
+        textToCopy = resolved;
     }
-    catch { }
-    // 2. Check TurboModuleRegistry (TurboModules / New Architecture)
-    try {
-        const tmReg = react_native_1.TurboModuleRegistry || globalThis.__turboModuleProxy;
-        if (tmReg?.get) {
-            const tm = tmReg.get('RNCClipboard') ||
-                tmReg.get('NativeClipboard') ||
-                tmReg.get('ExpoClipboard');
-            if (tm &&
-                (typeof tm.setString === 'function' ||
-                    typeof tm.setStringAsync === 'function')) {
-                return tm;
-            }
+    else {
+        try {
+            textToCopy = JSON.stringify(resolved, null, 2);
+        }
+        catch {
+            textToCopy = String(resolved);
         }
     }
-    catch { }
-    // 3. Check legacy NativeModules table (Bridge / Old Architecture)
+    // Use @react-native-clipboard/clipboard npm package
     try {
-        if (react_native_1.NativeModules?.RNCClipboard &&
-            typeof react_native_1.NativeModules.RNCClipboard.setString === 'function') {
-            return react_native_1.NativeModules.RNCClipboard;
-        }
-        if (react_native_1.NativeModules?.ExpoClipboard &&
-            typeof react_native_1.NativeModules.ExpoClipboard.setStringAsync === 'function') {
-            return react_native_1.NativeModules.ExpoClipboard;
+        if (typeof clipboard_1.default?.setString === 'function') {
+            clipboard_1.default.setString(textToCopy);
         }
-        if (react_native_1.NativeModules?.Clipboard &&
-            typeof react_native_1.NativeModules.Clipboard.setString === 'function') {
-            return react_native_1.NativeModules.Clipboard;
+        else if (typeof clipboard_1.default?.default?.setString === 'function') {
+            clipboard_1.default.default.setString(textToCopy);
         }
     }
-    catch { }
-    // 4. Check legacy React Native core Clipboard
-    try {
-        if (react_native_1.Clipboard && typeof react_native_1.Clipboard.setString === 'function') {
-            return react_native_1.Clipboard;
+    catch (err) {
+        if (__DEV__) {
+            console.warn('[NetworkInspector] Clipboard.setString failed:', err);
         }
     }
-    catch { }
-    return null;
-};
-const copyToClipboard = (value, label) => {
-    const resolved = typeof value === 'function' ? value() : value;
-    const text = typeof resolved === 'string' ? resolved : JSON.stringify(resolved, null, 2);
-    const textToCopy = text ?? '';
-    let copied = false;
+    // Trigger floating in-app bottom toast notification
     try {
-        const cb = getClipboardModule();
-        if (cb) {
-            if (typeof cb.setStringAsync === 'function') {
-                cb.setStringAsync(textToCopy);
-                copied = true;
-            }
-            else if (typeof cb.setString === 'function') {
-                cb.setString(textToCopy);
-                copied = true;
-            }
-        }
+        (0, toast_1.showToast)(label ? `${label} copied to clipboard` : 'Copied to clipboard');
     }
     catch { }
-    // Built-in native module direct invocation
-    if (!copied) {
-        try {
-            const inspectorMod = react_native_1.NativeModules?.NetworkInspectorModule;
-            if (inspectorMod && typeof inspectorMod.copyToClipboard === 'function') {
-                inspectorMod.copyToClipboard(textToCopy);
-                copied = true;
-            }
-        }
-        catch { }
-    }
-    if (!copied) {
-        try {
-            if (typeof navigator !== 'undefined' && navigator?.clipboard?.writeText) {
-                navigator.clipboard.writeText(textToCopy);
-                copied = true;
-            }
-        }
-        catch { }
-    }
-    // Visual toast feedback on Android if ToastAndroid exists
+    // Native Android Toast fallback
     try {
         if (react_native_1.Platform.OS === 'android' && react_native_1.ToastAndroid?.show) {
-            react_native_1.ToastAndroid.show(`${label} copied`, react_native_1.ToastAndroid.SHORT);
+            react_native_1.ToastAndroid.show(label ? `${label} copied to clipboard` : 'Copied to clipboard', react_native_1.ToastAndroid.SHORT);
         }
     }
     catch { }
@@ -566,11 +524,16 @@ const parseStackLine = (rawLine, isOrigin = false) => {
         (functionName === 'next' && isNative);
     const isDependency = cleanPath.includes('node_modules') ||
         cleanPath.includes('react-native/Libraries') ||
-        (cleanPath.includes('react-native-inapp-inspector') && !cleanPath.includes('/example/'));
+        (cleanPath.includes('react-native-inapp-inspector') &&
+            !cleanPath.includes('/example/'));
     const isUserCode = !isNative &&
         !isInternalBytecode &&
         !isDependency &&
-        (fileExt === 'tsx' || fileExt === 'jsx' || fileExt === 'ts' || fileExt === 'js' || !fileName.includes('.bundle'));
+        (fileExt === 'tsx' ||
+            fileExt === 'jsx' ||
+            fileExt === 'ts' ||
+            fileExt === 'js' ||
+            !fileName.includes('.bundle'));
     const frameType = isUserCode
         ? 'app'
         : isDependency
@@ -578,7 +541,10 @@ const parseStackLine = (rawLine, isOrigin = false) => {
             : isNative
                 ? 'native'
                 : 'runtime';
-    const isRuntimeNoise = isInternalBytecode || isNative || functionName === 'asyncGeneratorStep' || functionName === '_next';
+    const isRuntimeNoise = isInternalBytecode ||
+        isNative ||
+        functionName === 'asyncGeneratorStep' ||
+        functionName === '_next';
     // Format clean relative project path
     let relativePath = cleanPath;
     if (relativePath.includes('/example/')) {
@@ -598,6 +564,7 @@ const parseStackLine = (rawLine, isOrigin = false) => {
         functionName,
         fileName,
         fullPath: relativePath,
+        rawFilePath: fullPath,
         fileExt,
         frameType,
         isUserCode,
@@ -609,6 +576,47 @@ const parseStackLine = (rawLine, isOrigin = false) => {
     };
 };
 exports.parseStackLine = parseStackLine;
+/** Opens a file and line number directly in VS Code / system editor */
+const openInVSCode = (filePath, lineNumber, columnNumber) => {
+    const numLine = lineNumber ? Number(lineNumber) : 1;
+    const numCol = columnNumber ? Number(columnNumber) : 1;
+    const line = lineNumber ? `:${lineNumber}` : '';
+    const col = columnNumber ? `:${columnNumber}` : '';
+    const cleanPath = filePath.replace(/^file:\/\//, '');
+    // 1. Notify Metro dev server on host to launch editor directly on local system
+    const metroHosts = [
+        'http://localhost:8081',
+        'http://127.0.0.1:8081',
+        'http://10.0.2.2:8081',
+    ];
+    metroHosts.forEach(host => {
+        try {
+            fetch(`${host}/open-stack-frame`, {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({
+                    file: cleanPath,
+                    lineNumber: numLine,
+                    column: numCol,
+                }),
+            }).catch(() => { });
+        }
+        catch { }
+    });
+    // 2. Also invoke native URL scheme handlers
+    const vscodeUrl = `vscode://file/${cleanPath.replace(/^\/+/, '')}${line}${col}`;
+    const cursorUrl = `cursor://file/${cleanPath.replace(/^\/+/, '')}${line}${col}`;
+    const vscodeInsidersUrl = `vscode-insiders://file/${cleanPath.replace(/^\/+/, '')}${line}${col}`;
+    react_native_1.Linking.openURL(vscodeUrl).catch(() => {
+        react_native_1.Linking.openURL(cursorUrl).catch(() => {
+            react_native_1.Linking.openURL(vscodeInsidersUrl).catch(() => {
+                // Fallback: Copy to clipboard so user can jump immediately
+                (0, exports.copyToClipboard)(`${cleanPath}${line}${col}`, 'Location');
+            });
+        });
+    });
+};
+exports.openInVSCode = openInVSCode;
 // ─── Analytics Helpers ────────────────────────────────────────────────────────
 exports.ANALYTICS_EVENT_PALETTE = [
     AppColors_1.AppColors.googleBlue,
@@ -667,7 +675,11 @@ exports.getCategoryColors = getCategoryColors;
 const getRuntimeDiagnostics = () => {
     const isHermes = typeof global.HermesInternal !== 'undefined';
     const isV8 = typeof global._v8runtime !== 'undefined';
-    const engineType = isHermes ? 'hermes' : isV8 ? 'v8' : 'jsc';
+    const engineType = isHermes
+        ? 'hermes'
+        : isV8
+            ? 'v8'
+            : 'jsc';
     const isFabric = typeof global.nativeFabricUIManager !== 'undefined' ||
         Boolean(global.__turboModuleProxy);
     const archType = isFabric ? 'fabric' : 'paper';
@@ -677,11 +689,14 @@ const getRuntimeDiagnostics = () => {
         const hermesStats = global.HermesInternal?.getInstrumentedStats?.();
         if (hermesStats?.js_heap_size) {
             usedHeapMb = Number((hermesStats.js_heap_size / (1024 * 1024)).toFixed(1));
-            totalAllocMb = Number(((hermesStats.js_allocated_bytes || hermesStats.js_heap_size * 1.6) / (1024 * 1024)).toFixed(1));
+            totalAllocMb = Number(((hermesStats.js_allocated_bytes || hermesStats.js_heap_size * 1.6) /
+                (1024 * 1024)).toFixed(1));
         }
         else if (global.performance?.memory?.usedJSHeapSize) {
-            usedHeapMb = Number((global.performance.memory.usedJSHeapSize / (1024 * 1024)).toFixed(1));
-            totalAllocMb = Number((global.performance.memory.totalJSHeapSize / (1024 * 1024)).toFixed(1));
+            usedHeapMb = Number((global.performance.memory.usedJSHeapSize /
+                (1024 * 1024)).toFixed(1));
+            totalAllocMb = Number((global.performance.memory.totalJSHeapSize /
+                (1024 * 1024)).toFixed(1));
         }
     }
     catch { }

package/dist/commonjs/helpers/toast.d.ts

@@ -0,0 +1,4 @@
+type ToastListener = (message: string) => void;
+export declare const showToast: (message: string) => void;
+export declare const subscribeToast: (listener: ToastListener) => () => void;
+export {};

package/dist/commonjs/helpers/toast.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.subscribeToast = exports.showToast = void 0;
+const listeners = new Set();
+const showToast = (message) => {
+    listeners.forEach(fn => {
+        try {
+            fn(message);
+        }
+        catch { }
+    });
+};
+exports.showToast = showToast;
+const subscribeToast = (listener) => {
+    listeners.add(listener);
+    return () => {
+        listeners.delete(listener);
+    };
+};
+exports.subscribeToast = subscribeToast;

package/dist/commonjs/i18n/locales/en.json

@@ -15,7 +15,10 @@
         "expandAll": "Expand All",
         "viewOnNpm": "View on NPM",
         "later": "Later",
-        "source": "SOURCE"
+        "source": "SOURCE",
+        "open": "Open",
+        "openInBrowser": "Open in Browser",
+        "openInBrowserPrompt": "Are you sure you want to open this URL in your external browser?"
     },
     "header": {
         "updateAvailableTitle": "Update Available",
@@ -279,7 +282,19 @@
         "timeNow": "NOW",
         "selectedBucket": "Bucket: {{time}} ({{count}} events)",
         "totalRevenue": "Revenue",
-        "activeDistribution": "Category Split"
+        "activeDistribution": "Category Split",
+        "allCategory": "All",
+        "screensCategory": "Screens",
+        "overviewTab": "Overview",
+        "jsonTreeTab": "JSON Tree",
+        "rawPayloadTab": "Raw Payload",
+        "sessionContext": "Session Context",
+        "userPropertiesSnapshot": "User Properties Snapshot",
+        "parameterKeys": "Parameters ({{count}})",
+        "searchParameters": "Search parameters...",
+        "noParamsFound": "No parameters match your search",
+        "sourceFirebase": "FIREBASE GA4",
+        "sourceCustom": "CUSTOM / MANUAL"
     },
     "redux": {
         "title": "Redux",
@@ -305,7 +320,38 @@
         "connectionStatus": "Connected",
         "connectionStatusNone": "Not connected",
         "autoRefresh": "Auto-refresh",
-        "paused": "Paused"
+        "paused": "Paused",
+        "liveState": "Live State",
+        "timeline": "Timeline",
+        "persisted": "Persisted",
+        "storage": "Storage",
+        "metadata": "Metadata",
+        "inMemory": "In-Memory",
+        "slice": "SLICE",
+        "rootKeys": "Root Keys",
+        "size": "Size",
+        "actions": "actions",
+        "keys": "Keys",
+        "last": "Last",
+        "live": "Live",
+        "loading": "Loading",
+        "error": "Error",
+        "empty": "Empty",
+        "payload": "Payload",
+        "actionPayload": "Action Payload:",
+        "stateChangesDiff": "State Changes (Diff):",
+        "tapToInspectAction": "Tap to inspect action payload & diff changes",
+        "noDispatchedActions": "No dispatched actions recorded for this slice yet.",
+        "sliceJson": "Slice JSON",
+        "originSaga": "SAGA",
+        "originThunk": "THUNK",
+        "originUi": "UI",
+        "originDirect": "DIRECT",
+        "originListener": "LISTENER",
+        "triggeredFrom": "Triggered From:",
+        "openInEditor": "Open in Editor",
+        "callStack": "Call Stack Trace",
+        "sliceOrigin": "Slice / Origin"
     },
     "performance": {
         "title": "Performance",

package/dist/commonjs/styles/AppColors.d.ts

@@ -124,6 +124,9 @@ declare const LightColors: {
     emerald700: string;
     pink100: string;
     sky100: string;
+    teal100: string;
+    teal700: string;
+    purple700: string;
     indigo50: string;
     gray100: string;
     gray200: string;
@@ -279,6 +282,9 @@ export declare const getThemeColors: (isDark: boolean) => {
     emerald700: string;
     pink100: string;
     sky100: string;
+    teal100: string;
+    teal700: string;
+    purple700: string;
     indigo50: string;
     gray100: string;
     gray200: string;

package/dist/commonjs/styles/AppColors.js

@@ -133,6 +133,9 @@ const LightColors = {
     emerald700: '#047857',
     pink100: '#FCE7F3',
     sky100: '#E0F2FE',
+    teal100: '#CCFBF1',
+    teal700: '#0F766E',
+    purple700: '#6D28D9',
     indigo50: '#EEF2FF',
     gray100: '#F3F4F6',
     gray200: '#E5E7EB',
@@ -303,6 +306,9 @@ const DarkColors = {
     emerald700: '#34D399',
     pink100: '#341626',
     sky100: '#0C2744',
+    teal100: '#134E4A',
+    teal700: '#2DD4BF',
+    purple700: '#8B5CF6',
     indigo50: '#1E1B3A',
     gray100: '#2A2438',
     gray200: '#362C4E',