react-native-inapp-inspector 1.1.28 → 1.1.29

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

@@ -25,6 +25,26 @@ const NetworkIcons_1 = require("../NetworkIcons");
 const NetworkDetail = react_1.default.memo(() => {
     const { t } = (0, i18n_1.useTranslation)();
     const { selected, detailDisplayUrl, apiDetailActiveTab, setApiDetailActiveTab, detailSearch, setDetailSearch, reqExpanded, setReqExpanded, resExpanded, setResExpanded, showReqDiff, setShowReqDiff, showResDiff, setShowResDiff, prevRequestData, prevResponseData, logRouteMapRef, } = (0, InspectorContext_1.useInspector)();
+    const handleOpenUrl = () => {
+        react_native_1.Alert.alert(t('common.openInBrowser') || 'Open in Browser', `${t('common.openInBrowserPrompt') || 'Are you sure you want to open this URL in your external browser?'}\n\n${detailDisplayUrl}`, [
+            { text: t('common.cancel') || 'Cancel', style: 'cancel' },
+            {
+                text: t('common.open') || 'Open',
+                onPress: () => {
+                    react_native_1.Linking.canOpenURL(detailDisplayUrl)
+                        .then(supported => {
+                        if (supported) {
+                            react_native_1.Linking.openURL(detailDisplayUrl);
+                        }
+                        else {
+                            react_native_1.Linking.openURL(detailDisplayUrl).catch(() => { });
+                        }
+                    })
+                        .catch(() => { });
+                },
+            },
+        ]);
+    };
     if (!selected)
         return null;
     return (<react_native_1.View style={{ flex: 1 }}>
@@ -232,7 +252,7 @@ const NetworkDetail = react_1.default.memo(() => {
                   </react_native_1.View>
 
                   <react_native_1.View style={styles_1.default.detailInfoRight}>
-                    <TouchableScale_1.default style={[styles_1.default.iconSquareBtn, { backgroundColor: `${AppColors_1.AppColors.sky600}15` }]} onPress={() => react_native_1.Linking.openURL(detailDisplayUrl)} hitSlop={12}>
+                    <TouchableScale_1.default style={[styles_1.default.iconSquareBtn, { backgroundColor: `${AppColors_1.AppColors.sky600}15` }]} onPress={handleOpenUrl} hitSlop={12}>
                       <NetworkIcons_1.ExternalLinkIcon color={AppColors_1.AppColors.sky600} size={14}/>
                     </TouchableScale_1.default>
                     <CopyButton_1.default value={(0, helpers_1.getFetchCommand)(selected)} label="fetch()" iconType="fetch"/>
@@ -250,7 +270,7 @@ const NetworkDetail = react_1.default.memo(() => {
                     padding: 10,
                     marginTop: 8,
                     gap: 6,
-                }} onPress={() => react_native_1.Linking.openURL(detailDisplayUrl)}>
+                }} onPress={handleOpenUrl}>
                   <react_native_1.View style={{
                     flexDirection: 'row',
                     alignItems: 'center',
@@ -433,7 +453,7 @@ const NetworkDetail = react_1.default.memo(() => {
                 if (!reqExpanded && !showReqDiff)
                     setReqExpanded(true);
             }}/>
-                {showReqDiff ? (<DiffViewer_1.default oldData={prevRequestData} newData={selected.request} forceOpen={reqExpanded}/>) : reqExpanded ? (<JsonViewer_1.default data={selected.request} search={detailSearch} forceOpen/>) : (<react_native_1.View style={styles_1.default.codeBlock}>
+                {showReqDiff ? (<DiffViewer_1.default oldData={prevRequestData} newData={selected.request} forceOpen={reqExpanded}/>) : reqExpanded ? (<JsonViewer_1.default data={selected.request} search={detailSearch}/>) : (<react_native_1.View style={styles_1.default.codeBlock}>
                     <react_native_1.Text style={[
                     styles_1.default.codeText,
                     { color: AppColors_1.AppColors.grayTextWeak },
@@ -452,26 +472,6 @@ const NetworkDetail = react_1.default.memo(() => {
                     <NetworkIcons_1.ClearIcon color={AppColors_1.AppColors.grayTextWeak} size={14}/>
                   </react_native_1.Pressable>)}
               </react_native_1.View>
-              {selected.response != null && (<react_native_1.View style={{
-                    flexDirection: 'row',
-                    alignItems: 'center',
-                    gap: 4,
-                    paddingHorizontal: 10,
-                    height: 34,
-                    borderRadius: 8,
-                    borderWidth: 1,
-                    borderColor: `${AppColors_1.AppColors.purple}30`,
-                    backgroundColor: `${AppColors_1.AppColors.purple}10`,
-                }}>
-                  <NetworkIcons_1.SizeIcon color={AppColors_1.AppColors.purple} size={12}/>
-                  <react_native_1.Text style={{
-                    fontFamily: AppFonts_1.AppFonts.interBold,
-                    fontSize: 10.5,
-                    color: AppColors_1.AppColors.purple,
-                }}>
-                    {(0, helpers_1.getSize)(selected.response)}
-                  </react_native_1.Text>
-                </react_native_1.View>)}
             </react_native_1.View>
 
             <react_native_1.View style={styles_1.default.sectionContainer}>
@@ -480,7 +480,7 @@ const NetworkDetail = react_1.default.memo(() => {
                 if (!resExpanded && !showResDiff)
                     setResExpanded(true);
             }}/>
-              {showResDiff ? (<DiffViewer_1.default oldData={prevResponseData} newData={selected.response} forceOpen={resExpanded}/>) : resExpanded ? (<JsonViewer_1.default data={selected.response} search={detailSearch} forceOpen wrap/>) : (<react_native_1.View style={styles_1.default.codeBlock}>
+              {showResDiff ? (<DiffViewer_1.default oldData={prevResponseData} newData={selected.response} forceOpen={resExpanded}/>) : resExpanded ? (<JsonViewer_1.default data={selected.response} search={detailSearch} wrap/>) : (<react_native_1.View style={styles_1.default.codeBlock}>
                   <react_native_1.Text style={[
                     styles_1.default.codeText,
                     { color: AppColors_1.AppColors.grayTextWeak },

package/dist/commonjs/components/JsonViewer.js

@@ -95,7 +95,7 @@ const JsonTableRow = react_1.default.memo(({ itemKey, val, search, }) => {
 // ── JsonViewer Component ─────────────────────────────────────────────────────
 const JsonViewer = react_1.default.memo(({ data, search, forceOpen, defaultExpandDepth, wrap, fullHeight = false, maxHeight, mode: externalMode, onModeChange, hideTabs = false, }) => {
     const { t } = (0, i18n_1.useTranslation)();
-    const [internalMode, setInternalMode] = (0, react_1.useState)('pretty');
+    const [internalMode, setInternalMode] = (0, react_1.useState)('raw');
     const mode = externalMode ?? internalMode;
     const setMode = (newMode) => {
         if (onModeChange) {
@@ -116,6 +116,10 @@ const JsonViewer = react_1.default.memo(({ data, search, forceOpen, defaultExpan
             return String(data);
         }
     }, [data]);
+    const [showFullRaw, setShowFullRaw] = (0, react_1.useState)(false);
+    const RAW_LIMIT = 50000;
+    const isTruncated = rawText.length > RAW_LIMIT && !showFullRaw;
+    const displayRawText = isTruncated ? rawText.slice(0, RAW_LIMIT) : rawText;
     (0, react_1.useEffect)(() => {
         if (externalMode) {
             setInternalMode(externalMode);
@@ -186,7 +190,7 @@ const JsonViewer = react_1.default.memo(({ data, search, forceOpen, defaultExpan
       <react_native_1.View style={contentWrapperStyle}>
         {mode === 'pretty' && (isEmpty ? (<react_native_1.View style={localStyles.emptyTable}>
               <react_native_1.Text style={localStyles.emptyTableText}>
-                {t('network.emptyResponse')}
+                {t('network.jsonViewer.emptyPayload')}
               </react_native_1.Text>
             </react_native_1.View>) : (wrap ? (fullHeight ? (<react_native_1.ScrollView style={{ flex: 1 }} contentContainerStyle={{ flexGrow: 1 }}>
                 <react_native_1.View style={[styles_1.default.codeBlock, { width: '100%' }]}>{tree}</react_native_1.View>
@@ -201,12 +205,30 @@ const JsonViewer = react_1.default.memo(({ data, search, forceOpen, defaultExpan
               </react_native_1.ScrollView>))))}
 
         {mode === 'raw' && (<react_native_1.ScrollView style={scrollStyle} contentContainerStyle={localStyles.rawContainer} showsVerticalScrollIndicator={true} nestedScrollEnabled={true}>
-            <HighlightText_1.default text={rawText} search={search} detectLinks={true} style={localStyles.rawPlainText} highlightStyle={{
+            <HighlightText_1.default text={displayRawText} search={search} detectLinks={rawText.length < 20000} style={localStyles.rawPlainText} selectable={true} highlightStyle={{
                 backgroundColor: AppColors_1.AppColors.yellowHighlight,
                 color: AppColors_1.AppColors.primaryBlack,
                 borderRadius: 3,
                 paddingHorizontal: 2,
             }}/>
+            {isTruncated && (<react_native_1.TouchableOpacity onPress={() => setShowFullRaw(true)} style={{
+                    marginTop: 10,
+                    backgroundColor: `${AppColors_1.AppColors.brandPurple}15`,
+                    paddingVertical: 8,
+                    paddingHorizontal: 12,
+                    borderRadius: 6,
+                    alignItems: 'center',
+                    borderWidth: 1,
+                    borderColor: `${AppColors_1.AppColors.brandPurple}30`,
+                }}>
+                <react_native_1.Text style={{
+                    fontFamily: AppFonts_1.AppFonts.interBold,
+                    fontSize: 11,
+                    color: AppColors_1.AppColors.brandPurple,
+                }}>
+                  Showing first 50 KB ({Math.round(rawText.length / 1024)} KB total) · Tap to load full
+                </react_native_1.Text>
+              </react_native_1.TouchableOpacity>)}
           </react_native_1.ScrollView>)}
 
         {mode === 'table' && (fullHeight ? (<react_native_1.ScrollView style={scrollStyle}>

package/dist/commonjs/components/LogCard.js

@@ -51,6 +51,27 @@ const i18n_1 = require("../i18n");
 const LogCard = react_1.default.memo(function LogCard({ item, onPress, timelineMinStart, timelineTotalRange, isNew, isSelected, onToggleSelect, searchStr, }) {
     const { t } = (0, i18n_1.useTranslation)();
     const methodColor = constants_1.METHOD_COLORS[item.method] ?? constants_1.METHOD_COLORS.ALL;
+    const handleOpenUrl = (e) => {
+        e?.stopPropagation?.();
+        react_native_1.Alert.alert(t('common.openInBrowser') || 'Open in Browser', `${t('common.openInBrowserPrompt') || 'Are you sure you want to open this URL in your external browser?'}\n\n${item.url}`, [
+            { text: t('common.cancel') || 'Cancel', style: 'cancel' },
+            {
+                text: t('common.open') || 'Open',
+                onPress: () => {
+                    react_native_1.Linking.canOpenURL(item.url)
+                        .then(supported => {
+                        if (supported) {
+                            react_native_1.Linking.openURL(item.url);
+                        }
+                        else {
+                            react_native_1.Linking.openURL(item.url).catch(() => { });
+                        }
+                    })
+                        .catch(() => { });
+                },
+            },
+        ]);
+    };
     const isFailed = item.status === 0 || (item.status != null && item.status >= 400);
     const isLoading = item.status == null;
     const statusColor = (0, helpers_1.getStatusColor)(item.status);
@@ -76,10 +97,6 @@ const LogCard = react_1.default.memo(function LogCard({ item, onPress, timelineM
             }).start();
         }
     }, [isNew]);
-    const path = (0, helpers_1.getPath)(item.url);
-    const baseUrl = (0, helpers_1.getBaseUrl)(item.url) || item.url;
-    const slug = path && path !== '/' ? path : item.url;
-    const showSlug = slug !== baseUrl && slug !== item.url;
     const triggeredAt = (0, helpers_1.formatDateTime)(item.startTime);
     const isJson = item.url.split('?')[0].toLowerCase().endsWith('.json');
     return (<TouchableScale_1.default onPress={onPress} style={[
@@ -90,7 +107,7 @@ const LogCard = react_1.default.memo(function LogCard({ item, onPress, timelineM
             },
         ]}>
       <react_native_1.View style={styles_1.default.cardBody}>
-        {/* Row 1: Header (Checkbox, Serial, Method Badge, Base URL / Host with HTTPS, Status Pill) */}
+        {/* Row 1: Header (Checkbox, Serial, Method Badge, Client Tag, Status Pill) */}
         <react_native_1.View style={styles_1.default.cardHeaderRow}>
           <react_native_1.View style={styles_1.default.cardHeaderLeft}>
             <react_native_1.Pressable onPress={() => onToggleSelect(item.id)} hitSlop={12} style={[
@@ -150,7 +167,82 @@ const LogCard = react_1.default.memo(function LogCard({ item, onPress, timelineM
                 </react_native_1.Text>
               </react_native_1.View>)}
 
-            <HighlightText_1.default text={baseUrl || item.url} search={searchStr} style={styles_1.default.cardHostText} highlightStyle={styles_1.default.highlight} numberOfLines={1} ellipsizeMode="tail"/>
+            {/* Protocol / HTTPS Badge */}
+            <react_native_1.View style={[
+            styles_1.default.chip,
+            {
+                backgroundColor: item.url.toLowerCase().startsWith('https')
+                    ? '#ECFDF5'
+                    : '#FFFBEB',
+                borderColor: item.url.toLowerCase().startsWith('https')
+                    ? '#A7F3D0'
+                    : '#FDE68A',
+                paddingHorizontal: 4,
+                paddingVertical: 1,
+                borderRadius: 4,
+            },
+        ]}>
+              <react_native_1.Text style={[
+            styles_1.default.chipText,
+            {
+                fontFamily: AppFonts_1.AppFonts.interBold,
+                fontSize: 8,
+                color: item.url.toLowerCase().startsWith('https')
+                    ? '#059669'
+                    : '#D97706',
+            },
+        ]}>
+                {item.url.toLowerCase().startsWith('https') ? 'HTTPS' : 'HTTP'}
+              </react_native_1.Text>
+            </react_native_1.View>
+
+            {/* GraphQL Indicator */}
+            {(item.url.toLowerCase().includes('graphql') ||
+            item.client === 'apollo' ||
+            item.client === 'graphql') && (<react_native_1.View style={[
+                styles_1.default.chip,
+                {
+                    backgroundColor: '#FDF2F8',
+                    borderColor: '#FBCFE8',
+                    paddingHorizontal: 4,
+                    paddingVertical: 1,
+                    borderRadius: 4,
+                },
+            ]}>
+                <react_native_1.Text style={[
+                styles_1.default.chipText,
+                {
+                    fontFamily: AppFonts_1.AppFonts.interBold,
+                    fontSize: 8,
+                    color: '#DB2777',
+                },
+            ]}>
+                  GQL
+                </react_native_1.Text>
+              </react_native_1.View>)}
+
+            {/* In-Line Duration / Latency Pill */}
+            {item.duration != null && !isFailed && (<react_native_1.View style={[
+                styles_1.default.chip,
+                {
+                    backgroundColor: `${durationColor}12`,
+                    borderColor: `${durationColor}2E`,
+                    paddingHorizontal: 4.5,
+                    paddingVertical: 1,
+                    borderRadius: 4,
+                },
+            ]}>
+                <react_native_1.Text style={[
+                styles_1.default.chipText,
+                {
+                    fontFamily: AppFonts_1.AppFonts.interBold,
+                    fontSize: 8.5,
+                    color: durationColor,
+                },
+            ]}>
+                  {item.duration}ms
+                </react_native_1.Text>
+              </react_native_1.View>)}
           </react_native_1.View>
 
           <react_native_1.View style={[
@@ -187,12 +279,12 @@ const LogCard = react_1.default.memo(function LogCard({ item, onPress, timelineM
           </react_native_1.View>
         </react_native_1.View>
 
-        {/* Row 2: Full URL Capsule Container */}
+        {/* Row 2: Full URL Capsule Container (Clickable with link prompt) */}
         <react_native_1.View style={styles_1.default.cardSlugBox}>
-          <react_native_1.View style={styles_1.default.slugLeft}>
-            <react_native_1.Text style={styles_1.default.slugTag}>URL</react_native_1.Text>
-            <HighlightText_1.default text={item.url} search={searchStr} style={styles_1.default.slugText} highlightStyle={styles_1.default.highlight} numberOfLines={2} ellipsizeMode="middle"/>
-          </react_native_1.View>
+          <react_native_1.Pressable onPress={handleOpenUrl} style={styles_1.default.slugLeft} hitSlop={6}>
+            <react_native_1.Text style={styles_1.default.slugTag}>URL ↗</react_native_1.Text>
+            <HighlightText_1.default text={item.url} search={searchStr} style={[styles_1.default.slugText, { color: AppColors_1.AppColors.skyBlue, textDecorationLine: 'underline' }]} highlightStyle={styles_1.default.highlight} numberOfLines={2} ellipsizeMode="middle"/>
+          </react_native_1.Pressable>
 
           <react_native_1.View style={styles_1.default.slugRight}>
             {isJson && (<react_native_1.View style={[

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

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const Toast: React.MemoExoticComponent<() => React.JSX.Element>;
+export default Toast;

package/dist/commonjs/components/Toast.js

@@ -0,0 +1,152 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const react_native_1 = require("react-native");
+const toast_1 = require("../helpers/toast");
+const NetworkIcons_1 = require("./NetworkIcons");
+const AppColors_1 = require("../styles/AppColors");
+const AppFonts_1 = require("../styles/AppFonts");
+const Toast = react_1.default.memo(() => {
+    const [toastMessage, setToastMessage] = (0, react_1.useState)(null);
+    const opacityAnim = (0, react_1.useRef)(new react_native_1.Animated.Value(0)).current;
+    const translateYAnim = (0, react_1.useRef)(new react_native_1.Animated.Value(20)).current;
+    const hideTimerRef = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(() => {
+        const unsubscribe = (0, toast_1.subscribeToast)((message) => {
+            if (hideTimerRef.current) {
+                clearTimeout(hideTimerRef.current);
+            }
+            setToastMessage(message);
+            react_native_1.Animated.parallel([
+                react_native_1.Animated.timing(opacityAnim, {
+                    toValue: 1,
+                    duration: 180,
+                    useNativeDriver: true,
+                }),
+                react_native_1.Animated.spring(translateYAnim, {
+                    toValue: 0,
+                    tension: 80,
+                    friction: 8,
+                    useNativeDriver: true,
+                }),
+            ]).start();
+            hideTimerRef.current = setTimeout(() => {
+                react_native_1.Animated.parallel([
+                    react_native_1.Animated.timing(opacityAnim, {
+                        toValue: 0,
+                        duration: 200,
+                        useNativeDriver: true,
+                    }),
+                    react_native_1.Animated.timing(translateYAnim, {
+                        toValue: 20,
+                        duration: 200,
+                        useNativeDriver: true,
+                    }),
+                ]).start(() => {
+                    setToastMessage(null);
+                });
+            }, 2000);
+        });
+        return () => {
+            unsubscribe();
+            if (hideTimerRef.current) {
+                clearTimeout(hideTimerRef.current);
+            }
+        };
+    }, [opacityAnim, translateYAnim]);
+    if (!toastMessage) {
+        return null;
+    }
+    return (<react_native_1.Animated.View pointerEvents="none" style={[
+            styles.toastContainer,
+            {
+                opacity: opacityAnim,
+                transform: [{ translateY: translateYAnim }],
+            },
+        ]}>
+      <react_native_1.View style={styles.toastCard}>
+        <react_native_1.View style={styles.iconCircle}>
+          <NetworkIcons_1.CheckIcon color={AppColors_1.AppColors.white} size={11}/>
+        </react_native_1.View>
+        <react_native_1.Text style={styles.toastText} numberOfLines={2}>
+          {toastMessage}
+        </react_native_1.Text>
+      </react_native_1.View>
+    </react_native_1.Animated.View>);
+});
+const styles = react_native_1.StyleSheet.create({
+    toastContainer: {
+        position: 'absolute',
+        bottom: react_native_1.Platform.OS === 'ios' ? 44 : 28,
+        left: 20,
+        right: 20,
+        alignItems: 'center',
+        justifyContent: 'center',
+        zIndex: 999999,
+    },
+    toastCard: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        backgroundColor: '#0F172AEE', // dark slate glass
+        paddingVertical: 10,
+        paddingHorizontal: 16,
+        borderRadius: 24,
+        shadowColor: '#000000',
+        shadowOffset: { width: 0, height: 6 },
+        shadowOpacity: 0.28,
+        shadowRadius: 10,
+        elevation: 8,
+        borderWidth: 1,
+        borderColor: '#33415588',
+        maxWidth: '90%',
+        gap: 9,
+    },
+    iconCircle: {
+        width: 18,
+        height: 18,
+        borderRadius: 9,
+        backgroundColor: AppColors_1.AppColors.greenColor,
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+    toastText: {
+        color: AppColors_1.AppColors.white,
+        fontFamily: AppFonts_1.AppFonts.interBold,
+        fontSize: 12.5,
+        letterSpacing: -0.1,
+    },
+});
+exports.default = Toast;

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

@@ -1,6 +1,7 @@
 import React from 'react';
 declare const TouchableScale: React.NamedExoticComponent<{
     onPress?: () => void;
+    onLongPress?: () => void;
     style?: any;
     children?: React.ReactNode;
     hitSlop?: any;

package/dist/commonjs/components/TouchableScale.js

@@ -35,9 +35,9 @@ var __importStar = (this && this.__importStar) || (function () {
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
 const react_native_1 = require("react-native");
-const TouchableScale = react_1.default.memo(function TouchableScale({ onPress, style, children, hitSlop, disabled, }) {
+const TouchableScale = react_1.default.memo(function TouchableScale({ onPress, onLongPress, style, children, hitSlop, disabled, }) {
     if (react_native_1.Platform.OS === 'android') {
-        return (<react_native_1.Pressable disabled={disabled} onPress={onPress} hitSlop={hitSlop} style={({ pressed }) => [
+        return (<react_native_1.Pressable disabled={disabled} onPress={onPress} onLongPress={onLongPress} hitSlop={hitSlop} style={({ pressed }) => [
                 style,
                 { opacity: pressed ? 0.75 : 1 },
             ]}>
@@ -73,7 +73,7 @@ const TouchableScale = react_1.default.memo(function TouchableScale({ onPress, s
         flexShrink: flattenedStyle.flexShrink,
         gap: flattenedStyle.gap,
     };
-    return (<react_native_1.Pressable disabled={disabled} style={style} onPressIn={() => animatePress(true)} onPressOut={() => animatePress(false)} onPress={onPress} hitSlop={hitSlop}>
+    return (<react_native_1.Pressable disabled={disabled} style={style} onPressIn={() => animatePress(true)} onPressOut={() => animatePress(false)} onPress={onPress} onLongPress={onLongPress} hitSlop={hitSlop}>
       <react_native_1.Animated.View style={[{ opacity, transform: [{ scale }] }, layoutStyle]}>
         {children}
       </react_native_1.Animated.View>

package/dist/commonjs/components/TreeNode.js

@@ -46,7 +46,7 @@ const NetworkIcons_1 = require("./NetworkIcons");
 const AppColors_1 = require("../styles/AppColors");
 const styles_1 = __importDefault(require("../styles"));
 const TreeNode = react_1.default.memo(function TreeNode({ data, name, level = 0, search, forceOpen, defaultExpandDepth, }) {
-    const [localOpen, setLocalOpen] = (0, react_1.useState)(forceOpen || level < (defaultExpandDepth ?? 1));
+    const [localOpen, setLocalOpen] = (0, react_1.useState)(forceOpen || (defaultExpandDepth !== undefined ? level < defaultExpandDepth : false));
     const open = localOpen;
     const isObject = typeof data === 'object' && data !== null;
     const isArray = Array.isArray(data);

package/dist/commonjs/constants/index.js

@@ -12,12 +12,12 @@ exports.STATUS_FILTERS = [
     'Failed',
 ];
 exports.METHOD_COLORS = {
-    ALL: AppColors_1.AppColors.grayText,
-    GET: AppColors_1.AppColors.purple,
-    POST: AppColors_1.AppColors.greenColor,
-    PUT: AppColors_1.AppColors.lightOrange,
-    PATCH: AppColors_1.AppColors.offerPurple,
-    DELETE: AppColors_1.AppColors.errorColor,
+    ALL: '#64748B', // Slate
+    GET: '#059669', // Emerald
+    POST: '#2563EB', // Royal Blue
+    PUT: '#D97706', // Amber Gold
+    PATCH: '#7C3AED', // Rich Violet
+    DELETE: '#DC2626', // Crimson Red
 };
 exports.DOMAIN_COLORS = AppColors_1.AppColors.domainColors;
 exports.DURATION_FAST_MS = 200;

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

@@ -1 +1 @@
-export declare const LIB_VERSION = "1.1.28";
+export declare const LIB_VERSION = "1.1.29";

package/dist/commonjs/constants/version.js

@@ -3,4 +3,4 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.LIB_VERSION = void 0;
 // AUTO-GENERATED FILE — do not edit by hand.
 // Regenerated from package.json on every build by scripts/gen-version.js.
-exports.LIB_VERSION = '1.1.28';
+exports.LIB_VERSION = '1.1.29';

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

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