react-native-inapp-inspector 2.3.7 → 2.3.9

package/dist/commonjs/components/Inspector/NpmUpdateToast.js

@@ -128,7 +128,7 @@ const NpmUpdateToast = () => {
         react_native_1.Linking.openURL('https://www.npmjs.com/package/react-native-inapp-inspector').catch(() => { });
         handleDismiss();
     };
-    if (!showUpdateToast || !visible || !updateAvailable || !latestNpmVersion)
+    if (typeof __DEV__ === 'undefined' || !__DEV__ || !showUpdateToast || !visible || !updateAvailable || !latestNpmVersion)
         return null;
     const progressWidth = progressAnim.interpolate({
         inputRange: [0, 1],

package/dist/commonjs/components/Inspector/PerformanceTab.js

@@ -43,6 +43,7 @@ const TouchableScale_1 = __importDefault(require("../TouchableScale"));
 const CopyButton_1 = __importDefault(require("../CopyButton"));
 const HighlightText_1 = __importDefault(require("../HighlightText"));
 const EndOfListFooter_1 = __importDefault(require("../EndOfListFooter"));
+const FeatureUnderDevNotice_1 = __importDefault(require("./FeatureUnderDevNotice"));
 const AppColors_1 = require("../../styles/AppColors");
 const AppFonts_1 = require("../../styles/AppFonts");
 const i18n_1 = require("../../i18n");
@@ -394,6 +395,8 @@ const PerformanceTab = react_1.default.memo(() => {
         </TouchableScale_1.default>
       </react_native_1.View>
 
+      <FeatureUnderDevNotice_1.default featureName="Performance & FPS Profiler"/>
+
       
       <react_native_1.View style={perfStyles.categoryScrollWrapper}>
         <react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={false} style={perfStyles.categoryScrollView} contentContainerStyle={perfStyles.categoryScroll}>

package/dist/commonjs/components/Inspector/ReduxTab.js

@@ -98,6 +98,7 @@ const getOriginBadge = (originType) => {
 const ReduxTab = react_1.default.memo(() => {
     const { t } = (0, i18n_1.useTranslation)();
     const { reduxState, reduxLastActionMap, reduxSearch, setReduxSearch, setSelectedReduxSlice, } = (0, InspectorContext_1.useInspector)();
+    const listRef = (0, react_1.useRef)(null);
     const [sortMode, setSortMode] = (0, react_1.useState)('latest');
     const [isReduxPaused, setIsReduxPaused] = (0, react_1.useState)(!(0, reduxLogger_1.getReduxAutoRefresh)());
     const handleTogglePause = (0, react_1.useCallback)(() => {
@@ -491,10 +492,32 @@ const ReduxTab = react_1.default.memo(() => {
       </react_native_1.View>
 
       
-      <react_native_1.FlatList data={filteredSlices} keyExtractor={item => item.id} renderItem={renderSliceItem} initialNumToRender={12} maxToRenderPerBatch={8} windowSize={5} removeClippedSubviews={true} renderToHardwareTextureAndroid={true} ListEmptyComponent={<EmptyState_1.default isSearch={reduxSearch.length > 0}/>} ListFooterComponent={filteredSlices.length > 0 ? (<EndOfListFooter_1.default count={filteredSlices.length} label="slices"/>) : null} contentContainerStyle={[
+      <react_native_1.FlatList ref={listRef} data={filteredSlices} keyExtractor={item => item.id} renderItem={renderSliceItem} initialNumToRender={12} maxToRenderPerBatch={8} windowSize={5} removeClippedSubviews={true} renderToHardwareTextureAndroid={true} ListEmptyComponent={<EmptyState_1.default isSearch={reduxSearch.length > 0}/>} ListFooterComponent={filteredSlices.length > 0 ? (<EndOfListFooter_1.default count={filteredSlices.length} label="slices"/>) : null} contentContainerStyle={[
             reduxTabStyles.listContent,
             filteredSlices.length === 0 && { flexGrow: 1 },
         ]} keyboardShouldPersistTaps="handled"/>
+
+      <TouchableScale_1.default onPress={() => {
+            try {
+                listRef.current?.scrollToOffset({
+                    offset: 0,
+                    animated: true,
+                });
+            }
+            catch {
+                try {
+                    listRef.current?.scrollToIndex({
+                        index: 0,
+                        animated: true,
+                    });
+                }
+                catch { }
+            }
+        }} hitSlop={12} style={styles_1.default.scrollTopBtn}>
+        <react_native_1.View style={{ transform: [{ rotate: '180deg' }] }}>
+          <NetworkIcons_1.ChevronIcon color={AppColors_1.AppColors.white} size={18}/>
+        </react_native_1.View>
+      </TouchableScale_1.default>
     </react_native_1.View>);
 });
 const reduxTabStyles = react_native_1.StyleSheet.create({

package/dist/commonjs/components/Inspector/SettingsPanel.js

@@ -313,11 +313,12 @@ const SettingsPanel = () => {
         }}>
       <react_native_1.ScrollView style={{ flex: 1 }} contentContainerStyle={{ padding: 16, paddingBottom: 100, gap: 14 }} showsVerticalScrollIndicator={false}>
         
+        
         <react_native_1.View style={{
-            flexDirection: 'row',
             backgroundColor: AppColors_1.AppColors.primaryLight,
-            borderRadius: 12,
-            padding: 4,
+            borderRadius: 13,
+            paddingVertical: 4,
+            paddingHorizontal: 4,
             borderWidth: 1,
             borderColor: AppColors_1.AppColors.grayBorderSecondary,
             shadowColor: AppColors_1.AppColors.black,
@@ -325,95 +326,79 @@ const SettingsPanel = () => {
             shadowRadius: 4,
             shadowOffset: { width: 0, height: 2 },
         }}>
-          <TouchableScale_1.default accessible={true} accessibilityRole="tab" accessibilityLabel={t('settings.modulesAndTools')} accessibilityState={{ selected: settingsActiveSubTab === 'module' }} onPress={() => {
-            (0, InspectorContext_1.animateNextLayout)();
-            setSettingsActiveSubTab('module');
-        }} style={{
-            flex: 1,
-            paddingVertical: 9,
+          <react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={false} contentContainerStyle={{
             flexDirection: 'row',
             alignItems: 'center',
-            justifyContent: 'center',
             gap: 6,
-            borderRadius: 9,
-            backgroundColor: settingsActiveSubTab === 'module'
-                ? AppColors_1.AppColors.purple
-                : 'transparent',
-        }}>
-            <NetworkIcons_1.LayersIcon color={settingsActiveSubTab === 'module'
-            ? AppColors_1.AppColors.white
-            : AppColors_1.AppColors.grayText} size={13}/>
-            <react_native_1.Text style={{
-            fontFamily: AppFonts_1.AppFonts.interBold,
-            fontSize: 12.5,
-            lineHeight: 16,
-            color: settingsActiveSubTab === 'module'
-                ? AppColors_1.AppColors.white
-                : AppColors_1.AppColors.grayText,
-        }}>
-              {t('settings.modulesAndTools')}
-            </react_native_1.Text>
-          </TouchableScale_1.default>
-
-          <TouchableScale_1.default accessible={true} accessibilityRole="tab" accessibilityLabel={t('settings.uiPreferences')} accessibilityState={{ selected: settingsActiveSubTab === 'ui' }} onPress={() => {
-            (0, InspectorContext_1.animateNextLayout)();
-            setSettingsActiveSubTab('ui');
-        }} style={{
-            flex: 1,
-            paddingVertical: 9,
-            flexDirection: 'row',
-            alignItems: 'center',
-            justifyContent: 'center',
-            gap: 5,
-            borderRadius: 9,
-            backgroundColor: settingsActiveSubTab === 'ui'
-                ? AppColors_1.AppColors.purple
-                : 'transparent',
-        }}>
-            <NetworkIcons_1.ScreenIcon color={settingsActiveSubTab === 'ui'
-            ? AppColors_1.AppColors.white
-            : AppColors_1.AppColors.grayText} size={13}/>
-            <react_native_1.Text numberOfLines={1} style={{
-            fontFamily: AppFonts_1.AppFonts.interBold,
-            fontSize: 12,
-            lineHeight: 16,
-            color: settingsActiveSubTab === 'ui'
-                ? AppColors_1.AppColors.white
-                : AppColors_1.AppColors.grayText,
-        }}>
-              {t('settings.uiPreferences')}
-            </react_native_1.Text>
-          </TouchableScale_1.default>
-
-          <TouchableScale_1.default accessible={true} accessibilityRole="tab" accessibilityLabel={t('settings.ramLimits')} accessibilityState={{ selected: settingsActiveSubTab === 'limits' }} onPress={() => {
-            (0, InspectorContext_1.animateNextLayout)();
-            setSettingsActiveSubTab('limits');
-        }} style={{
-            flex: 1,
-            paddingVertical: 9,
-            flexDirection: 'row',
-            alignItems: 'center',
-            justifyContent: 'center',
-            gap: 5,
-            borderRadius: 9,
-            backgroundColor: settingsActiveSubTab === 'limits'
-                ? AppColors_1.AppColors.purple
-                : 'transparent',
-        }}>
-            <NetworkIcons_1.BrainIcon color={settingsActiveSubTab === 'limits'
-            ? AppColors_1.AppColors.white
-            : AppColors_1.AppColors.grayText} size={13}/>
-            <react_native_1.Text numberOfLines={1} style={{
-            fontFamily: AppFonts_1.AppFonts.interBold,
-            fontSize: 12,
-            lineHeight: 16,
-            color: settingsActiveSubTab === 'limits'
-                ? AppColors_1.AppColors.white
-                : AppColors_1.AppColors.grayText,
+            paddingHorizontal: 2,
         }}>
-              {t('settings.ramLimits')}
-            </react_native_1.Text>
-          </TouchableScale_1.default>
+            {[
+            {
+                key: 'module',
+                label: t('settings.modulesAndTools', 'Modules & Tools'),
+                Icon: NetworkIcons_1.LayersIcon,
+                badge: `${allModules.filter(m => stagedTabVisibility?.[m.key] || m.key === 'apis').length}/${allModules.length}`,
+            },
+            {
+                key: 'ui',
+                label: t('settings.uiPreferences', 'UI Preferences'),
+                Icon: NetworkIcons_1.ScreenIcon,
+            },
+            {
+                key: 'limits',
+                label: t('settings.ramLimits', 'RAM & Limits'),
+                Icon: NetworkIcons_1.BrainIcon,
+            },
+        ].map(tab => {
+            const isActive = settingsActiveSubTab === tab.key;
+            const IconComp = tab.Icon;
+            return (<TouchableScale_1.default key={tab.key} accessible={true} accessibilityRole="tab" accessibilityLabel={tab.label} accessibilityState={{ selected: isActive }} onPress={() => {
+                    (0, InspectorContext_1.animateNextLayout)();
+                    setSettingsActiveSubTab(tab.key);
+                }} style={{
+                    paddingVertical: 8,
+                    paddingHorizontal: 14,
+                    flexDirection: 'row',
+                    alignItems: 'center',
+                    justifyContent: 'center',
+                    gap: 6,
+                    borderRadius: 9,
+                    backgroundColor: isActive
+                        ? AppColors_1.AppColors.purple
+                        : 'transparent',
+                }}>
+                  <IconComp color={isActive ? AppColors_1.AppColors.white : AppColors_1.AppColors.grayText} size={13}/>
+                  <react_native_1.Text style={{
+                    fontFamily: AppFonts_1.AppFonts.interBold,
+                    fontSize: 12.5,
+                    lineHeight: 16,
+                    color: isActive
+                        ? AppColors_1.AppColors.white
+                        : AppColors_1.AppColors.grayText,
+                }}>
+                    {tab.label}
+                  </react_native_1.Text>
+                  {tab.badge && (<react_native_1.View style={{
+                        backgroundColor: isActive
+                            ? 'rgba(255,255,255,0.25)'
+                            : `${AppColors_1.AppColors.purple}18`,
+                        paddingHorizontal: 5.5,
+                        paddingVertical: 1,
+                        borderRadius: 10,
+                    }}>
+                      <react_native_1.Text style={{
+                        fontFamily: AppFonts_1.AppFonts.interBold,
+                        fontSize: 9.5,
+                        color: isActive
+                            ? AppColors_1.AppColors.white
+                            : AppColors_1.AppColors.purple,
+                    }}>
+                        {tab.badge}
+                      </react_native_1.Text>
+                    </react_native_1.View>)}
+                </TouchableScale_1.default>);
+        })}
+          </react_native_1.ScrollView>
         </react_native_1.View>
 
         {settingsActiveSubTab === 'module' && (<react_native_1.View style={{ gap: 12 }}>

package/dist/commonjs/components/Inspector/StorageTab.js

@@ -40,6 +40,7 @@ exports.StorageTab = void 0;
 const react_1 = __importStar(require("react"));
 const react_native_1 = require("react-native");
 const TouchableScale_1 = __importDefault(require("../TouchableScale"));
+const styles_1 = __importDefault(require("../../styles"));
 const AppColors_1 = require("../../styles/AppColors");
 const AppFonts_1 = require("../../styles/AppFonts");
 const i18n_1 = require("../../i18n");
@@ -134,6 +135,7 @@ const StorageEntryCard = react_1.default.memo(function StorageEntryCard({ entry,
 });
 exports.StorageTab = react_1.default.memo(() => {
     const { t } = (0, i18n_1.useTranslation)();
+    const listRef = (0, react_1.useRef)(null);
     const [activeDriver, setActiveDriver] = (0, react_1.useState)('asyncStorage');
     const [activeMMKVId, setActiveMMKVId] = (0, react_1.useState)('default');
     const [entries, setEntries] = (0, react_1.useState)([]);
@@ -399,19 +401,43 @@ exports.StorageTab = react_1.default.memo(() => {
       {isLoading ? (<react_native_1.View style={styles.loadingContainer}>
           <react_native_1.ActivityIndicator size="small" color={AppColors_1.AppColors.purple}/>
           <react_native_1.Text style={styles.loadingText}>Loading storage entries...</react_native_1.Text>
-        </react_native_1.View>) : (<react_native_1.FlatList data={filteredEntries} keyExtractor={item => item.key} renderItem={renderItem} initialNumToRender={10} maxToRenderPerBatch={10} windowSize={5} removeClippedSubviews={react_native_1.Platform.OS === 'android'} style={styles.scrollArea} contentContainerStyle={styles.scrollContent} showsVerticalScrollIndicator={false} ListEmptyComponent={<react_native_1.View style={styles.emptyContainer}>
-              <react_native_1.View style={styles.emptyIconWrap}>
-                <NetworkIcons_1.DatabaseIcon size={28} color={AppColors_1.AppColors.grayTextWeak}/>
-              </react_native_1.View>
-              <react_native_1.Text style={styles.emptyTitle}>
-                {search ? 'No matching keys found' : `No ${activeDriver === 'asyncStorage' ? 'AsyncStorage' : 'MMKV'} Keys`}
-              </react_native_1.Text>
-              <react_native_1.Text style={styles.emptySubtitle}>
-                {search
+        </react_native_1.View>) : (<>
+          <react_native_1.FlatList ref={listRef} data={filteredEntries} keyExtractor={item => item.key} renderItem={renderItem} initialNumToRender={10} maxToRenderPerBatch={10} windowSize={5} removeClippedSubviews={react_native_1.Platform.OS === 'android'} style={styles.scrollArea} contentContainerStyle={styles.scrollContent} showsVerticalScrollIndicator={false} ListEmptyComponent={<react_native_1.View style={styles.emptyContainer}>
+                <react_native_1.View style={styles.emptyIconWrap}>
+                  <NetworkIcons_1.DatabaseIcon size={28} color={AppColors_1.AppColors.grayTextWeak}/>
+                </react_native_1.View>
+                <react_native_1.Text style={styles.emptyTitle}>
+                  {search ? 'No matching keys found' : `No ${activeDriver === 'asyncStorage' ? 'AsyncStorage' : 'MMKV'} Keys`}
+                </react_native_1.Text>
+                <react_native_1.Text style={styles.emptySubtitle}>
+                  {search
                     ? 'Try modifying your search query'
                     : `Storage is auto-detected. Tap "+ Add" above to create your first ${activeDriver === 'asyncStorage' ? 'AsyncStorage' : 'MMKV'} key!`}
-              </react_native_1.Text>
-            </react_native_1.View>} ListFooterComponent={<react_native_1.View style={{ height: 60 }}/>}/>)}
+                </react_native_1.Text>
+              </react_native_1.View>} ListFooterComponent={<react_native_1.View style={{ height: 60 }}/>}/>
+
+          <TouchableScale_1.default onPress={() => {
+                try {
+                    listRef.current?.scrollToOffset({
+                        offset: 0,
+                        animated: true,
+                    });
+                }
+                catch {
+                    try {
+                        listRef.current?.scrollToIndex({
+                            index: 0,
+                            animated: true,
+                        });
+                    }
+                    catch { }
+                }
+            }} hitSlop={12} style={styles_1.default.scrollTopBtn}>
+            <react_native_1.View style={{ transform: [{ rotate: '180deg' }] }}>
+              <NetworkIcons_1.ChevronIcon color={AppColors_1.AppColors.white} size={18}/>
+            </react_native_1.View>
+          </TouchableScale_1.default>
+        </>)}
 
       
       <react_native_1.Modal visible={modalVisible} transparent animationType="fade" onRequestClose={() => setModalVisible(false)}>

package/dist/commonjs/components/Inspector/UpdateAvailableModal.js

@@ -68,6 +68,8 @@ const UpdateAvailableModal = ({ visible, latestVersion, onClose, }) => {
     const fadeAnim = (0, react_1.useState)(new react_native_1.Animated.Value(0))[0];
     const scaleAnim = (0, react_1.useState)(new react_native_1.Animated.Value(0.92))[0];
     const installCommand = `npm install react-native-inapp-inspector@latest`;
+    if (typeof __DEV__ === 'undefined' || !__DEV__)
+        return null;
     (0, react_1.useEffect)(() => {
         if (visible) {
             setCopied(false);

package/dist/commonjs/components/LogCard.js

@@ -348,9 +348,39 @@ const LogCard = react_1.default.memo(function LogCard({ item, onPress, timelineM
 
         
         <react_native_1.View style={styles_1.default.cardFooterRow}>
-          <react_native_1.View style={styles_1.default.cardDateRow}>
-            <NetworkIcons_1.CalendarIcon color={AppColors_1.AppColors.grayTextWeak} size={10}/>
-            <react_native_1.Text style={styles_1.default.cardDateText}>{triggeredAt}</react_native_1.Text>
+          <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 6, flexShrink: 1, minWidth: 0 }}>
+            <react_native_1.View style={styles_1.default.cardDateRow}>
+              <NetworkIcons_1.CalendarIcon color={AppColors_1.AppColors.grayTextWeak} size={10}/>
+              <react_native_1.Text style={styles_1.default.cardDateText}>{triggeredAt}</react_native_1.Text>
+            </react_native_1.View>
+
+            {item.caller && item.caller !== 'Unknown' && (<react_native_1.View style={[
+                styles_1.default.chip,
+                {
+                    flexDirection: 'row',
+                    alignItems: 'center',
+                    gap: 3,
+                    backgroundColor: `${AppColors_1.AppColors.skyBlue}14`,
+                    borderColor: `${AppColors_1.AppColors.skyBlue}30`,
+                    paddingHorizontal: 5,
+                    paddingVertical: 1,
+                    borderRadius: 4,
+                    flexShrink: 1,
+                    maxWidth: 160,
+                },
+            ]}>
+                <NetworkIcons_1.PinIcon color={AppColors_1.AppColors.skyBlue} size={8.5}/>
+                <react_native_1.Text style={[
+                styles_1.default.chipText,
+                {
+                    color: AppColors_1.AppColors.skyBlue,
+                    fontSize: 8.5,
+                    fontFamily: AppFonts_1.AppFonts.interMedium,
+                },
+            ]} numberOfLines={1} ellipsizeMode="middle">
+                  {item.caller}
+                </react_native_1.Text>
+              </react_native_1.View>)}
           </react_native_1.View>
 
           <react_native_1.View style={styles_1.default.cardFooterRight}>

package/dist/commonjs/constants/version.d.ts

@@ -1 +1 @@
-export declare const LIB_VERSION = "2.3.7";
+export declare const LIB_VERSION = "2.3.9";

package/dist/commonjs/constants/version.js

@@ -1,4 +1,4 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.LIB_VERSION = void 0;
-exports.LIB_VERSION = '2.3.7';
+exports.LIB_VERSION = '2.3.9';

package/dist/commonjs/customHooks/networkLogger.js

@@ -31,6 +31,8 @@ const IGNORED_URL_PATTERNS = [
     /\/status(?:\?|$)/i,
     /127\.0\.0\.1:(?:8081|8082|8083|19000|19001|19002|3000|8000)/i,
     /localhost:(?:8081|8082|8083|19000|19001|19002|3000|8000)\/index\.bundle/i,
+    /google-analytics\.com\/mp\/collect/i,
+    /analytics\.google\.com/i,
 ];
 function shouldIgnoreUrl(url) {
     if (!url)

package/dist/commonjs/helpers/telemetry.js

@@ -83,6 +83,36 @@ async function getOrCreateClientId() {
         return `${Math.floor(100000000 + Math.random() * 900000000)}.${Math.floor(1000000000 + Math.random() * 9000000000)}`;
     }
 }
+function isDeviceEmulator() {
+    try {
+        if (react_native_1.Platform.OS === 'android') {
+            const c = react_native_1.Platform.constants || {};
+            const model = String(c.Model || '').toLowerCase();
+            const brand = String(c.Brand || '').toLowerCase();
+            const fingerprint = String(c.Fingerprint || '').toLowerCase();
+            const hardware = String(c.Hardware || '').toLowerCase();
+            const manufacturer = String(c.Manufacturer || '').toLowerCase();
+            return (model.includes('emulator') ||
+                model.includes('sdk') ||
+                model.includes('google_sdk') ||
+                model.includes('vbox') ||
+                brand.includes('generic') ||
+                fingerprint.startsWith('generic') ||
+                hardware.includes('goldfish') ||
+                hardware.includes('ranchu') ||
+                manufacturer.includes('genymotion'));
+        }
+        if (react_native_1.Platform.OS === 'ios') {
+            const c = react_native_1.Platform.constants || {};
+            const model = String(c.Model || '').toLowerCase();
+            return model.includes('simulator') || Boolean(c.isSimulator);
+        }
+    }
+    catch {
+        return false;
+    }
+    return false;
+}
 function getSystemMetadata(environment) {
     const rnConstants = react_native_1.Platform.constants;
     const rnVersion = rnConstants?.reactNativeVersion
@@ -91,6 +121,7 @@ function getSystemMetadata(environment) {
     const isHermes = Boolean(typeof global.HermesInternal === 'object' && global.HermesInternal !== null);
     const isFabric = Boolean(global?.nativeFabricUIManager !== undefined);
     const isDev = Boolean(typeof __DEV__ !== 'undefined' && __DEV__);
+    const isEmulator = isDeviceEmulator();
     return {
         lib_version: version_1.LIB_VERSION,
         platform: react_native_1.Platform.OS,
@@ -99,6 +130,9 @@ function getSystemMetadata(environment) {
         is_hermes: isHermes,
         is_fabric: isFabric,
         is_dev: isDev,
+        is_emulator: isEmulator,
+        device_type: isEmulator ? 'emulator' : 'real_device',
+        app_mode: isDev ? 'local_mode' : 'bundled_application',
         environment: environment || (isDev ? 'DEV' : 'PROD'),
         engagement_time_msec: 1000,
     };

package/dist/commonjs/index.js

@@ -403,6 +403,9 @@ const NetworkInspector = ({ enabled = true, storage, navigationRef, appIcon, env
         return false;
     }, [latestNpmVersion]);
     (0, react_1.useEffect)(() => {
+        if (typeof __DEV__ === 'undefined' || !__DEV__) {
+            return;
+        }
         let cancelled = false;
         fetch('https://registry.npmjs.org/react-native-inapp-inspector/latest')
             .then(res => (res.ok ? res.json() : null))

package/dist/esm/components/Inspector/AnalyticsTab.js

@@ -1,4 +1,4 @@
-import React, { useCallback, useState, useMemo, useEffect } from 'react';
+import React, { useCallback, useState, useMemo, useEffect, useRef } from 'react';
 import { FlatList, Pressable, Text, TextInput, TouchableOpacity, View, } from 'react-native';
 import { animateNextLayout, useInspector } from './InspectorContext';
 import AnalyticsEventCard from '../AnalyticsEventCard';
@@ -13,7 +13,7 @@ import Svg, { Path, Rect, Line, Circle, G, Defs, LinearGradient as SvgLinearGrad
 import TouchableScale from '../TouchableScale';
 import { getCurrentUserId, getCurrentUserProperties, getDefaultEventParameters, getCollectionEnabled, } from '../../customHooks/analyticsLogger';
 import { getEventCategory, } from '../../helpers';
-import { LayersIcon, SearchIcon, ClearIcon, TrashIcon, HeaderPauseIcon, FilterIcon, CartIcon, GlobeIcon, BoltIcon, SparkleIcon, PinIcon, MoneyIcon, } from '../NetworkIcons';
+import { LayersIcon, SearchIcon, ClearIcon, TrashIcon, HeaderPauseIcon, FilterIcon, CartIcon, GlobeIcon, BoltIcon, SparkleIcon, PinIcon, MoneyIcon, ChevronIcon, } from '../NetworkIcons';
 const AnalyticsHeader = React.memo(() => {
     const { t } = useTranslation();
     const { analyticsEvents, filteredAnalyticsEvents, analyticsFilters, setAnalyticsFilters, analyticsHeaderExpanded, setAnalyticsHeaderExpanded, } = useInspector();
@@ -795,6 +795,7 @@ const AnalyticsHeader = React.memo(() => {
 const AnalyticsTab = React.memo(() => {
     const { t } = useTranslation();
     const { filteredAnalyticsEvents, analyticsSearch, setAnalyticsSearch, handleDelete, selectedEvent, setSelectedEvent, newEventIds, logRouteMapRef, isAnalyticsLayoutReady, setIsAnalyticsLayoutReady, isAnalyticsPaused, setIsAnalyticsPaused, isAnalyticsFilterApplied, } = useInspector();
+    const listRef = useRef(null);
     const [isFilterModalOpen, setIsFilterModalOpen] = useState(false);
     const keyExtractor = useCallback((item, index) => item?.id?.toString() ?? index.toString(), []);
     const renderItem = useCallback(({ item, index }) => {
@@ -922,7 +923,8 @@ const AnalyticsTab = React.memo(() => {
       <AnalyticsFilterModal visible={isFilterModalOpen} onClose={() => setIsFilterModalOpen(false)}/>
 
       <View style={{ flex: 1 }} onLayout={() => setIsAnalyticsLayoutReady(true)}>
-        {isAnalyticsLayoutReady ? (<FlatList data={filteredAnalyticsEvents} keyExtractor={keyExtractor} ListHeaderComponent={AnalyticsHeader} renderItem={renderItem} initialNumToRender={12} maxToRenderPerBatch={8} windowSize={5} removeClippedSubviews={true} renderToHardwareTextureAndroid={true} ListEmptyComponent={<EmptyState isSearch={analyticsSearch.length > 0} searchQuery={analyticsSearch} customTitle={analyticsSearch.length > 0
+        {isAnalyticsLayoutReady ? (<>
+            <FlatList ref={listRef} data={filteredAnalyticsEvents} keyExtractor={keyExtractor} ListHeaderComponent={AnalyticsHeader} renderItem={renderItem} initialNumToRender={12} maxToRenderPerBatch={8} windowSize={5} removeClippedSubviews={true} renderToHardwareTextureAndroid={true} ListEmptyComponent={<EmptyState isSearch={analyticsSearch.length > 0} searchQuery={analyticsSearch} customTitle={analyticsSearch.length > 0
                     ? 'No matching analytics events'
                     : 'No analytics events yet'} customSub={analyticsSearch.length > 0
                     ? `No events matched "${analyticsSearch}"`
@@ -931,7 +933,30 @@ const AnalyticsTab = React.memo(() => {
                 filteredAnalyticsEvents.length === 0 && {
                     flexGrow: 1,
                 },
-            ]} keyboardShouldPersistTaps="handled"/>) : null}
+            ]} keyboardShouldPersistTaps="handled"/>
+
+            <TouchableScale onPress={() => {
+                try {
+                    listRef.current?.scrollToOffset({
+                        offset: 0,
+                        animated: true,
+                    });
+                }
+                catch {
+                    try {
+                        listRef.current?.scrollToIndex({
+                            index: 0,
+                            animated: true,
+                        });
+                    }
+                    catch { }
+                }
+            }} hitSlop={12} style={styles.scrollTopBtn}>
+              <View style={{ transform: [{ rotate: '180deg' }] }}>
+                <ChevronIcon color={AppColors.white} size={18}/>
+              </View>
+            </TouchableScale>
+          </>) : null}
       </View>
     </>);
 });

package/dist/esm/components/Inspector/BundleTab.js

@@ -4,6 +4,7 @@ import { useTranslation, t } from '../../i18n';
 import TouchableScale from '../TouchableScale';
 import CopyButton from '../CopyButton';
 import HighlightText from '../HighlightText';
+import FeatureUnderDevNotice from './FeatureUnderDevNotice';
 import { AppColors } from '../../styles/AppColors';
 import { AppFonts } from '../../styles/AppFonts';
 import { copyToClipboard } from '../../helpers';
@@ -788,6 +789,8 @@ const BundleTab = React.memo(() => {
         </TouchableScale>
       </View>
 
+      <FeatureUnderDevNotice featureName="Metro Bundle Analyzer"/>
+
       
       
       

package/dist/esm/components/Inspector/ConsoleTab.js

@@ -1,4 +1,4 @@
-import React, { useCallback, useMemo } from 'react';
+import React, { useCallback, useMemo, useRef } from 'react';
 import { FlatList, Pressable, ScrollView, Text, TextInput, View, } from 'react-native';
 import { useInspector } from './InspectorContext';
 import { useTranslation } from '../../i18n';
@@ -10,10 +10,11 @@ import EndOfListFooter from '../EndOfListFooter';
 import styles from '../../styles';
 import { AppColors } from '../../styles/AppColors';
 import { AppFonts } from '../../styles/AppFonts';
-import { SearchIcon, ClearIcon, SortArrowIcon, TrashIcon, LayersIcon, UserIcon, InfoCircleIcon, WarningTriangleIcon, ErrorCircleIcon, AnalyticsIcon, HeaderPauseIcon, } from '../NetworkIcons';
+import { SearchIcon, ClearIcon, SortArrowIcon, TrashIcon, LayersIcon, UserIcon, InfoCircleIcon, WarningTriangleIcon, ErrorCircleIcon, AnalyticsIcon, HeaderPauseIcon, ChevronIcon, } from '../NetworkIcons';
 const ConsoleTab = React.memo(() => {
     const { t } = useTranslation();
     const { logSearch, setLogSearch, logSortOrder, setLogSortOrder, handleDelete, logFilters, setLogFilters, logCounts, filteredConsoleLogs, visibleConsoleLogs, isConsolePaused, setIsConsolePaused, } = useInspector();
+    const listRef = useRef(null);
     const renderItem = useCallback(({ item, index }) => (<AnimatedEntrance index={index} distance={8}>
         <ConsoleLogCard item={item} searchStr={logSearch}/>
       </AnimatedEntrance>), [logSearch]);
@@ -480,7 +481,7 @@ const ConsoleTab = React.memo(() => {
         </ScrollView>
       </View>
 
-      <FlatList data={filteredConsoleLogs} keyExtractor={keyExtractor} ListHeaderComponent={listHeader} renderItem={renderItem} initialNumToRender={12} maxToRenderPerBatch={8} windowSize={5} removeClippedSubviews={true} renderToHardwareTextureAndroid={true} ListEmptyComponent={<EmptyState isSearch={logSearch.length > 0 || logFilters.size > 0} searchQuery={logSearch} customTitle={logSearch.length > 0
+      <FlatList ref={listRef} data={filteredConsoleLogs} keyExtractor={keyExtractor} ListHeaderComponent={listHeader} renderItem={renderItem} initialNumToRender={12} maxToRenderPerBatch={8} windowSize={5} removeClippedSubviews={true} renderToHardwareTextureAndroid={true} ListEmptyComponent={<EmptyState isSearch={logSearch.length > 0 || logFilters.size > 0} searchQuery={logSearch} customTitle={logSearch.length > 0
                 ? 'No matching console logs'
                 : 'No console logs'} onClearSearch={() => {
                 setLogSearch('');
@@ -489,6 +490,28 @@ const ConsoleTab = React.memo(() => {
             styles.listContent,
             filteredConsoleLogs.length === 0 && { flexGrow: 1 },
         ]} keyboardShouldPersistTaps="handled"/>
+
+      <TouchableScale onPress={() => {
+            try {
+                listRef.current?.scrollToOffset({
+                    offset: 0,
+                    animated: true,
+                });
+            }
+            catch {
+                try {
+                    listRef.current?.scrollToIndex({
+                        index: 0,
+                        animated: true,
+                    });
+                }
+                catch { }
+            }
+        }} hitSlop={12} style={styles.scrollTopBtn}>
+        <View style={{ transform: [{ rotate: '180deg' }] }}>
+          <ChevronIcon color={AppColors.white} size={18}/>
+        </View>
+      </TouchableScale>
     </View>);
 });
 export default ConsoleTab;