react-native-inapp-inspector 2.3.10 → 2.3.11

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

@@ -57,6 +57,7 @@ const CrashTab_1 = __importDefault(require("./CrashTab"));
 const CrashDetail_1 = __importDefault(require("./CrashDetail"));
 const DeviceInfoTab_1 = __importDefault(require("./DeviceInfoTab"));
 const StorageTab_1 = __importDefault(require("./StorageTab"));
+const DebuggingTab_1 = __importDefault(require("./DebuggingTab"));
 const SettingsPanel_1 = __importDefault(require("./SettingsPanel"));
 const NpmUpdateToast_1 = __importDefault(require("./NpmUpdateToast"));
 const Toast_1 = __importDefault(require("../Toast"));
@@ -156,6 +157,7 @@ const MainScreen = () => {
                       {activeTab === 'crash' && <CrashTab_1.default />}
                       {activeTab === 'device' && <DeviceInfoTab_1.default />}
                       {activeTab === 'storage' && <StorageTab_1.default />}
+                      {activeTab === 'debugging' && <DebuggingTab_1.default />}
                     </react_native_1.Animated.View>
 
                     

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

@@ -135,6 +135,13 @@ const SettingsPanel = () => {
             icon: 'storage',
             desc: 'AsyncStorage & MMKV key-value store viewer with full CRUD support',
         },
+        {
+            key: 'debugging',
+            label: 'Multi-Device Debugging',
+            category: 'diagnostic',
+            icon: 'debugging',
+            desc: 'QR Code bridge for direct Debug APK download & Metro live-reload sync',
+        },
     ];
     const [stagedTabVisibility, setStagedTabVisibility] = (0, react_1.useState)(() => ({
         apis: true,
@@ -146,6 +153,7 @@ const SettingsPanel = () => {
         crash: Boolean(tabVisibility?.crash),
         device: Boolean(tabVisibility?.device),
         storage: Boolean(tabVisibility?.storage),
+        debugging: Boolean(tabVisibility?.debugging ?? true),
     }));
     (0, react_1.useEffect)(() => {
         setStagedTabVisibility({
@@ -158,6 +166,7 @@ const SettingsPanel = () => {
             crash: Boolean(tabVisibility?.crash),
             device: Boolean(tabVisibility?.device),
             storage: Boolean(tabVisibility?.storage),
+            debugging: Boolean(tabVisibility?.debugging ?? true),
         });
     }, [tabVisibility]);
     const hasUnsavedChanges = (0, react_1.useMemo)(() => {
@@ -545,6 +554,9 @@ const SettingsPanel = () => {
                           {moduleItem.icon === 'storage' && (<NetworkIcons_1.DatabaseIcon color={isChecked
                             ? AppColors_1.AppColors.purple
                             : AppColors_1.AppColors.grayTextWeak} size={16}/>)}
+                          {moduleItem.icon === 'debugging' && (<NetworkIcons_1.QrCodeIcon color={isChecked
+                            ? AppColors_1.AppColors.purple
+                            : AppColors_1.AppColors.grayTextWeak} size={16}/>)}
                         </react_native_1.View>
 
                         

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

@@ -73,8 +73,16 @@ const TabBar = react_1.default.memo(() => {
                 count: 0,
                 icon: 'storage',
             },
+            {
+                key: 'debugging',
+                label: 'Debugging',
+                count: 0,
+                icon: 'debugging',
+            },
         ]
             .filter(tab => {
+            if (tab.key === 'debugging')
+                return true;
             if (!tabVisibility?.[tab.key])
                 return false;
             if (tab.key === 'redux' && !isReduxAvail)
@@ -117,6 +125,7 @@ const TabBar = react_1.default.memo(() => {
                   {tab.icon === 'crash' && (<NetworkIcons_1.CrashIcon color={iconColor} size={14}/>)}
                   {tab.icon === 'device' && (<NetworkIcons_1.SmartphoneIcon color={iconColor} size={14}/>)}
                   {tab.icon === 'storage' && (<NetworkIcons_1.DatabaseIcon color={iconColor} size={14}/>)}
+                  {tab.icon === 'debugging' && (<NetworkIcons_1.QrCodeIcon color={iconColor} size={14}/>)}
                   <react_native_1.Text numberOfLines={1} ellipsizeMode="tail" style={[
                     styles_1.default.contentTabButtonText,
                     isActive &&

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

@@ -134,3 +134,4 @@ export declare const DatabaseIcon: ({ color, size, }: IconProps) => React.JSX.El
 export declare const PencilIcon: ({ color, size, }: IconProps) => React.JSX.Element;
 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;

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.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.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");
@@ -899,3 +899,10 @@ const LockIcon = ({ color = AppColors_1.AppColors.grayTextWeak, size = 14, }) =>
     <react_native_svg_1.Path d="M7 11V7a5 5 0 0 1 10 0v4" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
   </react_native_svg_1.default>);
 exports.LockIcon = LockIcon;
+const QrCodeIcon = ({ 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="3" width="7" height="7" rx="1.5" stroke={color} strokeWidth="2"/>
+    <react_native_svg_1.Rect x="14" y="3" width="7" height="7" rx="1.5" stroke={color} strokeWidth="2"/>
+    <react_native_svg_1.Rect x="3" y="14" width="7" height="7" rx="1.5" stroke={color} strokeWidth="2"/>
+    <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;

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

@@ -0,0 +1,9 @@
+import React from 'react';
+interface QRCodeViewProps {
+    value: string;
+    size?: number;
+    color?: string;
+    backgroundColor?: string;
+}
+export declare const QRCodeView: React.FC<QRCodeViewProps>;
+export default QRCodeView;

package/dist/commonjs/components/QRCodeView.js

@@ -0,0 +1,79 @@
+"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 });
+exports.QRCodeView = void 0;
+const react_1 = __importStar(require("react"));
+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;
+    return (<react_native_1.View style={[
+            styles.container,
+            {
+                width: size + 16,
+                height: size + 16,
+                backgroundColor,
+            },
+        ]}>
+      <react_native_svg_1.default width={size} height={size} viewBox={`0 0 ${size} ${size}`}>
+        <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}/>);
+        }))}
+        </react_native_svg_1.G>
+      </react_native_svg_1.default>
+    </react_native_1.View>);
+};
+exports.QRCodeView = QRCodeView;
+const styles = react_native_1.StyleSheet.create({
+    container: {
+        padding: 8,
+        borderRadius: 14,
+        alignItems: 'center',
+        justifyContent: 'center',
+        shadowColor: AppColors_1.AppColors.black,
+        shadowOffset: { width: 0, height: 2 },
+        shadowOpacity: 0.1,
+        shadowRadius: 6,
+        elevation: 3,
+    },
+});
+exports.default = exports.QRCodeView;

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

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

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.10';
+exports.LIB_VERSION = '2.3.11';

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

@@ -0,0 +1,2 @@
+export type QRECC = 'L' | 'M' | 'Q' | 'H';
+export declare function generateQRMatrix(text: string, ecc?: QRECC): boolean[][];

package/dist/commonjs/helpers/qrGenerator.js

@@ -0,0 +1,170 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.generateQRMatrix = generateQRMatrix;
+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 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;
+                }
+            }
+        }
+        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;
+                }
+            }
+        }
+    }
+}
+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;
+}

