react-native-inapp-inspector 2.2.9 → 2.3.1

package/dist/commonjs/components/AppHeaderLogo.js

@@ -51,15 +51,23 @@ const AppHeaderLogo = ({ size = 46, customIcon, }) => {
                 height: size,
             });
             return (<react_native_1.View style={[
-                    logoStyles.container,
-                    { width: size, height: size, padding: 0, borderRadius: Math.round(size * 0.28) },
+                    logoStyles.svgContainer,
+                    {
+                        width: size,
+                        height: size,
+                        borderRadius: Math.round(size * 0.23),
+                    },
                 ]}>
           {clonedIcon}
         </react_native_1.View>);
         }
         return (<react_native_1.View style={[
-                logoStyles.container,
-                { width: size, height: size, borderRadius: Math.round(size * 0.28) },
+                logoStyles.imageContainer,
+                {
+                    width: size,
+                    height: size,
+                    borderRadius: Math.round(size * 0.23),
+                },
             ]}>
         <react_native_1.Image source={customIcon} style={logoStyles.image} resizeMode="cover"/>
       </react_native_1.View>);
@@ -71,34 +79,59 @@ const AppHeaderLogo = ({ size = 46, customIcon, }) => {
             android: { uri: 'ic_launcher' },
             default: { uri: 'AppIcon' },
         });
