react-native-inapp-inspector 2.3.11 → 2.3.13

package/dist/commonjs/components/HeadersSection.js

@@ -80,10 +80,11 @@ const HeaderRow = react_1.default.memo(function HeaderRow({ headerKey, value, is
         <react_native_1.Text style={styles_1.default.htValue} selectable numberOfLines={expanded ? undefined : 3}>
           {value}
         </react_native_1.Text>
-        {isLong && (<react_native_1.View style={styles_1.default.htExpandRow}>
+        {isLong && (<react_native_1.View style={[styles_1.default.htExpandRow, { flexDirection: 'row', alignItems: 'center', gap: 4 }]}>
             <react_native_1.Text style={styles_1.default.htExpandText}>
-              {expanded ? '▲ less' : '▼ more'}
+              {expanded ? 'less' : 'more'}
             </react_native_1.Text>
+            <NetworkIcons_1.ChevronIcon direction={expanded ? 'up' : 'down'} color={AppColors_1.AppColors.purple} size={10}/>
           </react_native_1.View>)}
       </react_native_1.Pressable>
       <TouchableScale_1.default onPress={() => (0, helpers_1.copyToClipboard)(value, headerKey)} hitSlop={8} style={styles_1.default.htCopyBtn}>

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

@@ -418,9 +418,9 @@ const BundleTreeNodeView = ({ node, level, search, totalBundleKb, expandedFolder
                 ? `${(node.sizeKb / 1024).toFixed(2)} MB`
                 : `${node.sizeKb} KB`}`} accessibilityState={{ expanded: isExpanded }} accessibilityHint="Double tap to expand or collapse folder" onPress={() => toggleFolder(node.fullPath)} style={[bundleStyles.treeFolderRow, { paddingLeft: indentLeft }]}>
           <react_native_1.View style={bundleStyles.treeRowLeft}>
-            <react_native_1.Text style={bundleStyles.treeChevron}>
-              {isCollapsed ? '▸' : '▾'}
-            </react_native_1.Text>
+            <react_native_1.View style={{ marginRight: 4 }}>
+              <NetworkIcons_1.ChevronIcon direction={isCollapsed ? 'right' : 'down'} size={12} color={AppColors_1.AppColors.grayTextWeak}/>
+            </react_native_1.View>
             {isCollapsed ? (<NetworkIcons_1.FolderIcon color={AppColors_1.AppColors.amber500} size={15}/>) : (<NetworkIcons_1.FolderOpenIcon color={AppColors_1.AppColors.amber500} size={15}/>)}
             <HighlightText_1.default text={node.name + '/'} search={search} style={bundleStyles.treeFolderName} highlightStyle={bundleStyles.searchHighlight}/>
             <react_native_1.View style={bundleStyles.treeCountBadge}>
@@ -876,7 +876,7 @@ const BundleTab = react_1.default.memo(() => {
                     letterSpacing: 0.3,
                     textTransform: 'uppercase',
                 }}>
-                            Live Metro URL ↗
+                            Live Metro URL
                           </react_native_1.Text>
                         </react_native_1.View>
                         <react_native_1.Text style={{

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

@@ -129,6 +129,7 @@ const DebuggingTab = () => {
         probePorts();
     }, [probePorts]);
     const metroBundleUrl = `http://${hostIp}:${selectedPort}/index.bundle?platform=android&dev=true`;
+    const directServerUrl = `http://${hostIp}:${selectedPort}`;
     const apkDownloadUrl = `http://${hostIp}:${selectedPort}/${apkPath}`;
     const devSettingsHost = `${hostIp}:${selectedPort}`;
     const currentQrValue = (0, react_1.useMemo)(() => {
@@ -136,8 +137,8 @@ const DebuggingTab = () => {
             return apkDownloadUrl;
         if (activeQrTab === 'host')
             return devSettingsHost;
-        return metroBundleUrl;
-    }, [activeQrTab, apkDownloadUrl, devSettingsHost, metroBundleUrl]);
+        return directServerUrl;
+    }, [activeQrTab, apkDownloadUrl, devSettingsHost, directServerUrl]);
     const activePortInfo = portsStatus[selectedPort];
     return (<react_native_1.ScrollView style={styles.container} contentContainerStyle={styles.content} showsVerticalScrollIndicator={false}>
       
@@ -163,10 +164,10 @@ const DebuggingTab = () => {
               </react_native_1.View>
               <react_native_1.Text style={styles.serverSubtitle}>
                 {activePortInfo?.status === 'active'
-            ? `🟢 Active & Bundling (${activePortInfo.latencyMs}ms)`
+            ? `Active & Bundling (${activePortInfo.latencyMs}ms)`
             : activePortInfo?.status === 'checking'
-                ? '🟡 Probing Metro Ports...'
-                : '🔴 Standby / Select active port'}
+                ? 'Probing Metro Ports...'
+                : 'Standby / Select active port'}
               </react_native_1.Text>
             </react_native_1.View>
           </react_native_1.View>
@@ -231,9 +232,12 @@ const DebuggingTab = () => {
           <react_native_1.TextInput style={styles.input} value={hostIp} onChangeText={setHostIp} placeholder="192.168.1.15" placeholderTextColor={AppColors_1.AppColors.grayTextWeak} autoCapitalize="none" autoCorrect={false}/>
           <react_native_1.Text style={styles.inputSuffix}>:{selectedPort}</react_native_1.Text>
         </react_native_1.View>
-        <react_native_1.Text style={styles.inputHint}>
-          💡 Ensure your physical Android device and Mac are connected to the same Wi-Fi network.
-        </react_native_1.Text>
+        <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 6, marginTop: 6 }}>
+          <NetworkIcons_1.InfoCircleIcon size={13} color={AppColors_1.AppColors.grayTextWeak}/>
+          <react_native_1.Text style={[styles.inputHint, { marginTop: 0, flex: 1 }]}>
+            Ensure your physical Android device and Mac are connected to the same Wi-Fi network.
+          </react_native_1.Text>
+        </react_native_1.View>
       </react_native_1.View>
 
       
@@ -285,13 +289,16 @@ const DebuggingTab = () => {
           <QRCodeView_1.default value={currentQrValue} size={190} color={AppColors_1.AppColors.primaryBlack} backgroundColor={AppColors_1.AppColors.white}/>
 
           <react_native_1.View style={styles.qrInfoBox}>
-            <react_native_1.Text style={styles.qrTargetTitle}>
-              {activeQrTab === 'apk'
-            ? '📦 Direct APK Download URL'
+            <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 5, marginBottom: 2 }}>
+              {activeQrTab === 'apk' ? (<NetworkIcons_1.PackageIcon size={14} color={AppColors_1.AppColors.purple}/>) : activeQrTab === 'host' ? (<NetworkIcons_1.SmartphoneIcon size={14} color={AppColors_1.AppColors.purple}/>) : (<NetworkIcons_1.BoltIcon size={14} color={AppColors_1.AppColors.amber500}/>)}
+              <react_native_1.Text style={styles.qrTargetTitle}>
+                {activeQrTab === 'apk'
+            ? 'Direct APK Download URL'
             : activeQrTab === 'host'
-                ? '📱 Dev Settings Bundle Host'
-                : '⚡ Live Metro Fast-Refresh Endpoint'}
-            </react_native_1.Text>
+                ? 'Dev Settings Bundle Host'
+                : 'Live Metro Fast-Refresh Endpoint'}
+              </react_native_1.Text>
+            </react_native_1.View>
             <react_native_1.Text style={styles.qrTargetUrl} numberOfLines={2} ellipsizeMode="middle">
               {currentQrValue}
             </react_native_1.Text>
@@ -317,7 +324,10 @@ const DebuggingTab = () => {
 
       
       <react_native_1.View style={styles.guideCard}>
-        <react_native_1.Text style={styles.guideHeading}>📱 HOW TO CONNECT ANDROID DEVICE:</react_native_1.Text>
+        <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 6, marginBottom: 12 }}>
+          <NetworkIcons_1.SmartphoneIcon size={15} color={AppColors_1.AppColors.primaryLight}/>
+          <react_native_1.Text style={[styles.guideHeading, { marginBottom: 0 }]}>HOW TO CONNECT ANDROID DEVICE:</react_native_1.Text>
+        </react_native_1.View>
 
         <react_native_1.View style={styles.stepRow}>
           <react_native_1.View style={styles.stepNumberBadge}>
@@ -348,7 +358,10 @@ const DebuggingTab = () => {
             <react_native_1.Text style={styles.stepNumberText}>3</react_native_1.Text>
           </react_native_1.View>
           <react_native_1.View style={{ flex: 1 }}>
-            <react_native_1.Text style={styles.stepTitle}>Simultaneous Live Fast-Refresh ⚡</react_native_1.Text>
+            <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 4 }}>
+              <react_native_1.Text style={styles.stepTitle}>Simultaneous Live Fast-Refresh</react_native_1.Text>
+              <NetworkIcons_1.BoltIcon size={13} color={AppColors_1.AppColors.amber500}/>
+            </react_native_1.View>
             <react_native_1.Text style={styles.stepDesc}>
               Any changes saved in VS Code will immediately update <react_native_1.Text style={{ fontWeight: '700' }}>both the iOS Simulator and physical Android phone</react_native_1.Text> in real-time!
             </react_native_1.Text>

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

@@ -303,7 +303,7 @@ const NetworkDetail = react_1.default.memo(() => {
                     letterSpacing: 0.4,
                     textTransform: 'uppercase',
                 }}>
-                        ENDPOINT URL ↗
+                        ENDPOINT URL
                       </react_native_1.Text>
                     </react_native_1.View>
 
@@ -338,7 +338,7 @@ const NetworkDetail = react_1.default.memo(() => {
                     fontSize: 9,
                     color: AppColors_1.AppColors.sky600,
                 }}>
-                          Open ↗
+                          Open
                         </react_native_1.Text>
                       </react_native_1.View>
                     </react_native_1.View>

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

@@ -370,12 +370,13 @@ const NetworkFilterModal = ({ visible, onClose, filters, onApply, searchQuery =
               <react_native_1.Text style={styles.sectionTitle}>LATENCY & SPEED</react_native_1.Text>
               <react_native_1.View style={styles.chipsWrap}>
                 {[
-            { key: 'all', label: 'All Speeds', color: AppColors_1.AppColors.purple },
-            { key: 'fast', label: '⚡ Fast (<200ms)', color: AppColors_1.AppColors.greenColor, count: counts.fastCount },
-            { key: 'normal', label: '⏱️ Normal (200-500ms)', color: AppColors_1.AppColors.skyBlue, count: counts.normalCount },
-            { key: 'slow', label: '⚠️ Slow (>500ms)', color: AppColors_1.AppColors.errorColor, count: counts.slowCount },
+            { key: 'all', label: 'All Speeds', color: AppColors_1.AppColors.purple, icon: NetworkIcons_1.LayersIcon },
+            { key: 'fast', label: 'Fast (<200ms)', color: AppColors_1.AppColors.greenColor, icon: NetworkIcons_1.BoltIcon, count: counts.fastCount },
+            { key: 'normal', label: 'Normal (200-500ms)', color: AppColors_1.AppColors.skyBlue, icon: NetworkIcons_1.ClockIcon, count: counts.normalCount },
+            { key: 'slow', label: 'Slow (>500ms)', color: AppColors_1.AppColors.errorColor, icon: NetworkIcons_1.CircleAlertIcon, count: counts.slowCount },
         ].map(item => {
             const isSelected = draft.latency === item.key;
+            const IconComp = item.icon;
             return (<react_native_1.TouchableOpacity key={item.key} activeOpacity={0.7} onPress={() => setDraft(prev => ({ ...prev, latency: item.key }))} style={[
                     styles.chip,
                     isSelected && {
@@ -383,6 +384,7 @@ const NetworkFilterModal = ({ visible, onClose, filters, onApply, searchQuery =
                         borderColor: item.color,
                     },
                 ]}>
+                      <IconComp size={13} color={isSelected ? item.color : AppColors_1.AppColors.grayTextWeak}/>
                       <react_native_1.Text style={[
                     styles.chipLabel,
                     isSelected && { color: item.color, fontFamily: AppFonts_1.AppFonts.interBold },
@@ -404,11 +406,12 @@ const NetworkFilterModal = ({ visible, onClose, filters, onApply, searchQuery =
               <react_native_1.Text style={styles.sectionTitle}>PROTOCOL</react_native_1.Text>
               <react_native_1.View style={styles.chipsWrap}>
                 {[
-            { key: 'all', label: 'All Protocols', color: AppColors_1.AppColors.purple },
-            { key: 'https', label: '🔒 HTTPS Secure', color: AppColors_1.AppColors.mintGreenText, count: counts.httpsCount },
-            { key: 'http', label: '🔓 HTTP Insecure', color: AppColors_1.AppColors.amber700, count: counts.httpCount },
+            { key: 'all', label: 'All Protocols', color: AppColors_1.AppColors.purple, icon: NetworkIcons_1.GlobeIcon },
+            { key: 'https', label: 'HTTPS Secure', color: AppColors_1.AppColors.mintGreenText, icon: NetworkIcons_1.LockIcon, count: counts.httpsCount },
+            { key: 'http', label: 'HTTP Insecure', color: AppColors_1.AppColors.amber700, icon: NetworkIcons_1.UnlockIcon, count: counts.httpCount },
         ].map(item => {
             const isSelected = draft.protocol === item.key;
+            const IconComp = item.icon;
             return (<react_native_1.TouchableOpacity key={item.key} activeOpacity={0.7} onPress={() => setDraft(prev => ({ ...prev, protocol: item.key }))} style={[
                     styles.chip,
                     isSelected && {
@@ -416,6 +419,7 @@ const NetworkFilterModal = ({ visible, onClose, filters, onApply, searchQuery =
                         borderColor: item.color,
                     },
                 ]}>
+                      <IconComp size={13} color={isSelected ? item.color : AppColors_1.AppColors.grayTextWeak}/>
                       <react_native_1.Text style={[
                     styles.chipLabel,
                     isSelected && { color: item.color, fontFamily: AppFonts_1.AppFonts.interBold },
@@ -437,13 +441,14 @@ const NetworkFilterModal = ({ visible, onClose, filters, onApply, searchQuery =
               <react_native_1.Text style={styles.sectionTitle}>SORT BY</react_native_1.Text>
               <react_native_1.View style={styles.chipsWrap}>
                 {[
-            { key: 'time_desc', label: '⏱️ Newest First (Default)' },
-            { key: 'time_asc', label: '⌛ Oldest First' },
-            { key: 'duration_desc', label: '🐢 Slowest Response' },
-            { key: 'duration_asc', label: '🚀 Fastest Response' },
-            { key: 'size_desc', label: '📦 Largest Response Size' },
+            { key: 'time_desc', label: 'Newest First (Default)', icon: NetworkIcons_1.ClockIcon },
+            { key: 'time_asc', label: 'Oldest First', icon: NetworkIcons_1.HourglassIcon },
+            { key: 'duration_desc', label: 'Slowest Response', icon: NetworkIcons_1.TurtleIcon },
+            { key: 'duration_asc', label: 'Fastest Response', icon: NetworkIcons_1.RocketIcon },
+            { key: 'size_desc', label: 'Largest Response Size', icon: NetworkIcons_1.PackageIcon },
         ].map(item => {
             const isSelected = draft.sortBy === item.key;
+            const IconComp = item.icon;
             return (<react_native_1.TouchableOpacity key={item.key} activeOpacity={0.7} onPress={() => setDraft(prev => ({ ...prev, sortBy: item.key }))} style={[
                     styles.chip,
                     isSelected && {
@@ -451,6 +456,7 @@ const NetworkFilterModal = ({ visible, onClose, filters, onApply, searchQuery =
                         borderColor: AppColors_1.AppColors.purple,
                     },
                 ]}>
+                      <IconComp size={13} color={isSelected ? AppColors_1.AppColors.purple : AppColors_1.AppColors.grayTextWeak}/>
                       <react_native_1.Text style={[
                     styles.chipLabel,
                     isSelected && { color: AppColors_1.AppColors.purple, fontFamily: AppFonts_1.AppFonts.interBold },

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

@@ -127,9 +127,12 @@ const StorageEntryCard = react_1.default.memo(function StorageEntryCard({ entry,
         <react_native_1.Text style={styles.valuePreviewText} numberOfLines={isExpanded ? undefined : 3} selectable={isExpanded}>
           {displayValue}
         </react_native_1.Text>
-        {entry.value.length > 80 && (<react_native_1.Text style={styles.expandHint}>
-            {isExpanded ? '▲ Collapse' : '▼ Expand'}
-          </react_native_1.Text>)}
+        {entry.value.length > 80 && (<react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 4, marginTop: 4 }}>
+            <react_native_1.Text style={styles.expandHint}>
+              {isExpanded ? 'Collapse' : 'Expand'}
+            </react_native_1.Text>
+            <NetworkIcons_1.ChevronIcon direction={isExpanded ? 'up' : 'down'} size={10} color={AppColors_1.AppColors.purple}/>
+          </react_native_1.View>)}
       </TouchableScale_1.default>
     </react_native_1.View>);
 });
@@ -504,7 +507,10 @@ exports.StorageTab = react_1.default.memo(() => {
                 : editType === 'boolean'
                     ? 'true'
                     : 'String value...'} placeholderTextColor={AppColors_1.AppColors.grayTextWeak} style={[styles.textInput, styles.textAreaInput]} multiline textAlignVertical="top" autoCapitalize="none"/>
-              {jsonError && (<react_native_1.Text style={styles.errorText}>⚠️ {jsonError}</react_native_1.Text>)}
+              {jsonError && (<react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 5, marginTop: 4 }}>
+                  <NetworkIcons_1.WarningTriangleIcon size={12} color={AppColors_1.AppColors.errorColor}/>
+                  <react_native_1.Text style={styles.errorText}>{jsonError}</react_native_1.Text>
+                </react_native_1.View>)}
             </react_native_1.View>
 
             

package/dist/commonjs/components/JsonViewer.js

@@ -82,10 +82,11 @@ const JsonTableRow = react_1.default.memo(({ itemKey, val, search, }) => {
             localStyles.tableCellValue,
             isObject && localStyles.tableCellRawCode,
         ]} highlightStyle={localStyles.highlight} numberOfLines={expanded ? undefined : 3} selectable={true}/>
-        {isMultiline && (<react_native_1.TouchableOpacity onPress={() => setExpanded(prev => !prev)} hitSlop={6} style={localStyles.showMoreBtn}>
+        {isMultiline && (<react_native_1.TouchableOpacity onPress={() => setExpanded(prev => !prev)} hitSlop={6} style={[localStyles.showMoreBtn, { flexDirection: 'row', alignItems: 'center', gap: 4 }]}>
             <react_native_1.Text style={localStyles.showMoreText}>
-              {expanded ? 'Show less ▲' : 'Show more ▼'}
+              {expanded ? 'Show less' : 'Show more'}
             </react_native_1.Text>
+            <NetworkIcons_1.ChevronIcon direction={expanded ? 'up' : 'down'} size={10} color={AppColors_1.AppColors.purple}/>
           </react_native_1.TouchableOpacity>)}
       </react_native_1.View>
     </react_native_1.View>);

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

@@ -37,7 +37,7 @@ export declare const SignalIcon: ({ color, size, }: IconProps) => React.JSX.Elem
 export declare const DiffIcon: ({ color, size }: IconProps) => React.JSX.Element;
 export declare const GlobeIcon: ({ color, size }: IconProps) => React.JSX.Element;
 export declare const SortArrowIcon: ({ color, size, direction, }: IconProps) => React.JSX.Element;
-export declare const ChevronIcon: ({ color, size, }: IconProps) => React.JSX.Element;
+export declare const ChevronIcon: ({ color, size, direction, }: IconProps) => React.JSX.Element;
 export declare const FilterIcon: ({ color, size, }: IconProps) => React.JSX.Element;
 export declare const DownloadIcon: ({ color, size, }: IconProps) => React.JSX.Element;
 export declare const CloseWhite: ({ color, size }: IconProps) => React.JSX.Element;
@@ -135,3 +135,6 @@ export declare const PencilIcon: ({ color, size, }: IconProps) => React.JSX.Elem
 export declare const PlusIcon: ({ color, size, }: IconProps) => React.JSX.Element;
 export declare const LockIcon: ({ color, size, }: IconProps) => React.JSX.Element;
 export declare const QrCodeIcon: ({ color, size, }: IconProps) => React.JSX.Element;
+export declare const UnlockIcon: ({ color, size, }: IconProps) => React.JSX.Element;
+export declare const RocketIcon: ({ color, size, }: IconProps) => React.JSX.Element;
+export declare const TurtleIcon: ({ color, size, }: IconProps) => React.JSX.Element;

package/dist/commonjs/components/NetworkIcons.js

@@ -38,7 +38,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.InfoCircleIcon = exports.UserIcon = exports.LayersIcon = exports.WipeIcon = exports.FolderIcon = exports.SettingsIcon = exports.EyeIcon = exports.JsIcon = exports.CssIcon = exports.HtmlIcon = exports.BrandSquareIcon = exports.BrandCircleIcon = exports.MoonIcon = exports.SunIcon = exports.DebugIcon = exports.InsightsIcon = exports.AnalyticsIcon = exports.WhiteBackNavigation = exports.CloseWhite = exports.DownloadIcon = exports.FilterIcon = exports.ChevronIcon = exports.SortArrowIcon = exports.GlobeIcon = exports.DiffIcon = exports.SignalIcon = exports.ExportIcon = exports.HeaderPauseIcon = exports.TrashIcon = exports.FailIcon = exports.CircleAlertIcon = exports.CircleXIcon = exports.CircleCheckIcon = exports.CheckIcon = exports.TerminalIcon = exports.FetchIcon = exports.CopyIcon = exports.HeadersIcon = exports.ResponseIcon = exports.RequestIcon = exports.SizeIcon = exports.StatusIcon = exports.CalendarIcon = exports.ClockIcon = exports.ClearIcon = exports.SearchIcon = exports.ExpandCollapseIcon = exports.ScreenIcon = exports.MapPinIcon = exports.EmptyRadarIcon = void 0;
 exports.DiagnosticsIcon = exports.StackTraceIcon = exports.LayoutIcon = exports.ChipIcon = exports.SkullIcon = exports.ShieldAlertIcon = exports.CrashIcon = exports.UserCheckIcon = exports.TargetGoalIcon = exports.RepeatIcon = exports.PinIcon = exports.HourglassIcon = exports.FlameIcon = exports.CodeBracketsIcon = exports.AndroidIcon = exports.AppleIcon = exports.LinkChainIcon = exports.GitHubIcon = exports.PackageBoxIcon = exports.ExternalLinkIcon = exports.MoneyIcon = exports.CartIcon = exports.TextAaIcon = exports.BrainIcon = exports.AtomIcon = exports.MapIcon = exports.SparkleIcon = exports.LightbulbIcon = exports.DocIcon = exports.FolderOpenIcon = exports.BanIcon = exports.BoltIcon = exports.PerformanceIcon = exports.ReduxIcon = exports.MetadataIcon = exports.StorageIcon = exports.RefreshCcwIcon = exports.TimelineIcon = exports.LiveStateIcon = exports.BundleIcon = exports.ForwardChevronIcon = exports.PackageIcon = exports.TableIcon = exports.RawIcon = exports.PrettyIcon = exports.SortIcon = exports.MotionIcon = exports.TrendingUpIcon = exports.ErrorCircleIcon = exports.WarningTriangleIcon = void 0;
-exports.QrCodeIcon = exports.LockIcon = exports.PlusIcon = exports.PencilIcon = exports.DatabaseIcon = exports.ShieldCheckIcon = exports.WifiIcon = exports.CpuIcon = exports.ChevronDownIcon = exports.ResetIcon = exports.NpmIcon = exports.TagIcon = exports.BugIcon = exports.AlertTriangleIcon = exports.SmartphoneIcon = exports.KeyIcon = exports.BarChartIcon = exports.DiceIcon = exports.ZapIcon = exports.FlaskIcon = exports.LoadingSpinnerIcon = exports.ListenerIcon = exports.AllFramesIcon = exports.AppFramesIcon = exports.RawJsonIcon = exports.TrailIcon = void 0;
+exports.TurtleIcon = exports.RocketIcon = exports.UnlockIcon = exports.QrCodeIcon = exports.LockIcon = exports.PlusIcon = exports.PencilIcon = exports.DatabaseIcon = exports.ShieldCheckIcon = exports.WifiIcon = exports.CpuIcon = exports.ChevronDownIcon = exports.ResetIcon = exports.NpmIcon = exports.TagIcon = exports.BugIcon = exports.AlertTriangleIcon = exports.SmartphoneIcon = exports.KeyIcon = exports.BarChartIcon = exports.DiceIcon = exports.ZapIcon = exports.FlaskIcon = exports.LoadingSpinnerIcon = exports.ListenerIcon = exports.AllFramesIcon = exports.AppFramesIcon = exports.RawJsonIcon = exports.TrailIcon = void 0;
 const react_1 = __importDefault(require("react"));
 const react_native_svg_1 = __importStar(require("react-native-svg"));
 const AppColors_1 = require("../styles/AppColors");
@@ -236,9 +236,16 @@ const SortArrowIcon = ({ color = AppColors_1.AppColors.primaryLight, size = 20,
     </react_native_svg_1.default>);
 };
 exports.SortArrowIcon = SortArrowIcon;
-const ChevronIcon = ({ color = AppColors_1.AppColors.grayTextWeak, size = 14, }) => {
+const ChevronIcon = ({ color = AppColors_1.AppColors.grayTextWeak, size = 14, direction = 'down', }) => {
+    let path = 'M6 9l6 6 6-6';
+    if (direction === 'up')
+        path = 'M18 15l-6-6-6 6';
+    else if (direction === 'right')
+        path = 'M9 18l6-6-6-6';
+    else if (direction === 'left')
+        path = 'M15 18l-6-6 6-6';
     return (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
-      <react_native_svg_1.Path d="M6 9l6 6 6-6" stroke={color} strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round"/>
+      <react_native_svg_1.Path d={path} stroke={color} strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round"/>
     </react_native_svg_1.default>);
 };
 exports.ChevronIcon = ChevronIcon;
@@ -906,3 +913,19 @@ const QrCodeIcon = ({ color = AppColors_1.AppColors.grayTextWeak, size = 14, })
     <react_native_svg_1.Path d="M14 14h3v3h-3zM18 18h3v3h-3zM14 19h3v2h-3zM19 14h2v3h-2z" fill={color}/>
   </react_native_svg_1.default>);
 exports.QrCodeIcon = QrCodeIcon;
+const UnlockIcon = ({ color = AppColors_1.AppColors.grayTextWeak, size = 14, }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+    <react_native_svg_1.Rect x="3" y="11" width="18" height="11" rx="2" ry="2" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
+    <react_native_svg_1.Path d="M7 11V7a5 5 0 0 1 9.9-1" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
+  </react_native_svg_1.default>);
+exports.UnlockIcon = UnlockIcon;
+const RocketIcon = ({ color = AppColors_1.AppColors.grayTextWeak, size = 14, }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+    <react_native_svg_1.Path d="M4.5 16.5c-1.5 1.26-2 5-2 5s3.74-.5 5-2c.71-.84.7-2.13-.09-2.91a2.18 2.18 0 0 0-2.91-.09zM12 15l-3-3a22 22 0 0 1 2-3.95A12.88 12.88 0 0 1 22 2c0 2.72-.78 7.5-6.05 11a22.35 22.35 0 0 1-3.95 2z" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
+    <react_native_svg_1.Path d="M9 12l-4 4M15 6l-3 3" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
+  </react_native_svg_1.default>);
+exports.RocketIcon = RocketIcon;
+const TurtleIcon = ({ color = AppColors_1.AppColors.grayTextWeak, size = 14, }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+    <react_native_svg_1.Ellipse cx="12" cy="14" rx="7" ry="5" stroke={color} strokeWidth="2"/>
+    <react_native_svg_1.Circle cx="12" cy="6" r="3" stroke={color} strokeWidth="2"/>
+    <react_native_svg_1.Path d="M5 12l-2-2M19 12l2-2M6 18l-2 2M18 18l2 2" stroke={color} strokeWidth="2" strokeLinecap="round"/>
+  </react_native_svg_1.default>);
+exports.TurtleIcon = TurtleIcon;

package/dist/commonjs/components/QRCodeView.js

@@ -39,24 +39,27 @@ const react_native_1 = require("react-native");
 const react_native_svg_1 = __importStar(require("react-native-svg"));
 const qrGenerator_1 = require("../helpers/qrGenerator");
 const AppColors_1 = require("../styles/AppColors");
-const QRCodeView = ({ value, size = 180, color = AppColors_1.AppColors.primaryBlack, backgroundColor = AppColors_1.AppColors.white, }) => {
-    const matrix = (0, react_1.useMemo)(() => (0, qrGenerator_1.generateQRMatrix)(value), [value]);
-    const numCells = matrix.length;
-    const cellSize = size / numCells;
+const QRCodeView = ({ value, size = 200, color = '#000000', backgroundColor = '#FFFFFF', }) => {
+    const matrix = (0, react_1.useMemo)(() => (0, qrGenerator_1.generateQRMatrix)(value || 'http://localhost:8081'), [value]);
+    const numCells = matrix.length || 21;
+    const margin = 3;
+    const totalCells = numCells + margin * 2;
+    const cellSize = size / totalCells;
     return (<react_native_1.View style={[
             styles.container,
             {
-                width: size + 16,
-                height: size + 16,
+                width: size + 20,
+                height: size + 20,
                 backgroundColor,
             },
         ]}>
       <react_native_svg_1.default width={size} height={size} viewBox={`0 0 ${size} ${size}`}>
+        <react_native_svg_1.Rect width={size} height={size} fill={backgroundColor}/>
         <react_native_svg_1.G>
           {matrix.map((row, r) => row.map((cell, c) => {
             if (!cell)
                 return null;
-            return (<react_native_svg_1.Rect key={`${r}-${c}`} x={c * cellSize} y={r * cellSize} width={cellSize + 0.2} height={cellSize + 0.2} fill={color}/>);
+            return (<react_native_svg_1.Rect key={`${r}-${c}`} x={(c + margin) * cellSize} y={(r + margin) * cellSize} width={cellSize + 0.3} height={cellSize + 0.3} fill={color}/>);
         }))}
         </react_native_svg_1.G>
       </react_native_svg_1.default>
@@ -65,15 +68,15 @@ const QRCodeView = ({ value, size = 180, color = AppColors_1.AppColors.primaryBl
 exports.QRCodeView = QRCodeView;
 const styles = react_native_1.StyleSheet.create({
     container: {
-        padding: 8,
+        padding: 10,
         borderRadius: 14,
         alignItems: 'center',
         justifyContent: 'center',
         shadowColor: AppColors_1.AppColors.black,
-        shadowOffset: { width: 0, height: 2 },
-        shadowOpacity: 0.1,
-        shadowRadius: 6,
-        elevation: 3,
+        shadowOffset: { width: 0, height: 3 },
+        shadowOpacity: 0.15,
+        shadowRadius: 8,
+        elevation: 4,
     },
 });
 exports.default = exports.QRCodeView;

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

@@ -1,3 +1,3 @@
-export declare const ENC_MID = "df8ace0290a695bd05986213";
-export declare const ENC_SEC = "db93cb0186b1f7bb0ba63a0d0a64997586849455ce37";
-export declare const TELEMETRY_SALT = "rn-inapp-inspector-telemetry-v1";
+export declare const ENC_MID = "";
+export declare const ENC_SEC = "";
+export declare const TELEMETRY_SALT = "";

package/dist/commonjs/constants/telemetryConfig.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TELEMETRY_SALT = exports.ENC_SEC = exports.ENC_MID = void 0;
-exports.ENC_MID = 'df8ace0290a695bd05986213';
-exports.ENC_SEC = 'db93cb0186b1f7bb0ba63a0d0a64997586849455ce37';
-exports.TELEMETRY_SALT = 'rn-inapp-inspector-telemetry-v1';
+exports.ENC_MID = '';
+exports.ENC_SEC = '';
+exports.TELEMETRY_SALT = '';

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

@@ -1 +1 @@
-export declare const LIB_VERSION = "2.3.11";
+export declare const LIB_VERSION = "2.3.13";

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.11';
+exports.LIB_VERSION = '2.3.13';

package/dist/commonjs/helpers/qrGenerator.js

@@ -1,170 +1,44 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.generateQRMatrix = generateQRMatrix;
+const qrcode_generator_1 = __importDefault(require("qrcode-generator"));
 function generateQRMatrix(text, ecc = 'M') {
     try {
-        return createQRMatrix(text, ecc);
-    }
-    catch {
-        return createFallbackMatrix(text);
-    }
-}
-function createQRMatrix(data, ecc) {
-    const length = data.length;
-    let version = 1;
-    if (length > 14)
-        version = 2;
-    if (length > 26)
-        version = 3;
-    if (length > 42)
-        version = 4;
-    if (length > 62)
-        version = 5;
-    if (length > 84)
-        version = 6;
-    if (length > 106)
-        version = 7;
-    if (length > 122)
-        version = 8;
-    if (length > 152)
-        version = 9;
-    if (length > 180)
-        version = 10;
-    const size = version * 4 + 17;
-    const matrix = Array(size)
-        .fill(null)
-        .map(() => Array(size).fill(null));
-    addFinderPattern(matrix, 0, 0);
-    addFinderPattern(matrix, size - 7, 0);
-    addFinderPattern(matrix, 0, size - 7);
-    for (let i = 8; i < size - 8; i++) {
-        const val = i % 2 === 0;
-        if (matrix[6][i] === null)
-            matrix[6][i] = val;
-        if (matrix[i][6] === null)
-            matrix[i][6] = val;
-    }
-    if (version >= 2) {
-        const pos = getAlignmentPositions(version);
-        for (const r of pos) {
-            for (const c of pos) {
-                if (matrix[r][c] === null) {
-                    addAlignmentPattern(matrix, r - 2, c - 2);
-                }
+        const qr = (0, qrcode_generator_1.default)(0, ecc);
+        qr.addData(text);
+        qr.make();
+        const count = qr.getModuleCount();
+        const matrix = [];
+        for (let row = 0; row < count; row++) {
+            const rowData = [];
+            for (let col = 0; col < count; col++) {
+                rowData.push(qr.isDark(row, col));
             }
+            matrix.push(rowData);
         }
-    }
-    const bits = [];
-    bits.push(false, true, false, false);
-    for (let i = 7; i >= 0; i--) {
-        bits.push(((length >> i) & 1) === 1);
-    }
-    for (let i = 0; i < length; i++) {
-        const code = data.charCodeAt(i);
-        for (let b = 7; b >= 0; b--) {
-            bits.push(((code >> b) & 1) === 1);
-        }
-    }
-    for (let i = 0; i < 4 && bits.length % 8 !== 0; i++) {
-        bits.push(false);
-    }
-    while (bits.length % 8 !== 0) {
-        bits.push(false);
-    }
-    const padBytes = [0xec, 0x11];
-    let padIdx = 0;
-    const totalDataBits = size * size * 0.6;
-    while (bits.length < totalDataBits) {
-        const b = padBytes[padIdx % 2];
-        padIdx++;
-        for (let bit = 7; bit >= 0; bit--) {
-            bits.push(((b >> bit) & 1) === 1);
-        }
-    }
-    let bitIdx = 0;
-    let upwards = true;
-    for (let col = size - 1; col > 0; col -= 2) {
-        if (col === 6)
-            col--;
-        const rows = upwards
-            ? Array.from({ length: size }, (_, i) => size - 1 - i)
-            : Array.from({ length: size }, (_, i) => i);
-        for (const row of rows) {
-            for (const c of [col, col - 1]) {
-                if (matrix[row][c] === null) {
-                    const bit = bitIdx < bits.length ? bits[bitIdx++] : false;
-                    const mask = (row + c) % 2 === 0;
-                    matrix[row][c] = bit !== mask;
+        return matrix;
+    }
+    catch (err) {
+        try {
+            const qr = (0, qrcode_generator_1.default)(10, ecc);
+            qr.addData(text);
+            qr.make();
+            const count = qr.getModuleCount();
+            const matrix = [];
+            for (let row = 0; row < count; row++) {
+                const rowData = [];
+                for (let col = 0; col < count; col++) {
+                    rowData.push(qr.isDark(row, col));
                 }
+                matrix.push(rowData);
             }
+            return matrix;
         }
-        upwards = !upwards;
-    }
-    return matrix.map(row => row.map(cell => cell ?? false));
-}
-function addFinderPattern(matrix, row, col) {
-    for (let r = -1; r <= 7; r++) {
-        for (let c = -1; c <= 7; c++) {
-            const mr = row + r;
-            const mc = col + c;
-            if (mr >= 0 && mr < matrix.length && mc >= 0 && mc < matrix.length) {
-                if ((r >= 0 && r <= 6 && (c === 0 || c === 6)) ||
-                    (c >= 0 && c <= 6 && (r === 0 || r === 6)) ||
-                    (r >= 2 && r <= 4 && c >= 2 && c <= 4)) {
-                    matrix[mr][mc] = true;
-                }
-                else if (r >= 0 && r <= 6 && c >= 0 && c <= 6) {
-                    matrix[mr][mc] = false;
-                }
-                else {
-                    matrix[mr][mc] = false;
-                }
-            }
+        catch {
+            return [];
         }
     }
 }
-function addAlignmentPattern(matrix, row, col) {
-    for (let r = 0; r < 5; r++) {
-        for (let c = 0; c < 5; c++) {
-            const isOuter = r === 0 || r === 4 || c === 0 || c === 4;
-            const isCenter = r === 2 && c === 2;
-            matrix[row + r][col + c] = isOuter || isCenter;
-        }
-    }
-}
-function getAlignmentPositions(version) {
-    if (version === 1)
-        return [];
-    if (version === 2)
-        return [6, 18];
-    if (version === 3)
-        return [6, 22];
-    if (version === 4)
-        return [6, 26];
-    if (version === 5)
-        return [6, 30];
-    if (version === 6)
-        return [6, 34];
-    if (version === 7)
-        return [6, 22, 38];
-    if (version === 8)
-        return [6, 24, 42];
-    if (version === 9)
-        return [6, 26, 46];
-    return [6, 28, 50];
-}
-function createFallbackMatrix(text) {
-    const size = 25;
-    const matrix = Array(size)
-        .fill(false)
-        .map(() => Array(size).fill(false));
-    addFinderPattern(matrix, 0, 0);
-    addFinderPattern(matrix, size - 7, 0);
-    addFinderPattern(matrix, 0, size - 7);
-    for (let i = 0; i < text.length; i++) {
-        const r = (i * 3) % (size - 10) + 8;
-        const c = (i * 7) % (size - 10) + 8;
-        matrix[r][c] = true;
-    }
-    return matrix;
-}