react-native-inapp-inspector 1.1.21 → 1.1.23

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

@@ -370,7 +370,7 @@ const reduxDetailStyles = react_native_1.StyleSheet.create({
         paddingVertical: 2,
         borderRadius: 4,
         borderWidth: 1,
-        borderColor: '#A7F3D0',
+        borderColor: AppColors_1.AppColors.emeraldBorder,
     },
     persistedChipText: {
         fontFamily: AppFonts_1.AppFonts.interBold,
@@ -541,7 +541,7 @@ const reduxDetailStyles = react_native_1.StyleSheet.create({
         alignItems: 'center',
         justifyContent: 'center',
         gap: 6,
-        backgroundColor: '#FEF2F2',
+        backgroundColor: AppColors_1.AppColors.errorCardBg,
         borderWidth: 1,
         borderColor: '#FEE2E2',
         borderRadius: 8,

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

@@ -221,9 +221,12 @@ const ReduxTab = react_1.default.memo(() => {
           <react_native_1.Text style={reduxTabStyles.resultCount}>
             Showing {filteredSlices.length} of {sliceItems.length} state slices
           </react_native_1.Text>
-          <react_native_1.Text style={reduxTabStyles.sortLabel}>
-            {sortMode === 'latest' ? '⚡ Newest Updates First' : '🔤 Alphabetical (A-Z)'}
-          </react_native_1.Text>
+          <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 4 }}>
+            {sortMode === 'latest' ? (<NetworkIcons_1.BoltIcon color={AppColors_1.AppColors.brandPurple} size={11}/>) : (<NetworkIcons_1.TextAaIcon color={AppColors_1.AppColors.brandPurple} size={11}/>)}
+            <react_native_1.Text style={reduxTabStyles.sortLabel}>
+              {sortMode === 'latest' ? 'Newest Updates First' : 'Alphabetical (A-Z)'}
+            </react_native_1.Text>
+          </react_native_1.View>
         </react_native_1.View>
       </react_native_1.View>
 
@@ -409,18 +412,18 @@ const reduxTabStyles = react_native_1.StyleSheet.create({
         flexDirection: 'row',
         alignItems: 'center',
         gap: 4,
-        backgroundColor: '#ECFDF5',
+        backgroundColor: AppColors_1.AppColors.emeraldBg,
         paddingHorizontal: 6,
         paddingVertical: 3,
         borderRadius: 5,
         borderWidth: 1,
-        borderColor: '#A7F3D0',
+        borderColor: AppColors_1.AppColors.emeraldBorder,
     },
     liveDot: {
         width: 6,
         height: 6,
         borderRadius: 3,
-        backgroundColor: '#10B981',
+        backgroundColor: AppColors_1.AppColors.emerald500,
     },
     livePillText: {
         fontFamily: AppFonts_1.AppFonts.interBold,

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

@@ -66,3 +66,15 @@ export declare const StorageIcon: ({ color, size, }: any) => React.JSX.Element;
 export declare const MetadataIcon: ({ color, size, }: any) => React.JSX.Element;
 export declare const ReduxIcon: ({ color, size, }: any) => React.JSX.Element;
 export declare const PerformanceIcon: ({ color, size, }: any) => React.JSX.Element;
+export declare const BoltIcon: ({ color, size }: any) => React.JSX.Element;
+export declare const BanIcon: ({ color, size }: any) => React.JSX.Element;
+export declare const FolderOpenIcon: ({ color, size }: any) => React.JSX.Element;
+export declare const DocIcon: ({ color, size }: any) => React.JSX.Element;
+export declare const LightbulbIcon: ({ color, size }: any) => React.JSX.Element;
+export declare const SparkleIcon: ({ color, size }: any) => React.JSX.Element;
+export declare const MapIcon: ({ color, size }: any) => React.JSX.Element;
+export declare const AtomIcon: ({ color, size }: any) => React.JSX.Element;
+export declare const BrainIcon: ({ color, size }: any) => React.JSX.Element;
+export declare const TextAaIcon: ({ color, size }: any) => React.JSX.Element;
+export declare const CartIcon: ({ color, size }: any) => React.JSX.Element;
+export declare const MoneyIcon: ({ color, size }: any) => React.JSX.Element;

package/dist/commonjs/components/NetworkIcons.js

@@ -37,7 +37,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.PerformanceIcon = exports.ReduxIcon = exports.MetadataIcon = exports.StorageIcon = 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.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.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;
 const react_1 = __importDefault(require("react"));
 const react_native_svg_1 = __importStar(require("react-native-svg"));
 // Stylesheet
@@ -508,3 +508,94 @@ const PerformanceIcon = ({ color = AppColors_1.AppColors.purple, size = 14, }) =
     </react_native_svg_1.default>);
 };
 exports.PerformanceIcon = PerformanceIcon;
+// ─── App-wide Vector Icons (emoji-free, render on every device) ─────────────
+const BoltIcon = ({ color = AppColors_1.AppColors.amber500, size = 14 }) => {
+    return (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+      <react_native_svg_1.Path d="M13 2 4.5 13.5 H10.5 L9 22 19.5 9.5 H13.5 Z" stroke={color} strokeWidth="1.8" strokeLinejoin="round"/>
+    </react_native_svg_1.default>);
+};
+exports.BoltIcon = BoltIcon;
+const BanIcon = ({ color = AppColors_1.AppColors.errorColor, size = 14 }) => {
+    return (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+      <react_native_svg_1.Circle cx="12" cy="12" r="8.5" stroke={color} strokeWidth="1.8"/>
+      <react_native_svg_1.Path d="M5.5 5.5 18.5 18.5" stroke={color} strokeWidth="1.8" strokeLinecap="round"/>
+    </react_native_svg_1.default>);
+};
+exports.BanIcon = BanIcon;
+const FolderOpenIcon = ({ color = AppColors_1.AppColors.amber500, size = 14 }) => {
+    return (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+      <react_native_svg_1.Path d="M8.4 11 10 5.5a2 2 0 0 1 1.9-1.5h3.7a1.5 1.5 0 0 1 1.4 2L15.5 11" stroke={color} strokeWidth="1.8" strokeLinejoin="round"/>
+      <react_native_svg_1.Path d="M6.7 20.4 4.3 12.9A1.6 1.6 0 0 1 5.8 11h14.6a1.6 1.6 0 0 1 1.6 1.9l-2.4 7.5a2 2 0 0 1-2 1.4H8.7a2 2 0 0 1-2-1.4Z" stroke={color} strokeWidth="1.8" strokeLinejoin="round"/>
+    </react_native_svg_1.default>);
+};
+exports.FolderOpenIcon = FolderOpenIcon;
+const DocIcon = ({ color = AppColors_1.AppColors.grayTextWeak, size = 14 }) => {
+    return (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+      <react_native_svg_1.Path d="M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" stroke={color} strokeWidth="1.8" strokeLinejoin="round"/>
+      <react_native_svg_1.Path d="M14 2v4a2 2 0 0 0 2 2h4" stroke={color} strokeWidth="1.8" strokeLinejoin="round"/>
+      <react_native_svg_1.Path d="M8 13h8 M8 17h8" stroke={color} strokeWidth="1.8" strokeLinecap="round"/>
+    </react_native_svg_1.default>);
+};
+exports.DocIcon = DocIcon;
+const LightbulbIcon = ({ color = AppColors_1.AppColors.amber500, size = 14 }) => {
+    return (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+      <react_native_svg_1.Path d="M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1.3.5 2.6 1.5 3.5.8.8 1.3 1.5 1.5 2.5" stroke={color} strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round"/>
+      <react_native_svg_1.Path d="M9 18h6" stroke={color} strokeWidth="1.8" strokeLinecap="round"/>
+      <react_native_svg_1.Path d="M10 22h4" stroke={color} strokeWidth="1.8" strokeLinecap="round"/>
+    </react_native_svg_1.default>);
+};
+exports.LightbulbIcon = LightbulbIcon;
+const SparkleIcon = ({ color = AppColors_1.AppColors.amber500, size = 14 }) => {
+    return (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+      <react_native_svg_1.Path d="M11.1 3.9c.2-.6 1-.6 1.2 0l1.2 4.2 4.2 1.2c.6.2.6 1 0 1.2l-4.2 1.2-1.2 4.2c-.2.6-1 .6-1.2 0l-1.2-4.2-4.2-1.2c-.6-.2-.6-1 0-1.2l4.2-1.2Z" fill={color}/>
+      <react_native_svg_1.Path d="M18.5 3.5v4 M16.5 5.5h4" stroke={color} strokeWidth="1.8" strokeLinecap="round"/>
+    </react_native_svg_1.default>);
+};
+exports.SparkleIcon = SparkleIcon;
+const MapIcon = ({ color = AppColors_1.AppColors.grayTextWeak, size = 14 }) => {
+    return (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+      <react_native_svg_1.Path d="M3 5.5 9 3.5l6 2 6-2v15l-6 2-6-2-6 2Z" stroke={color} strokeWidth="1.8" strokeLinejoin="round"/>
+      <react_native_svg_1.Path d="M9 3.5v15M15 5.5v15" stroke={color} strokeWidth="1.8"/>
+      <react_native_svg_1.Circle cx="12" cy="11" r="1.9" stroke={color} strokeWidth="1.6"/>
+    </react_native_svg_1.default>);
+};
+exports.MapIcon = MapIcon;
+const AtomIcon = ({ color = AppColors_1.AppColors.grayTextWeak, size = 14 }) => {
+    return (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+      <react_native_svg_1.Ellipse cx="12" cy="12" rx="9" ry="3.8" stroke={color} strokeWidth="1.6"/>
+      <react_native_svg_1.Ellipse cx="12" cy="12" rx="9" ry="3.8" stroke={color} strokeWidth="1.6" transform="rotate(60 12 12)"/>
+      <react_native_svg_1.Ellipse cx="12" cy="12" rx="9" ry="3.8" stroke={color} strokeWidth="1.6" transform="rotate(120 12 12)"/>
+      <react_native_svg_1.Circle cx="12" cy="12" r="1.6" fill={color}/>
+    </react_native_svg_1.default>);
+};
+exports.AtomIcon = AtomIcon;
+const BrainIcon = ({ color = AppColors_1.AppColors.grayTextWeak, size = 14 }) => {
+    return (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+      <react_native_svg_1.Path d="M9.5 2a2.5 2.5 0 0 0-2.5 2.5v.5a2.5 2.5 0 0 0-3 3.17A2.5 2.5 0 0 0 2 10.5c0 .76.34 1.44.88 1.9A2.5 2.5 0 0 0 2 15.5c0 .76.34 1.44.88 1.9A2.5 2.5 0 0 0 5 19.75c0 .75.5 1.5 1.25 1.75A2.5 2.5 0 0 0 8.5 23h.25a2.5 2.5 0 0 0 2.5-2.5V4a2.5 2.5 0 0 0-1.75-2ZM14.5 2a2.5 2.5 0 0 1 2.5 2.5v.5a2.5 2.5 0 0 1 3 3.17A2.5 2.5 0 0 1 22 10.5c0 .76-.34 1.44-.88 1.9a2.5 2.5 0 0 1 .88 1.9c0 .76-.34 1.44-.88 1.9A2.5 2.5 0 0 1 19 19.75c0 .75-.5 1.5-1.25 1.75A2.5 2.5 0 0 1 15.5 23h-.25a2.5 2.5 0 0 1-2.5-2.5V4a2.5 2.5 0 0 1 1.75-2Z" stroke={color} strokeWidth="1.6" strokeLinejoin="round"/>
+    </react_native_svg_1.default>);
+};
+exports.BrainIcon = BrainIcon;
+const TextAaIcon = ({ color = AppColors_1.AppColors.grayTextWeak, size = 14 }) => {
+    return (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+      <react_native_svg_1.Path d="M4 19 7.5 7 11 19" stroke={color} strokeWidth="1.8" strokeLinejoin="round"/>
+      <react_native_svg_1.Path d="M5.5 15h4" stroke={color} strokeWidth="1.8" strokeLinecap="round"/>
+      <react_native_svg_1.Path d="M16 19l1.7-6.6 1.7 6.6" stroke={color} strokeWidth="1.8" strokeLinejoin="round"/>
+      <react_native_svg_1.Path d="M16.9 15.8h1.6" stroke={color} strokeWidth="1.8" strokeLinecap="round"/>
+    </react_native_svg_1.default>);
+};
+exports.TextAaIcon = TextAaIcon;
+const CartIcon = ({ color = AppColors_1.AppColors.amber500, size = 14 }) => {
+    return (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+      <react_native_svg_1.Circle cx="9.5" cy="20" r="1.3" stroke={color} strokeWidth="1.8"/>
+      <react_native_svg_1.Circle cx="18.5" cy="20" r="1.3" stroke={color} strokeWidth="1.8"/>
+      <react_native_svg_1.Path d="M3 3.5h1.8a1 1 0 0 1 .97.75l3.1 9.75a1.5 1.5 0 0 0 1.44 1.1h9.2a1 1 0 0 0 .95-.7l2.5-7.5a.8.8 0 0 0-.75-1.05H7" stroke={color} strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round"/>
+    </react_native_svg_1.default>);
+};
+exports.CartIcon = CartIcon;
+const MoneyIcon = ({ color = AppColors_1.AppColors.emerald500, size = 14 }) => {
+    return (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+      <react_native_svg_1.Circle cx="12" cy="12" r="8.5" stroke={color} strokeWidth="1.8"/>
+      <react_native_svg_1.Path d="M12 7v10M14.5 9.5c-.6-1-1.5-1.5-2.5-1.5-1.5 0-2.5.9-2.5 2s1 1.8 2.5 2 2.5.8 2.5 2-1 2-2.5 2c-1 0-1.9-.5-2.5-1.5" stroke={color} strokeWidth="1.8" strokeLinecap="round"/>
+    </react_native_svg_1.default>);
+};
+exports.MoneyIcon = MoneyIcon;

package/dist/commonjs/components/TreeNode.js

@@ -81,7 +81,7 @@ const TreeNode = react_1.default.memo(function TreeNode({ data, name, level = 0,
         {name !== undefined && (<react_native_1.Text style={[styles_1.default.codeKey, { marginBottom: 4 }]}>{`"${String(name)}": `}</react_native_1.Text>)}
         <react_native_1.View style={styles_1.default.filePreviewCard}>
           {isImage ? (<react_native_1.Image source={{ uri: file.uri }} style={styles_1.default.filePreviewThumb} resizeMode="cover"/>) : (<react_native_1.View style={styles_1.default.filePreviewDoc}>
-              <react_native_1.Text style={{ fontSize: 20 }}>📄</react_native_1.Text>
+              <NetworkIcons_1.DocIcon color={AppColors_1.AppColors.grayTextWeak} size={20}/>
             </react_native_1.View>)}
           <react_native_1.View style={{ flex: 1 }}>
             <react_native_1.Text style={styles_1.default.filePreviewName} numberOfLines={1}>

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

@@ -1 +1 @@
-export declare const LIB_VERSION = "1.1.21";
+export declare const LIB_VERSION = "1.1.23";

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.21';
+exports.LIB_VERSION = '1.1.23';

package/dist/commonjs/customHooks/bundleAnalyzer.d.ts

@@ -0,0 +1,115 @@
+export type FileTypeCategory = 'image' | 'typescript' | 'javascript' | 'font' | 'json';
+export interface HostBundleFileItem {
+    id: string;
+    name: string;
+    path: string;
+    ext: string;
+    category: FileTypeCategory;
+    sizeKb: number;
+    meta: string;
+    color: string;
+    status?: 'optimal' | 'warning' | 'info';
+    advice?: string;
+    isConsumed?: boolean;
+    previewUri?: string;
+}
+export interface HostBundlePackageItem {
+    id: string;
+    name: string;
+    version: string;
+    latestVersion?: string;
+    sizeKb: number;
+    percentage: number;
+    type: 'direct' | 'peer' | 'transitive';
+    isDirectDefined?: boolean;
+    parentPackageName?: string;
+    subpackages?: HostBundlePackageItem[];
+    category: 'core' | 'navigation' | 'network' | 'ui' | 'utils';
+    color: string;
+    description: string;
+    npmUrl?: string;
+    isDeprecated?: boolean;
+    deprecationReason?: string;
+    lastActive?: string;
+}
+export interface HostBinaryComponentItem {
+    id: string;
+    name: string;
+    category: 'js' | 'native' | 'frameworks' | 'assets' | 'meta';
+    sizeMb: number;
+    pct: number;
+    color: string;
+    description: string;
+    advice: string;
+}
+export interface HostBundleAnalysisResult {
+    isLive: boolean;
+    scriptURL: string;
+    totalDevBytes: number;
+    totalDevMb: number;
+    totalDevKb: number;
+    isHermes: boolean;
+    moduleCount: number;
+    packageCount: number;
+    filesCount: number;
+    splitUp: {
+        appSource: {
+            kb: number;
+            mb: number;
+            pct: number;
+        };
+        nodeModules: {
+            kb: number;
+            mb: number;
+            pct: number;
+        };
+        assetsMedia: {
+            kb: number;
+            mb: number;
+            pct: number;
+        };
+        metroDevOverhead: {
+            kb: number;
+            mb: number;
+            pct: number;
+        };
+    };
+    files: HostBundleFileItem[];
+    packages: HostBundlePackageItem[];
+    production: {
+        ios: {
+            totalInstallMb: number;
+            totalDownloadMb: number;
+            compressionRatioPct: number;
+            components: HostBinaryComponentItem[];
+        };
+        androidAab: {
+            totalInstallMb: number;
+            totalDownloadMb: number;
+            compressionRatioPct: number;
+            components: HostBinaryComponentItem[];
+        };
+        androidApk: {
+            totalInstallMb: number;
+            totalDownloadMb: number;
+            compressionRatioPct: number;
+            components: HostBinaryComponentItem[];
+        };
+        android: {
+            totalInstallMb: number;
+            totalDownloadMb: number;
+            compressionRatioPct: number;
+            components: HostBinaryComponentItem[];
+        };
+    };
+}
+export declare const getHostScriptURL: () => string;
+/**
+ * Parses raw Metro bundle source code to discover real modules and packages in the host app.
+ */
+export declare const parseBundleSource: (bundleText: string, totalBytes: number, scriptURL: string) => HostBundleAnalysisResult;
+/**
+ * Automatically fetch and analyze the real running bundle for the host app.
+ */
+export declare const analyzeHostAppBundle: () => Promise<HostBundleAnalysisResult>;
+export declare const getCachedBundleAnalysis: () => HostBundleAnalysisResult | null;