-        return (<react_native_1.View style={[logoStyles.container, { width: size, height: size }]}>
+        return (<react_native_1.View style={[
+                logoStyles.imageContainer,
+                {
+                    width: size,
+                    height: size,
+                    borderRadius: Math.round(size * 0.23),
+                },
+            ]}>
         <react_native_1.Image source={nativeSource} style={logoStyles.image} resizeMode="cover" onError={() => setLoadError(true)}/>
       </react_native_1.View>);
     }
     // 3. Fallback: Inspector's Signature Owl Brand Logo
     return (<react_native_1.View style={[
-            logoStyles.container,
-            { width: size, height: size, padding: 0, borderRadius: Math.round(size * 0.28) },
+            logoStyles.svgContainer,
+            {
+                width: size,
+                height: size,
+                borderRadius: Math.round(size * 0.23),
+            },
         ]}>
       <BrandSquareIcon_1.default size={size}/>
     </react_native_1.View>);
 };
 exports.AppHeaderLogo = AppHeaderLogo;
 const logoStyles = react_native_1.StyleSheet.create({
-    container: {
-        borderRadius: 10,
+    svgContainer: {
+        overflow: 'hidden',
+        alignItems: 'center',
+        justifyContent: 'center',
+        shadowColor: '#000',
+        shadowOffset: { width: 0, height: 2 },
+        shadowOpacity: 0.25,
+        shadowRadius: 3,
+        elevation: 3,
+    },
+    imageContainer: {
         overflow: 'hidden',
         backgroundColor: 'rgba(255, 255, 255, 0.15)',
         borderWidth: 1,
-        borderColor: 'rgba(255, 255, 255, 0.28)',
-        padding: 2.5,
+        borderColor: 'rgba(255, 255, 255, 0.35)',
+        padding: 2,
         alignItems: 'center',
         justifyContent: 'center',
+        shadowColor: '#000',
+        shadowOffset: { width: 0, height: 2 },
+        shadowOpacity: 0.25,
+        shadowRadius: 3,
+        elevation: 3,
     },
     image: {
         width: '100%',
         height: '100%',
-        borderRadius: 7.5,
+        borderRadius: 8,
     },
 });
 exports.default = exports.AppHeaderLogo;

package/dist/commonjs/components/BrandSquareIcon.js

@@ -42,72 +42,115 @@ const react_native_svg_1 = __importStar(require("react-native-svg"));
 const BrandSquareIcon = ({ size = 56 }) => {
     return (<react_native_svg_1.default width={size} height={size} viewBox="0 0 256 256" fill="none">
       <react_native_svg_1.Defs>
+        {/* App Tile Background - Crisp Royal Deep Violet to Midnight */}
         <react_native_svg_1.LinearGradient id="bs_tile" x1="0" y1="0" x2="256" y2="256" gradientUnits="userSpaceOnUse">
-          <react_native_svg_1.Stop offset="0" stopColor="#1E1B4B"/>
-          <react_native_svg_1.Stop offset="1" stopColor="#0F172A"/>
+          <react_native_svg_1.Stop offset="0%" stopColor="#1E1B4B"/>
+          <react_native_svg_1.Stop offset="50%" stopColor="#18182F"/>
+          <react_native_svg_1.Stop offset="100%" stopColor="#0B0F19"/>
         </react_native_svg_1.LinearGradient>
-        <react_native_svg_1.LinearGradient id="bs_beam" x1="0" y1="0" x2="256" y2="256" gradientUnits="userSpaceOnUse">
-          <react_native_svg_1.Stop offset="0" stopColor="#818CF8"/>
-          <react_native_svg_1.Stop offset="0.5" stopColor="#A855F7"/>
-          <react_native_svg_1.Stop offset="1" stopColor="#EC4899"/>
+
+        {/* Outer Neon Cyber Border */}
+        <react_native_svg_1.LinearGradient id="bs_border" x1="0" y1="0" x2="256" y2="256" gradientUnits="userSpaceOnUse">
+          <react_native_svg_1.Stop offset="0%" stopColor="#818CF8" stopOpacity={0.9}/>
+          <react_native_svg_1.Stop offset="45%" stopColor="#C084FC" stopOpacity={0.8}/>
+          <react_native_svg_1.Stop offset="80%" stopColor="#F472B6" stopOpacity={0.85}/>
+          <react_native_svg_1.Stop offset="100%" stopColor="#38BDF8" stopOpacity={0.9}/>
+        </react_native_svg_1.LinearGradient>
+
+        {/* Ambient Top Glow */}
+        <react_native_svg_1.RadialGradient id="bs_top_glow" cx="50%" cy="15%" r="65%">
+          <react_native_svg_1.Stop offset="0%" stopColor="#818CF8" stopOpacity={0.35}/>
+          <react_native_svg_1.Stop offset="60%" stopColor="#A855F7" stopOpacity={0.12}/>
+          <react_native_svg_1.Stop offset="100%" stopColor="#1E1B4B" stopOpacity={0}/>
+        </react_native_svg_1.RadialGradient>
+
+        {/* Owl Outer Body Gradient - High Contrast */}
+        <react_native_svg_1.LinearGradient id="bs_body" x1="64" y1="40" x2="192" y2="220" gradientUnits="userSpaceOnUse">
+          <react_native_svg_1.Stop offset="0%" stopColor="#3730A3"/>
+          <react_native_svg_1.Stop offset="50%" stopColor="#2E1065"/>
+          <react_native_svg_1.Stop offset="100%" stopColor="#17123A"/>
         </react_native_svg_1.LinearGradient>
-        <react_native_svg_1.LinearGradient id="bs_body" x1="0" y1="0" x2="0" y2="256" gradientUnits="userSpaceOnUse">
-          <react_native_svg_1.Stop offset="0" stopColor="#312E81"/>
-          <react_native_svg_1.Stop offset="1" stopColor="#1E1B4B"/>
+
+        {/* Neon Cyber Beam Stroke */}
+        <react_native_svg_1.LinearGradient id="bs_beam" x1="40" y1="40" x2="220" y2="220" gradientUnits="userSpaceOnUse">
+          <react_native_svg_1.Stop offset="0%" stopColor="#67E8F9"/>
+          <react_native_svg_1.Stop offset="35%" stopColor="#818CF8"/>
+          <react_native_svg_1.Stop offset="70%" stopColor="#C084FC"/>
+          <react_native_svg_1.Stop offset="100%" stopColor="#F472B6"/>
         </react_native_svg_1.LinearGradient>
-        <react_native_svg_1.RadialGradient id="bs_iris" cx="40%" cy="40%" r="60%">
-          <react_native_svg_1.Stop offset="0" stopColor="#FDE047"/>
-          <react_native_svg_1.Stop offset="0.7" stopColor="#F59E0B"/>
-          <react_native_svg_1.Stop offset="1" stopColor="#D97706"/>
+
+        {/* Eyes Radiant Iris */}
+        <react_native_svg_1.RadialGradient id="bs_iris" cx="38%" cy="36%" r="65%">
+          <react_native_svg_1.Stop offset="0%" stopColor="#FEF08A"/>
+          <react_native_svg_1.Stop offset="40%" stopColor="#FBBF24"/>
+          <react_native_svg_1.Stop offset="80%" stopColor="#F59E0B"/>
+          <react_native_svg_1.Stop offset="100%" stopColor="#D97706"/>
         </react_native_svg_1.RadialGradient>
-        <react_native_svg_1.LinearGradient id="bs_beak" x1="0" y1="0" x2="0" y2="20" gradientUnits="userSpaceOnUse">
-          <react_native_svg_1.Stop offset="0" stopColor="#FBBF24"/>
-          <react_native_svg_1.Stop offset="1" stopColor="#F97316"/>
+
+        {/* Beak Gradient */}
+        <react_native_svg_1.LinearGradient id="bs_beak" x1="124" y1="120" x2="132" y2="136" gradientUnits="userSpaceOnUse">
+          <react_native_svg_1.Stop offset="0%" stopColor="#FDE047"/>
+          <react_native_svg_1.Stop offset="100%" stopColor="#EA580C"/>
         </react_native_svg_1.LinearGradient>
+
+        {/* Diagnostic Lens Glass Flare */}
+        <react_native_svg_1.RadialGradient id="bs_lens" cx="40%" cy="35%" r="65%">
+          <react_native_svg_1.Stop offset="0%" stopColor="#A5F3FC" stopOpacity={0.4}/>
+          <react_native_svg_1.Stop offset="50%" stopColor="#38BDF8" stopOpacity={0.18}/>
+          <react_native_svg_1.Stop offset="100%" stopColor="#0284C7" stopOpacity={0.05}/>
+        </react_native_svg_1.RadialGradient>
       </react_native_svg_1.Defs>
 
-      {/* Rounded App Tile Background */}
-      <react_native_svg_1.Rect x="8" y="8" width="240" height="240" rx="54" fill="url(#bs_tile)"/>
-      <react_native_svg_1.Rect x="8" y="8" width="240" height="240" rx="54" fill="none" stroke="url(#bs_beam)" strokeWidth="3" strokeOpacity={0.4}/>
+      {/* ── 1. Rounded App Tile Base (Full Edge-to-Edge) ── */}
+      <react_native_svg_1.Rect x="2" y="2" width="252" height="252" rx="58" fill="url(#bs_tile)"/>
+      <react_native_svg_1.Rect x="2" y="2" width="252" height="252" rx="58" fill="url(#bs_top_glow)"/>
+      <react_native_svg_1.Rect x="2" y="2" width="252" height="252" rx="58" fill="none" stroke="url(#bs_border)" strokeWidth="3.5"/>
+
+      {/* ── 2. Owl Outer Wings (Layered behind) ── */}
+      <react_native_svg_1.Path d="M62 120 C42 152 46 194 76 210 C68 178 66 146 80 120 Z" fill="#1E1B4B" stroke="url(#bs_beam)" strokeWidth="3" strokeOpacity={0.75}/>
+      <react_native_svg_1.Path d="M194 120 C214 152 210 194 180 210 C188 178 190 146 176 120 Z" fill="#1E1B4B" stroke="url(#bs_beam)" strokeWidth="3" strokeOpacity={0.75}/>
 
-      {/* Owl Outer Body Contour */}
-      <react_native_svg_1.Path d="M64 148 C60 102 72 68 92 56 L100 40 L118 60 Q128 55 138 60 L156 40 L164 56 C184 68 196 102 192 148 C196 178 182 202 150 210 C138 214 118 214 106 210 C74 202 60 178 64 148 Z" fill="url(#bs_body)" stroke="url(#bs_beam)" strokeWidth="4" strokeLinejoin="round"/>
+      {/* ── 3. Owl Body Contour ── */}
+      <react_native_svg_1.Path d="M58 146 C54 98 68 64 88 52 L98 34 L118 56 Q128 50 138 56 L158 34 L168 52 C188 64 202 98 198 146 C202 180 186 208 152 216 C140 220 116 220 104 216 C70 208 54 180 58 146 Z" fill="url(#bs_body)" stroke="url(#bs_beam)" strokeWidth="4.5" strokeLinejoin="round"/>
 
-      {/* Wings */}
-      <react_native_svg_1.Path d="M74 124 C58 154 60 190 86 204 C79 176 77 148 88 126 Z" fill="#1E1B4B" stroke="#818CF8" strokeWidth="2.5" strokeOpacity={0.6}/>
-      <react_native_svg_1.Path d="M182 124 C198 154 196 190 170 204 C177 176 179 148 168 126 Z" fill="#1E1B4B" stroke="#818CF8" strokeWidth="2.5" strokeOpacity={0.6}/>
+      {/* Inner Ear Highlights */}
+      <react_native_svg_1.Path d="M98 42 L112 56 L102 57 Z" fill="#67E8F9" opacity={0.6}/>
+      <react_native_svg_1.Path d="M158 42 L144 56 L154 57 Z" fill="#F472B6" opacity={0.6}/>
 
-      {/* Belly Screen Plate */}
-      <react_native_svg_1.Rect x="105" y="160" width="46" height="34" rx="8" fill="#0B0F19" stroke="url(#bs_beam)" strokeWidth="2"/>
-      {/* Code Emblem on Chest */}
-      <react_native_svg_1.G stroke="#A5B4FC" strokeWidth="2.8" strokeLinecap="round" strokeLinejoin="round" fill="none">
-        <react_native_svg_1.Path d="M120 171 L114 177 L120 183"/>
-        <react_native_svg_1.Path d="M136 171 L142 177 L136 183"/>
-        <react_native_svg_1.Path d="M130 169 L126 185" stroke="#EC4899"/>
+      {/* ── 4. Chest Terminal & Code Braces ── */}
+      <react_native_svg_1.Rect x="98" y="162" width="60" height="38" rx="10" fill="#050811" stroke="url(#bs_beam)" strokeWidth="2.5"/>
+      <react_native_svg_1.G strokeWidth="3" strokeLinecap="round" strokeLinejoin="round" fill="none">
+        <react_native_svg_1.Path d="M116 174 L108 181 L116 188" stroke="#38BDF8"/>
+        <react_native_svg_1.Path d="M140 174 L148 181 L140 188" stroke="#38BDF8"/>
+        <react_native_svg_1.Path d="M131 171 L125 191" stroke="#F43F5E"/>
       </react_native_svg_1.G>
 
-      {/* Facial Disc & Mask */}
-      <react_native_svg_1.Path d="M128 92 C148 70 186 78 186 108 C186 134 160 152 128 152 C96 152 70 134 70 108 C70 78 108 70 128 92 Z" fill="#2E1065" stroke="#818CF8" strokeWidth="2" strokeOpacity={0.6}/>
+      {/* ── 5. Facial Mask Plate ── */}
+      <react_native_svg_1.Path d="M128 88 C152 64 192 72 192 104 C192 132 162 152 128 152 C94 152 64 132 64 104 C64 72 104 64 128 88 Z" fill="#1E1B4B" stroke="url(#bs_beam)" strokeWidth="2.8"/>
+
+      {/* ── 6. Right Eye (Glowing Owl Eye) ── */}
+      <react_native_svg_1.Circle cx="156" cy="106" r="19" fill="url(#bs_iris)" stroke="#0F172A" strokeWidth="2.5"/>
+      <react_native_svg_1.Circle cx="156" cy="106" r="9.5" fill="#0B0F19"/>
+      <react_native_svg_1.Circle cx="159.5" cy="102.5" r="3.5" fill="#FFFFFF"/>
+      <react_native_svg_1.Circle cx="153" cy="109.5" r="1.8" fill="#FFFFFF" opacity={0.85}/>
 
-      {/* Right Eye (Normal Cute Eye) */}
-      <react_native_svg_1.Circle cx="154" cy="108" r="17" fill="url(#bs_iris)" stroke="#0F172A" strokeWidth="2"/>
-      <react_native_svg_1.Circle cx="154" cy="108" r="8.5" fill="#0F172A"/>
-      <react_native_svg_1.Circle cx="157" cy="105" r="3" fill="#FFFFFF"/>
-      <react_native_svg_1.Circle cx="151" cy="111" r="1.5" fill="#FFFFFF" opacity={0.8}/>
+      {/* ── 7. Left Eye (Diagnostic Magnifier Lens) ── */}
+      {/* Magnifier Glass Glow */}
+      <react_native_svg_1.Circle cx="94" cy="104" r="30" fill="url(#bs_lens)" stroke="url(#bs_beam)" strokeWidth="6"/>
+      <react_native_svg_1.Line x1="72" y1="126" x2="48" y2="152" stroke="#0B0F19" strokeWidth="13" strokeLinecap="round"/>
+      <react_native_svg_1.Line x1="72" y1="126" x2="48" y2="152" stroke="url(#bs_beam)" strokeWidth="8" strokeLinecap="round"/>
 
-      {/* Left Eye (Diagnostic Magnifier Lens) */}
-      <react_native_svg_1.Circle cx="96" cy="104" r="20" fill="url(#bs_iris)" stroke="#0F172A" strokeWidth="2"/>
-      <react_native_svg_1.Circle cx="96" cy="104" r="10" fill="#0F172A"/>
-      <react_native_svg_1.Circle cx="99.5" cy="100.5" r="3.5" fill="#FFFFFF"/>
-      <react_native_svg_1.Circle cx="92" cy="107" r="1.8" fill="#FFFFFF" opacity={0.8}/>
+      {/* Eye Inside Magnifier */}
+      <react_native_svg_1.Circle cx="94" cy="104" r="21" fill="url(#bs_iris)" stroke="#0F172A" strokeWidth="2.5"/>
+      <react_native_svg_1.Circle cx="94" cy="104" r="10.5" fill="#0B0F19"/>
+      <react_native_svg_1.Circle cx="98" cy="100" r="4" fill="#FFFFFF"/>
+      <react_native_svg_1.Circle cx="90.5" cy="107.5" r="2" fill="#FFFFFF" opacity={0.85}/>
 
-      {/* Magnifier Glass Ring & Handle */}
-      <react_native_svg_1.Line x1="76" y1="124" x2="55" y2="148" stroke="#0F172A" strokeWidth="12" strokeLinecap="round"/>
-      <react_native_svg_1.Line x1="76" y1="124" x2="55" y2="148" stroke="url(#bs_beam)" strokeWidth="7" strokeLinecap="round"/>
-      <react_native_svg_1.Circle cx="96" cy="104" r="28" fill="#38BDF8" fillOpacity={0.12} stroke="url(#bs_beam)" strokeWidth="6"/>
+      {/* Lens Reflection Highlight */}
+      <react_native_svg_1.Path d="M74 94 A26 26 0 0 1 106 78" stroke="#FFFFFF" strokeWidth="3" strokeLinecap="round" opacity={0.65} fill="none"/>
 
-      {/* Beak */}
-      <react_native_svg_1.Path d="M123.5 123 Q128 121 132.5 123 Q131 132 128 134.5 Q125 132 123.5 123 Z" fill="url(#bs_beak)"/>
+      {/* ── 8. Beak ── */}
+      <react_native_svg_1.Path d="M123 120 Q128 118 133 120 Q131.5 133 128 137 Q124.5 133 123 120 Z" fill="url(#bs_beak)" stroke="#78350F" strokeWidth="1"/>
     </react_native_svg_1.default>);
 };
 exports.BrandSquareIcon = BrandSquareIcon;

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

@@ -1,5 +1,10 @@
 import React from 'react';
-declare const EmptyState: React.NamedExoticComponent<{
+interface EmptyStateProps {
     isSearch?: boolean;
-}>;
+    searchQuery?: string;
+    customTitle?: string;
+    customSub?: string;
+    onClearSearch?: () => void;
+}
+declare const EmptyState: React.NamedExoticComponent<EmptyStateProps>;
 export default EmptyState;

package/dist/commonjs/components/EmptyState.js

@@ -46,7 +46,7 @@ const NetworkIcons_1 = require("./NetworkIcons");
 // Stylesheet
 const AppColors_1 = require("../styles/AppColors");
 const styles_1 = __importDefault(require("../styles"));
-const EmptyState = react_1.default.memo(function EmptyState({ isSearch }) {
+const EmptyState = react_1.default.memo(function EmptyState({ isSearch, searchQuery, customTitle, customSub, onClearSearch, }) {
     const iconPulse = (0, react_1.useRef)(new react_native_1.Animated.Value(1)).current;
     (0, react_1.useEffect)(() => {
         const loop = react_native_1.Animated.loop(react_native_1.Animated.sequence([
@@ -76,13 +76,19 @@ const EmptyState = react_1.default.memo(function EmptyState({ isSearch }) {
         <NetworkIcons_1.EmptyRadarIcon color={AppColors_1.AppColors.purple} size={32}/>
       </react_native_1.Animated.View>
       <react_native_1.Text style={styles_1.default.emptyTitle}>
-        {isSearch ? 'No matching APIs' : 'No network activity'}
+        {customTitle || (isSearch ? 'No matching results' : 'No network activity')}
       </react_native_1.Text>
       <react_native_1.Text style={styles_1.default.emptySub}>
-        {isSearch
-            ? 'Try adjusting your filters or search.'
-            : 'Listening for incoming API calls...'}
+        {customSub ||
+            (isSearch
+                ? searchQuery
+                    ? `No items matched "${searchQuery}"`
+                    : 'Try adjusting your filters or search keywords.'
+                : 'Listening for incoming API calls...')}
       </react_native_1.Text>
+      {isSearch && onClearSearch && (<TouchableScale_1.default style={styles_1.default.reloadBtn} onPress={onClearSearch}>
+          <react_native_1.Text style={styles_1.default.reloadBtnText}>Clear Search & Filters</react_native_1.Text>
+        </TouchableScale_1.default>)}
       {!isSearch && (<TouchableScale_1.default style={styles_1.default.reloadBtn} onPress={handleReload}>
           <react_native_1.Text style={styles_1.default.reloadBtnText}>Reload App</react_native_1.Text>
         </TouchableScale_1.default>)}

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

@@ -42,6 +42,7 @@ const InspectorContext_1 = require("./InspectorContext");
 const AnalyticsEventCard_1 = __importDefault(require("../AnalyticsEventCard"));
 const AnalyticsFilterModal_1 = __importDefault(require("./AnalyticsFilterModal"));
 const EndOfListFooter_1 = __importDefault(require("../EndOfListFooter"));
+const EmptyState_1 = __importDefault(require("../EmptyState"));
 const styles_1 = __importDefault(require("../../styles"));
 const AppColors_1 = require("../../styles/AppColors");
 const AppFonts_1 = require("../../styles/AppFonts");
@@ -888,9 +889,29 @@ const AnalyticsTab = react_1.default.memo(() => {
         <react_native_1.View style={styles_1.default.searchContainer}>
           <NetworkIcons_1.SearchIcon color={AppColors_1.AppColors.grayTextWeak} size={16}/>
           <react_native_1.TextInput placeholder="Search events..." placeholderTextColor={AppColors_1.AppColors.grayTextWeak} value={analyticsSearch} onChangeText={setAnalyticsSearch} style={styles_1.default.searchInput} autoCorrect={false} autoCapitalize="none"/>
-          {analyticsSearch.length > 0 && (<react_native_1.Pressable onPress={() => setAnalyticsSearch('')} hitSlop={10} style={styles_1.default.clearBtn}>
-              <NetworkIcons_1.ClearIcon color={AppColors_1.AppColors.grayTextWeak} size={14}/>
-            </react_native_1.Pressable>)}
+          {analyticsSearch.length > 0 && (<react_native_1.View style={{
+                    flexDirection: 'row',
+                    alignItems: 'center',
+                    gap: 4,
+                }}>
+              <react_native_1.View style={{
+                    backgroundColor: `${AppColors_1.AppColors.purple}20`,
+                    borderRadius: 10,
+                    paddingHorizontal: 6,
+                    paddingVertical: 1.5,
+                }}>
+                <react_native_1.Text style={{
+                    color: AppColors_1.AppColors.purple,
+                    fontSize: 9.5,
+                    fontFamily: AppFonts_1.AppFonts.interBold,
+                }}>
+                  {filteredAnalyticsEvents.length}
+                </react_native_1.Text>
+              </react_native_1.View>
+              <react_native_1.Pressable onPress={() => setAnalyticsSearch('')} hitSlop={10} style={styles_1.default.clearBtn}>
+                <NetworkIcons_1.ClearIcon color={AppColors_1.AppColors.grayTextWeak} size={13}/>
+              </react_native_1.Pressable>
+            </react_native_1.View>)}
         </react_native_1.View>
         <react_native_1.View style={styles_1.default.toolbarRight}>
           <react_native_1.TouchableOpacity style={[
@@ -945,21 +966,11 @@ const AnalyticsTab = react_1.default.memo(() => {
       <AnalyticsFilterModal_1.default visible={isFilterModalOpen} onClose={() => setIsFilterModalOpen(false)}/>
 
       <react_native_1.View style={{ flex: 1 }} onLayout={() => setIsAnalyticsLayoutReady(true)}>
-        {isAnalyticsLayoutReady ? (<react_native_1.FlatList data={filteredAnalyticsEvents} keyExtractor={keyExtractor} ListHeaderComponent={AnalyticsHeader} renderItem={renderItem} initialNumToRender={12} maxToRenderPerBatch={8} windowSize={5} removeClippedSubviews={true} renderToHardwareTextureAndroid={true} ListEmptyComponent={<react_native_1.View style={styles_1.default.emptyContainer}>
-                <react_native_1.View style={styles_1.default.emptyIconWrap}>
-                  <NetworkIcons_1.EmptyRadarIcon color={AppColors_1.AppColors.purple} size={32}/>
-                </react_native_1.View>
-                <react_native_1.Text style={styles_1.default.emptyTitle}>
-                  {analyticsSearch.length > 0
-                    ? 'No matching events'
-                    : 'No analytics events yet'}
-                </react_native_1.Text>
-                <react_native_1.Text style={styles_1.default.emptySub}>
-                  {analyticsSearch.length > 0
-                    ? 'Try adjusting your search.'
-                    : 'Call setupAnalyticsLogger(analytics()) at app start.'}
-                </react_native_1.Text>
-              </react_native_1.View>} ListFooterComponent={filteredAnalyticsEvents.length > 0 ? (<EndOfListFooter_1.default count={filteredAnalyticsEvents.length} label="events"/>) : null} contentContainerStyle={[
+        {isAnalyticsLayoutReady ? (<react_native_1.FlatList data={filteredAnalyticsEvents} keyExtractor={keyExtractor} ListHeaderComponent={AnalyticsHeader} renderItem={renderItem} initialNumToRender={12} maxToRenderPerBatch={8} windowSize={5} removeClippedSubviews={true} renderToHardwareTextureAndroid={true} ListEmptyComponent={<EmptyState_1.default 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}"`
+                    : 'Call setupAnalyticsLogger(analytics()) at app start.'} onClearSearch={() => setAnalyticsSearch('')}/>} ListFooterComponent={filteredAnalyticsEvents.length > 0 ? (<EndOfListFooter_1.default count={filteredAnalyticsEvents.length} label="events"/>) : null} contentContainerStyle={[
                 styles_1.default.listContent,
                 filteredAnalyticsEvents.length === 0 && {
                     flexGrow: 1,

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

@@ -518,7 +518,12 @@ const ConsoleTab = react_1.default.memo(() => {
         </react_native_1.ScrollView>
       </react_native_1.View>
 
-      <react_native_1.FlatList data={filteredConsoleLogs} keyExtractor={keyExtractor} ListHeaderComponent={listHeader} renderItem={renderItem} initialNumToRender={12} maxToRenderPerBatch={8} windowSize={5} removeClippedSubviews={true} renderToHardwareTextureAndroid={true} ListEmptyComponent={<EmptyState_1.default isSearch={logSearch.length > 0 || logFilters.size > 0}/>} ListFooterComponent={filteredConsoleLogs.length > 0 ? (<EndOfListFooter_1.default count={filteredConsoleLogs.length} label="logs"/>) : null} contentContainerStyle={[
+      <react_native_1.FlatList data={filteredConsoleLogs} keyExtractor={keyExtractor} ListHeaderComponent={listHeader} renderItem={renderItem} initialNumToRender={12} maxToRenderPerBatch={8} windowSize={5} removeClippedSubviews={true} renderToHardwareTextureAndroid={true} ListEmptyComponent={<EmptyState_1.default isSearch={logSearch.length > 0 || logFilters.size > 0} searchQuery={logSearch} customTitle={logSearch.length > 0
+                ? 'No matching console logs'
+                : 'No console logs'} onClearSearch={() => {
+                setLogSearch('');
+                setLogFilters(new Set());
+            }}/>} ListFooterComponent={filteredConsoleLogs.length > 0 ? (<EndOfListFooter_1.default count={filteredConsoleLogs.length} label="logs"/>) : null} contentContainerStyle={[
             styles_1.default.listContent,
             filteredConsoleLogs.length === 0 && { flexGrow: 1 },
         ]} keyboardShouldPersistTaps="handled"/>

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

@@ -44,6 +44,7 @@ const TouchableScale_1 = __importDefault(require("../TouchableScale"));
 const SegmentedTabs_1 = __importDefault(require("../SegmentedTabs"));
 const HighlightText_1 = __importDefault(require("../HighlightText"));
 const JsonViewer_1 = __importDefault(require("../JsonViewer"));
+const CopyButton_1 = __importDefault(require("../CopyButton"));
 const AppColors_1 = require("../../styles/AppColors");
 const AppFonts_1 = require("../../styles/AppFonts");
 const crashHandler_1 = require("../../customHooks/crashHandler");
@@ -366,9 +367,20 @@ const CrashDetail = react_1.default.memo(() => {
         {activeSubTab === 'diagnostics' && (<react_native_1.View style={{ gap: 12 }}>
             {/* Device & OS Diagnostics Card */}
             <react_native_1.View style={localStyles.sectionCard}>
-              <react_native_1.View style={localStyles.sectionCardHeader}>
-                <NetworkIcons_1.GlobeIcon color={AppColors_1.AppColors.purple} size={14}/>
-                <react_native_1.Text style={localStyles.sectionCardTitle}>{t('crash.deviceEnvironment')}</react_native_1.Text>
+              <react_native_1.View style={[
+                localStyles.sectionCardHeader,
+                { justifyContent: 'space-between' },
+            ]}>
+                <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 6 }}>
+                  <NetworkIcons_1.GlobeIcon color={AppColors_1.AppColors.purple} size={14}/>
+                  <react_native_1.Text style={localStyles.sectionCardTitle}>
+                    {t('crash.deviceEnvironment')}
+                  </react_native_1.Text>
+                </react_native_1.View>
+                <CopyButton_1.default value={selectedCrash.deviceInfo || {
+                platform: react_native_1.Platform.OS,
+                osVersion: String(react_native_1.Platform.Version),
+            }} label="Diagnostics"/>
               </react_native_1.View>
 
               <react_native_1.View style={localStyles.diagGrid}>
@@ -418,9 +430,17 @@ const CrashDetail = react_1.default.memo(() => {
 
             {/* Memory Metrics Card */}
             {selectedCrash.memoryInfo && (<react_native_1.View style={localStyles.sectionCard}>
-                <react_native_1.View style={localStyles.sectionCardHeader}>
-                  <NetworkIcons_1.LayersIcon color={AppColors_1.AppColors.purple} size={14}/>
-                  <react_native_1.Text style={localStyles.sectionCardTitle}>{t('crash.jsHeapMemory')}</react_native_1.Text>
+                <react_native_1.View style={[
+                    localStyles.sectionCardHeader,
+                    { justifyContent: 'space-between' },
+                ]}>
+                  <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 6 }}>
+                    <NetworkIcons_1.LayersIcon color={AppColors_1.AppColors.purple} size={14}/>
+                    <react_native_1.Text style={localStyles.sectionCardTitle}>
+                      {t('crash.jsHeapMemory')}
+                    </react_native_1.Text>
+                  </react_native_1.View>
+                  <CopyButton_1.default value={selectedCrash.memoryInfo} label="Memory Info"/>
                 </react_native_1.View>
 
                 <react_native_1.View style={localStyles.diagGrid}>
@@ -443,6 +463,13 @@ const CrashDetail = react_1.default.memo(() => {
 
         {/* 3. BREADCRUMBS TAB */}
         {activeSubTab === 'breadcrumbs' && (<react_native_1.View style={{ gap: 10 }}>
+            {selectedCrash.breadcrumbs && selectedCrash.breadcrumbs.length > 0 && (<react_native_1.View style={{
+                    flexDirection: 'row',
+                    justifyContent: 'flex-end',
+                    marginBottom: 2,
+                }}>
+                <CopyButton_1.default value={selectedCrash.breadcrumbs} label="All Breadcrumbs"/>
+              </react_native_1.View>)}
             {selectedCrash.breadcrumbs && selectedCrash.breadcrumbs.length > 0 ? (selectedCrash.breadcrumbs.map((b, idx) => (<react_native_1.View key={`crumb_${idx}`} style={localStyles.breadcrumbCard}>
                   <react_native_1.View style={localStyles.breadcrumbHeader}>
                     <react_native_1.View style={localStyles.breadcrumbTag}>
@@ -450,9 +477,16 @@ const CrashDetail = react_1.default.memo(() => {
                         {b.type.toUpperCase()}
                       </react_native_1.Text>
                     </react_native_1.View>
-                    <react_native_1.Text style={localStyles.breadcrumbTime}>
-                      {new Date(b.timestamp).toLocaleTimeString()}
-                    </react_native_1.Text>
+                    <react_native_1.View style={{
+                    flexDirection: 'row',
+                    alignItems: 'center',
+                    gap: 8,
+                }}>
+                      <react_native_1.Text style={localStyles.breadcrumbTime}>
+                        {new Date(b.timestamp).toLocaleTimeString()}
+                      </react_native_1.Text>
+                      <CopyButton_1.default value={`${new Date(b.timestamp).toLocaleTimeString()} [${b.type.toUpperCase()}] ${b.message}${b.data ? ' ' + JSON.stringify(b.data) : ''}`} label="Breadcrumb"/>
+                    </react_native_1.View>
                   </react_native_1.View>
                   <react_native_1.Text style={localStyles.breadcrumbMessage}>{b.message}</react_native_1.Text>
                   {b.data && (<react_native_1.View style={{ marginTop: 6 }}>

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

@@ -345,9 +345,25 @@ const CrashTab = react_1.default.memo(() => {
               <react_native_1.View style={localStyles.searchInputWrapper}>
                 <NetworkIcons_1.SearchIcon color={AppColors_1.AppColors.grayTextWeak} size={14}/>
                 <react_native_1.TextInput value={searchQuery} onChangeText={setSearchQuery} placeholder={t('crash.searchPlaceholder')} placeholderTextColor={AppColors_1.AppColors.grayTextWeak} style={localStyles.searchInput} autoCapitalize="none" autoCorrect={false}/>
-                {searchQuery.length > 0 && (<react_native_1.TouchableOpacity onPress={() => setSearchQuery('')} hitSlop={8}>
-                    <NetworkIcons_1.ClearIcon color={AppColors_1.AppColors.grayTextWeak} size={14}/>
-                  </react_native_1.TouchableOpacity>)}
+                {searchQuery.length > 0 && (<react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 4 }}>
+                    <react_native_1.View style={{
+                    backgroundColor: `${AppColors_1.AppColors.purple}20`,
+                    borderRadius: 10,
+                    paddingHorizontal: 6,
+                    paddingVertical: 1.5,
+                }}>
+                      <react_native_1.Text style={{
+                    color: AppColors_1.AppColors.purple,
+                    fontSize: 9.5,
+                    fontFamily: AppFonts_1.AppFonts.interBold,
+                }}>
+                        {filteredList.length}
+                      </react_native_1.Text>
+                    </react_native_1.View>
+                    <react_native_1.TouchableOpacity onPress={() => setSearchQuery('')} hitSlop={8}>
+                      <NetworkIcons_1.ClearIcon color={AppColors_1.AppColors.grayTextWeak} size={14}/>
+                    </react_native_1.TouchableOpacity>
+                  </react_native_1.View>)}
               </react_native_1.View>
 
               {/* Crash Filters */}
@@ -419,6 +435,21 @@ const CrashTab = react_1.default.memo(() => {
                 ? t('crash.emptySearchSubtitle')
                 : t('crash.emptySubtitle')}
           </react_native_1.Text>
+          {searchQuery.length > 0 && (<TouchableScale_1.default onPress={() => setSearchQuery('')} style={{
+                    marginTop: 10,
+                    paddingHorizontal: 14,
+                    paddingVertical: 7,
+                    borderRadius: 8,
+                    backgroundColor: AppColors_1.AppColors.purple,
+                }}>
+              <react_native_1.Text style={{
+                    fontFamily: AppFonts_1.AppFonts.interBold,
+                    fontSize: 11.5,
+                    color: AppColors_1.AppColors.white,
+                }}>
+                Clear Search
+              </react_native_1.Text>
+            </TouchableScale_1.default>)}
         </react_native_1.ScrollView>) : (<react_native_1.FlatList data={filteredList} keyExtractor={item => item.id} renderItem={renderCard} initialNumToRender={12} maxToRenderPerBatch={8} windowSize={5} removeClippedSubviews={true} renderToHardwareTextureAndroid={true} contentContainerStyle={localStyles.listContent} showsVerticalScrollIndicator={false} ListFooterComponent={<EndOfListFooter_1.default />}/>)}
 
       {/* Filter Modal */}