package/dist/commonjs/index.js

@@ -209,6 +209,7 @@ const NetworkInspector = ({ enabled = true, storage, navigationRef, appIcon, env
         crash: false,
         device: false,
         storage: false,
+        debugging: true,
     });
     const [maxNetworkLogs, setMaxNetworkLogs] = (0, react_1.useState)(100);
     const [maxAnalyticsEventsLimit, setMaxAnalyticsEventsLimit] = (0, react_1.useState)(75);
@@ -262,6 +263,7 @@ const NetworkInspector = ({ enabled = true, storage, navigationRef, appIcon, env
             crash: false,
             device: false,
             storage: false,
+            debugging: true,
         });
         setDefaultTab('apis');
         setIsAutoRamLimitEnabled(true);

package/dist/commonjs/types/enums.d.ts

@@ -8,6 +8,7 @@ export declare const ActiveTab: {
     readonly Crash: "crash";
     readonly Device: "device";
     readonly Storage: "storage";
+    readonly Debugging: "debugging";
 };
 export type ActiveTab = (typeof ActiveTab)[keyof typeof ActiveTab];
 export declare const Method: {
@@ -59,6 +60,7 @@ export declare const SettingsPage: {
     readonly Crash: "crash";
     readonly Device: "device";
     readonly Storage: "storage";
+    readonly Debugging: "debugging";
 };
 export type SettingsPage = (typeof SettingsPage)[keyof typeof SettingsPage] | null;
 export declare const SettingsSubTab: {

package/dist/commonjs/types/enums.js

@@ -11,6 +11,7 @@ exports.ActiveTab = {
     Crash: 'crash',
     Device: 'device',
     Storage: 'storage',
+    Debugging: 'debugging',
 };
 exports.Method = {
     All: 'ALL',
@@ -56,6 +57,7 @@ exports.SettingsPage = {
     Crash: 'crash',
     Device: 'device',
     Storage: 'storage',
+    Debugging: 'debugging',
 };
 exports.SettingsSubTab = {
     Module: 'module',

package/dist/esm/components/Inspector/DebuggingTab.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const DebuggingTab: React.FC;
+export default DebuggingTab;