react-native-inapp-inspector 2.3.5 → 2.3.7

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

@@ -31,8 +31,6 @@ const CrashDetail = React.memo(() => {
         }
         return [];
     }, [selectedCrash]);
-    // Strip keys holding explicit undefined values (e.g. componentStack) so the
-    // Raw JSON tab never renders a literal "undefined".
     const rawCrashData = useMemo(() => {
         try {
             return JSON.parse(JSON.stringify(selectedCrash));
@@ -88,12 +86,12 @@ const CrashDetail = React.memo(() => {
         },
     ];
     return (<View style={{ flex: 1, backgroundColor: AppColors.grayBackground }}>
-      {/* ─── Top Info Bar (Similar to NetworkDetail / LogDetail) ─── */}
+      
       <View style={{ paddingHorizontal: 8, paddingTop: 6 }}>
         <View style={localStyles.infoBar}>
-          {/* Top Status Badges Row */}
+          
           <View style={localStyles.badgeRow}>
-            {/* Fatal / Non-fatal Pill */}
+            
             <View style={[
             localStyles.pillBadge,
             {
@@ -125,7 +123,7 @@ const CrashDetail = React.memo(() => {
               </Text>
             </View>
 
-            {/* Type Pill */}
+            
             <View style={[
             localStyles.pillBadge,
             {
@@ -140,7 +138,7 @@ const CrashDetail = React.memo(() => {
 
             <View style={{ flex: 1 }}/>
 
-            {/* Copy Report Action */}
+            
             <TouchableScale onPress={handleCopyReport} hitSlop={10} style={[
             localStyles.actionButton,
             copiedSuccess && { backgroundColor: AppColors.mintGreenBg, borderColor: AppColors.mintGreenBorder },
@@ -155,12 +153,12 @@ const CrashDetail = React.memo(() => {
             </TouchableScale>
           </View>
 
-          {/* Crash Title / Message */}
+          
           <Text style={localStyles.titleText}>
             {selectedCrash.message}
           </Text>
 
-          {/* Metadata Row */}
+          
           <ScrollView horizontal showsHorizontalScrollIndicator={false} contentContainerStyle={localStyles.metaRow}>
             {originFrame && (<View style={localStyles.metaChip}>
                 <TerminalIcon color={AppColors.grayText} size={11}/>
@@ -186,12 +184,12 @@ const CrashDetail = React.memo(() => {
         </View>
       </View>
 
-      {/* ─── Segmented Sub Tabs ─── */}
+      
       <View style={{ paddingHorizontal: 8, paddingTop: 6, paddingBottom: 4 }}>
         <SegmentedTabs tabs={tabsConfig} activeKey={activeSubTab} onChange={tab => setActiveSubTab(tab)}/>
       </View>
 
-      {/* ─── Search Bar (for Stack & Raw tabs) ─── */}
+      
       {(activeSubTab === 'stack' || activeSubTab === 'raw') && (<View style={{ paddingHorizontal: 12, paddingBottom: 6 }}>
           <View style={localStyles.searchContainer}>
             <SearchIcon color={AppColors.grayText} size={14}/>
@@ -202,11 +200,11 @@ const CrashDetail = React.memo(() => {
           </View>
         </View>)}
 
-      {/* ─── Tab Content ScrollView ─── */}
+      
       <ScrollView style={{ flex: 1 }} contentContainerStyle={{ padding: 12, paddingBottom: 40, gap: 12 }}>
-        {/* 1. STACK TRACE TAB */}
+        
         {activeSubTab === 'stack' && (<View style={{ gap: 10 }}>
-            {/* Filter Chips (App Code vs All Frames) */}
+            
             <View style={localStyles.filterChipsRow}>
               <TouchableScale onPress={() => setStackFilter('app')} style={[
                 localStyles.filterChip,
@@ -239,7 +237,7 @@ const CrashDetail = React.memo(() => {
               </TouchableScale>
             </View>
 
-            {/* Frames List */}
+            
             {displayedFrames.length > 0 ? (displayedFrames
                 .filter(frame => {
                 if (!searchQuery.trim())
@@ -325,9 +323,9 @@ const CrashDetail = React.memo(() => {
               </View>)}
           </View>)}
 
-        {/* 2. DIAGNOSTICS TAB */}
+        
         {activeSubTab === 'diagnostics' && (<View style={{ gap: 12 }}>
-            {/* Device & OS Diagnostics Card */}
+            
             <View style={localStyles.sectionCard}>
               <View style={[
                 localStyles.sectionCardHeader,
@@ -390,7 +388,7 @@ const CrashDetail = React.memo(() => {
               </View>
             </View>
 
-            {/* Memory Metrics Card */}
+            
             {selectedCrash.memoryInfo && (<View style={localStyles.sectionCard}>
                 <View style={[
                     localStyles.sectionCardHeader,
@@ -423,7 +421,7 @@ const CrashDetail = React.memo(() => {
               </View>)}
           </View>)}
 
-        {/* 3. BREADCRUMBS TAB */}
+        
         {activeSubTab === 'breadcrumbs' && (<View style={{ gap: 10 }}>
             {selectedCrash.breadcrumbs && selectedCrash.breadcrumbs.length > 0 && (<View style={{
                     flexDirection: 'row',
@@ -461,7 +459,7 @@ const CrashDetail = React.memo(() => {
               </View>)}
           </View>)}
 
-        {/* 4. RAW JSON TAB */}
+        
         {activeSubTab === 'raw' && (<View style={localStyles.rawContainer}>
             <JsonViewer data={rawCrashData} search={searchQuery} wrap/>
           </View>)}

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

@@ -32,7 +32,6 @@ const CrashFilterModal = ({ visible, onClose, filters, onApply, searchQuery = ''
                 types: new Set(filters.types),
             });
         }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [visible]);
     const toggleType = (key) => {
         setDraft(prev => {

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

@@ -34,7 +34,6 @@ const CrashTab = React.memo(() => {
     const [crashFilters, setCrashFilters] = useState(DEFAULT_CRASH_FILTERS);
     const [isFilterModalOpen, setIsFilterModalOpen] = useState(false);
     const [detailSubTab, setDetailSubTab] = useState('stack');
-    // Calculate statistics
     const stats = useMemo(() => {
         const total = crashRecords.length;
         let fatalCount = 0;
@@ -56,10 +55,8 @@ const CrashTab = React.memo(() => {
         });
         return { total, fatalCount, jsCount, promiseCount, renderCount, nativeCount };
     }, [crashRecords]);
-    // Filtered crash list
     const filteredList = useMemo(() => {
         let list = crashRecords.filter(item => {
-            // Type filter
             if (filterType === 'fatal' && !item.isFatal)
                 return false;
             if (filterType === 'js' && item.type !== 'js')
@@ -70,7 +67,6 @@ const CrashTab = React.memo(() => {
                 return false;
             if (filterType === 'native' && item.type !== 'native')
                 return false;
-            // Modal filters: crash types
             if (crashFilters.types.size > 0 && !crashFilters.types.has('all')) {
                 const matches = (crashFilters.types.has('fatal') && item.isFatal) ||
                     (crashFilters.types.has('js') && item.type === 'js') ||
@@ -80,7 +76,6 @@ const CrashTab = React.memo(() => {
                 if (!matches)
                     return false;
             }
-            // Modal filters: time window
             if (crashFilters.timeWindow !== 'all') {
                 const now = Date.now();
                 const cutoff = crashFilters.timeWindow === '15m'
@@ -93,13 +88,11 @@ const CrashTab = React.memo(() => {
                 if (item.timestamp < cutoff)
                     return false;
             }
-            // Modal filters: platform
             if (crashFilters.platform !== 'all') {
                 const platform = (item.deviceInfo?.platform || '').toLowerCase();
                 if (platform !== crashFilters.platform)
                     return false;
             }
-            // Modal filters: engine
             if (crashFilters.engine !== 'all') {
                 const isHermes = item.deviceInfo?.isHermes;
                 if (crashFilters.engine === 'hermes' && isHermes !== true)
@@ -107,7 +100,6 @@ const CrashTab = React.memo(() => {
                 if (crashFilters.engine === 'jsc' && (isHermes === true))
                     return false;
             }
-            // Search filter
             if (searchQuery.trim().length > 0) {
                 const queryTokens = searchQuery.trim().toLowerCase().split(/\s+/).filter(Boolean);
                 const searchTarget = [
@@ -122,7 +114,6 @@ const CrashTab = React.memo(() => {
             }
             return true;
         });
-        // Modal filters: sort order
         if (crashFilters.sortBy === 'time_asc') {
             list = [...list].sort((a, b) => a.timestamp - b.timestamp);
         }
@@ -163,7 +154,7 @@ const CrashTab = React.memo(() => {
                 localStyles.cardContainer,
                 isFatal && localStyles.fatalCardBorder,
             ]}>
-            {/* Header: #S.No, Badges & Timestamp */}
+            
             <View style={localStyles.cardHeader}>
               <View style={localStyles.badgeRow}>
                 <View style={localStyles.sNoBadge}>
@@ -201,12 +192,12 @@ const CrashTab = React.memo(() => {
               </View>
             </View>
 
-            {/* Error Message */}
+            
             <View style={{ marginVertical: 6 }}>
               <HighlightText text={item.message || t('crash.unknownException')} highlight={searchQuery} numberOfLines={3} style={localStyles.errorMessageText}/>
             </View>
 
-            {/* Top stack frame location if available */}
+            
             {topFrame && (<View style={localStyles.locationRow}>
                 <TerminalIcon size={12} color={AppColors.grayTextWeak}/>
                 <Text numberOfLines={1} ellipsizeMode="middle" style={localStyles.locationText}>
@@ -217,7 +208,7 @@ const CrashTab = React.memo(() => {
                 </Text>
               </View>)}
 
-            {/* Footer row: Actions */}
+            
             <View style={localStyles.cardFooter}>
               <View style={{ flexDirection: 'row', alignItems: 'center', gap: 6, flexWrap: 'wrap' }}>
                 {item.deviceInfo && (<View style={localStyles.metaPill}>
@@ -256,7 +247,7 @@ const CrashTab = React.memo(() => {
     }, [searchQuery, setSelectedCrash]);
     return (<View style={localStyles.container}>
       {crashRecords.length > 0 && (<>
-          {/* ─── Top Stats Bar ─── */}
+          
           <View style={localStyles.statsBar}>
             <ScrollView horizontal showsHorizontalScrollIndicator={false} contentContainerStyle={localStyles.statsScrollContent}>
               <View style={[localStyles.statChip, localStyles.statChipActive]}>
@@ -301,7 +292,7 @@ const CrashTab = React.memo(() => {
             </ScrollView>
           </View>
 
-          {/* ─── Search & Controls ─── */}
+          
           <View style={localStyles.controlsContainer}>
             <View style={localStyles.searchRow}>
               <View style={localStyles.searchInputWrapper}>
@@ -328,7 +319,7 @@ const CrashTab = React.memo(() => {
                   </View>)}
               </View>
 
-              {/* Crash Filters */}
+              
               <TouchableScale onPress={() => setIsFilterModalOpen(true)} style={[
                 localStyles.filterButton,
                 !isCrashFiltersDefault(crashFilters) && {
@@ -352,13 +343,13 @@ const CrashTab = React.memo(() => {
                 }}/>)}
               </TouchableScale>
 
-              {/* Clear Crashes */}
+              
               <TouchableScale onPress={handleClearAll} style={localStyles.clearButton}>
                 <TrashIcon size={14} color={AppColors.errorColor}/>
               </TouchableScale>
             </View>
 
-            {/* ─── Filter Chips ─── */}
+            
             <ScrollView horizontal showsHorizontalScrollIndicator={false} contentContainerStyle={localStyles.filterScrollContent}>
               {[
                 { key: 'all', label: t('crash.filterAll'), Icon: LayersIcon },
@@ -386,7 +377,7 @@ const CrashTab = React.memo(() => {
           </View>
         </>)}
 
-      {/* ─── Crash List or Empty State ─── */}
+      
       {filteredList.length === 0 ? (<ScrollView contentContainerStyle={localStyles.emptyContainer} showsVerticalScrollIndicator={false}>
           <View style={localStyles.emptyIconCircle}>
             <ShieldAlertIcon size={38} color={AppColors.greenColor}/>
@@ -414,7 +405,7 @@ const CrashTab = React.memo(() => {
             </TouchableScale>)}
         </ScrollView>) : (<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 />}/>)}
 
-      {/* Filter Modal */}
+      
       <CrashFilterModal visible={isFilterModalOpen} onClose={() => setIsFilterModalOpen(false)} filters={crashFilters} onApply={setCrashFilters} searchQuery={searchQuery}/>
     </View>);
 });

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

@@ -70,7 +70,6 @@ export const DeviceInfoTab = React.memo(() => {
     const [ipAddress, setIpAddress] = useState('Detecting...');
     const [deviceUptime, setDeviceUptime] = useState('0s');
     const startTimeRef = React.useRef(Date.now());
-    // Load hardware metrics and IP
     const fetchMetrics = useCallback(async () => {
         try {
             const [devMetrics, sysMetrics] = await Promise.all([
@@ -81,7 +80,6 @@ export const DeviceInfoTab = React.memo(() => {
             setSystemMetrics(sysMetrics);
         }
         catch {
-            // Fallback
         }
         finally {
             setIsLoading(false);
@@ -92,11 +90,9 @@ export const DeviceInfoTab = React.memo(() => {
         const interval = setInterval(fetchMetrics, 3000);
         return () => clearInterval(interval);
     }, [fetchMetrics]);
-    // Probe local IP address
     useEffect(() => {
         let isMounted = true;
         const probeIp = async () => {
-            // 1. Try NativeModules or PlatformConstants
             try {
                 const serverHost = NativeModules?.PlatformConstants?.serverHost ||
                     NativeModules?.AndroidConstants?.serverHost ||
@@ -111,7 +107,6 @@ export const DeviceInfoTab = React.memo(() => {
                 }
             }
             catch { }
-            // 2. Query dynamic candidate ip endpoints
             try {
                 const controller = new AbortController();
                 const timer = setTimeout(() => controller.abort(), 1200);
@@ -137,7 +132,6 @@ export const DeviceInfoTab = React.memo(() => {
             isMounted = false;
         };
     }, []);
-    // Calculate Uptime
     useEffect(() => {
         const updateUptime = () => {
             const diffSec = Math.floor((Date.now() - startTimeRef.current) / 1000);
@@ -158,7 +152,6 @@ export const DeviceInfoTab = React.memo(() => {
         updateUptime();
         return () => clearInterval(timer);
     }, []);
-    // Screen Geometry
     const windowDims = Dimensions.get('window');
     const screenDims = Dimensions.get('screen');
     const pixelRatio = PixelRatio.get();
@@ -168,7 +161,6 @@ export const DeviceInfoTab = React.memo(() => {
     const statusBarHeight = Platform.OS === 'android'
         ? StatusBar.currentHeight || 24
         : (windowDims.height >= 812 ? 44 : 20);
-    // Pseudo-UDID deterministic identifier
     const pseudoUDID = useMemo(() => {
         const raw = `${Platform.OS}-${Platform.Version}-${screenDims.width}x${screenDims.height}-${pixelRatio}-${Platform.constants?.Brand || 'generic'}`;
         let hash = 0;
@@ -179,7 +171,6 @@ export const DeviceInfoTab = React.memo(() => {
         const hex = Math.abs(hash).toString(16).padStart(8, '0');
         return `UDID-${Platform.OS.toUpperCase()}-${hex.slice(0, 4)}-${hex.slice(4, 8)}-${Date.now().toString(16).slice(-4)}`.toUpperCase();
     }, [screenDims.width, screenDims.height, pixelRatio]);
-    // Hermes & TurboModule engine status
     const isHermes = Boolean(global?.HermesInternal);
     const isTurboModule = Boolean(globalThis?.__turboModuleProxy);
     const reactNativeVersion = useMemo(() => {
@@ -203,7 +194,6 @@ export const DeviceInfoTab = React.memo(() => {
     const freeStorageGb = deviceMetrics?.freeStorage
         ? (deviceMetrics.freeStorage / (1024 * 1024 * 1024)).toFixed(1)
         : '64.2';
-    // Sub-Tab Definitions
     const subTabs = useMemo(() => [
         {
             key: 'overview',
@@ -236,7 +226,6 @@ export const DeviceInfoTab = React.memo(() => {
             icon: (c) => <KeyIcon size={12} color={c}/>,
         },
     ], []);
-    // Full device JSON export
     const fullDeviceData = useMemo(() => ({
         identifiers: {
             pseudoUDID,
@@ -349,7 +338,6 @@ export const DeviceInfoTab = React.memo(() => {
         copyToClipboard(md, 'Device Markdown Report');
         showToast('Copied Markdown Report to Clipboard!');
     };
-    // Filter items matching search
     const isMatch = (text) => {
         if (!search.trim())
             return true;
@@ -364,7 +352,7 @@ export const DeviceInfoTab = React.memo(() => {
             pseudoUDID.toLowerCase().includes(query));
     }, [search, fullDeviceData, ipAddress, pseudoUDID]);
     return (<View style={styles.container}>
-      {/* ─── Top Sub-Tabs Navigation Bar ─── */}
+      
       <View style={styles.subTabsWrapper}>
         <ScrollView horizontal showsHorizontalScrollIndicator={false} contentContainerStyle={styles.subTabsContainer}>
           {subTabs.map(tab => {
@@ -383,7 +371,7 @@ export const DeviceInfoTab = React.memo(() => {
         </ScrollView>
       </View>
 
-      {/* ─── Search & Export Action Bar ─── */}
+      
       <View style={styles.actionBar}>
         <View style={styles.searchBar}>
           <SearchIcon size={14} color={AppColors.grayTextWeak}/>
@@ -404,9 +392,9 @@ export const DeviceInfoTab = React.memo(() => {
         </TouchableScale>
       </View>
 
-      {/* ─── Main Content Scroll View ─── */}
+      
       <ScrollView style={styles.scrollArea} contentContainerStyle={styles.scrollContent} showsVerticalScrollIndicator={false}>
-        {/* Hero Card */}
+        
         <View style={styles.heroCard}>
           <View style={styles.heroHeader}>
             <View style={styles.heroIconWrap}>
@@ -426,7 +414,7 @@ export const DeviceInfoTab = React.memo(() => {
             </View>
           </View>
 
-          {/* Quick Metrics Strip */}
+          
           <View style={styles.heroMetricsStrip}>
             <View style={styles.heroMetricItem}>
               <Text style={styles.heroMetricLabel} numberOfLines={1} ellipsizeMode="tail">IP ADDRESS</Text>
@@ -449,7 +437,7 @@ export const DeviceInfoTab = React.memo(() => {
           </View>
         </View>
 
-        {/* ── SUB-TAB 1: OVERVIEW ── */}
+        
         {(activeSubTab === 'overview' || search.length > 0) && (<View style={styles.sectionCard}>
             <Text style={styles.sectionTitle}>DEVICE OVERVIEW</Text>
             {isMatch('Device Model') && (<InfoRow label="Device Model" value={fullDeviceData.hardware.model}/>)}
@@ -465,7 +453,7 @@ export const DeviceInfoTab = React.memo(() => {
             {isMatch('UDID Identifier') && (<InfoRow label="Pseudo-UDID" value={pseudoUDID} isLast/>)}
           </View>)}
 
-        {/* ── SUB-TAB 2: HARDWARE & SYSTEM ── */}
+        
         {(activeSubTab === 'hardware' || search.length > 0) && (<View style={styles.sectionCard}>
             <Text style={styles.sectionTitle}>HARDWARE & SYSTEM SPECIFICATIONS</Text>
             {isMatch('CPU Architecture') && (<InfoRow label="CPU Architecture / ABI" value={fullDeviceData.hardware.cpuAbi} badge={{ text: '64-BIT', color: AppColors.purple, bg: `${AppColors.purple}18` }}/>)}
@@ -486,7 +474,7 @@ export const DeviceInfoTab = React.memo(() => {
             {isMatch('Thermal State') && (<InfoRow label="Thermal State" value="Nominal (Cool)" badge={{ text: 'OPTIMAL', color: AppColors.emerald500, bg: `${AppColors.emerald500}18` }} isLast/>)}
           </View>)}
 
-        {/* ── SUB-TAB 3: NETWORK & CONNECTIVITY ── */}
+        
         {(activeSubTab === 'network' || search.length > 0) && (<View style={styles.sectionCard}>
             <Text style={styles.sectionTitle}>NETWORK & CONNECTIVITY</Text>
             {isMatch('IP Address') && (<InfoRow label="Local Device IP" value={ipAddress} badge={{ text: 'IPV4', color: AppColors.blue500, bg: `${AppColors.blue500}18` }}/>)}
@@ -499,7 +487,7 @@ export const DeviceInfoTab = React.memo(() => {
             {isMatch('Network Inspector Interceptor') && (<InfoRow label="Network Interceptor Status" value="Intercepting XHR & Fetch" badge={{ text: 'MONITORING', color: AppColors.purple, bg: `${AppColors.purple}18` }} isLast/>)}
           </View>)}
 
-        {/* ── SUB-TAB 4: DISPLAY & SCREEN GEOMETRY ── */}
+        
         {(activeSubTab === 'display' || search.length > 0) && (<View style={styles.sectionCard}>
             <Text style={styles.sectionTitle}>DISPLAY & SCREEN GEOMETRY</Text>
             {isMatch('Window Resolution') && (<InfoRow label="Window Logical Size" value={`${windowDims.width.toFixed(0)} × ${windowDims.height.toFixed(0)} pt`}/>)}
@@ -515,7 +503,7 @@ export const DeviceInfoTab = React.memo(() => {
             {isMatch('Status Bar Height') && (<InfoRow label="Status Bar Inset" value={`${statusBarHeight} pt`} isLast/>)}
           </View>)}
 
-        {/* ── SUB-TAB 5: RUNTIME & APPLICATION ── */}
+        
         {(activeSubTab === 'runtime' || search.length > 0) && (<View style={styles.sectionCard}>
             <Text style={styles.sectionTitle}>RUNTIME & APPLICATION</Text>
             {isMatch('App Name') && (<InfoRow label="Application Name" value={fullDeviceData.runtime.appName}/>)}
@@ -543,7 +531,7 @@ export const DeviceInfoTab = React.memo(() => {
             {isMatch('Session Uptime') && (<InfoRow label="Inspector Session Uptime" value={deviceUptime} isLast/>)}
           </View>)}
 
-        {/* ── SUB-TAB 6: SECURITY & IDENTIFIERS ── */}
+        
         {(activeSubTab === 'security' || search.length > 0) && (<View style={styles.sectionCard}>
             <Text style={styles.sectionTitle}>DEVICE IDENTIFIERS & SECURITY</Text>
             {isMatch('Pseudo-UDID') && (<InfoRow label="Deterministic Pseudo-UDID" value={pseudoUDID} subtext="Stable hardware signature hash for testing & diagnostics" badge={{ text: 'PERSISTENT', color: AppColors.purple, bg: `${AppColors.purple}18` }}/>)}
@@ -557,7 +545,7 @@ export const DeviceInfoTab = React.memo(() => {
             {isMatch('Sandbox Integrity') && (<InfoRow label="App Sandbox File Isolation" value="Enforced by OS Kernel" isLast/>)}
           </View>)}
 
-        {/* Empty search results state */}
+        
         {search.trim().length > 0 && !hasAnyMatch && (<View style={styles.emptySearchCard}>
             <SearchIcon size={26} color={AppColors.grayTextWeak}/>
             <Text style={styles.emptySearchTitle}>No matching device specifications</Text>

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

@@ -16,7 +16,7 @@ const FabLauncher = () => {
         }} hitSlop={10}>
         <Animated.View style={[styles.fabPulseRing, { transform: [{ scale: pulseAnim }] }]}/>
         <BrandCircleIcon size={62}/>
-        {/* #4 — shining sweep, clipped inside the circular launcher */}
+        
         <View pointerEvents="none" style={styles.fabShineClip}>
           <Animated.View style={[
             styles.fabShineStreak,

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

@@ -9,6 +9,4 @@ export const useInspector = () => {
     return ctx;
 };
 export const animateNextLayout = () => {
-    // Disabled LayoutAnimation to prevent iOS NSRangeException crashes under Fabric
-    // and Android rendering performance freezes.
 };

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

@@ -36,7 +36,7 @@ const InspectorHeader = React.memo(() => {
         if (clean === 'DEV' || clean.includes('DEV') || clean === 'LOCAL') {
             return {
                 label: rawEnv,
-                bg: `${AppColors.emerald500}40`, // emerald
+                bg: `${AppColors.emerald500}40`,
                 border: `${AppColors.emerald400}8C`,
                 text: AppColors.mintGreenBorder,
             };
@@ -44,7 +44,7 @@ const InspectorHeader = React.memo(() => {
         if (clean === 'UAT' || clean === 'QA' || clean === 'TEST') {
             return {
                 label: rawEnv,
-                bg: `${AppColors.amber500}47`, // amber
+                bg: `${AppColors.amber500}47`,
                 border: `${AppColors.amber400}99`,
                 text: AppColors.amberWarmBorder,
             };
@@ -52,15 +52,14 @@ const InspectorHeader = React.memo(() => {
         if (clean === 'PREPROD' || clean === 'STAGE' || clean === 'STAGING') {
             return {
                 label: rawEnv,
-                bg: `${AppColors.purple500}47`, // purple
+                bg: `${AppColors.purple500}47`,
                 border: `${AppColors.purple400}99`,
                 text: AppColors.violetSoftBorder,
             };
         }
-        // PROD / Live
         return {
             label: rawEnv,
-            bg: `${AppColors.rose500}40`, // rose
+            bg: `${AppColors.rose500}40`,
             border: `${AppColors.roseBorder}8C`,
             text: AppColors.errorBorder,
         };
@@ -139,7 +138,7 @@ const InspectorHeader = React.memo(() => {
             },
             !isAnySelected && { display: 'none' },
         ]}>
-              {/* Soft outer glow to fake a blurred circle */}
+              
               <View style={{
             position: 'absolute',
             width: 48,
@@ -254,7 +253,7 @@ const InspectorHeader = React.memo(() => {
                       </Pressable>)}
                   </View>
 
-                  {/* OS & NPM Version Representation */}
+                  
                   <View style={{
                 flexDirection: 'row',
                 alignItems: 'center',
@@ -663,7 +662,7 @@ const InspectorHeader = React.memo(() => {
       </View>
     </LinearGradient>
 
-    {/* Dedicated Update Available Details Modal */}
+    
     <UpdateAvailableModal visible={showUpdateModal} latestVersion={latestNpmVersion} onClose={() => setShowUpdateModal(false)}/>
     </>);
 });