react-native-inapp-inspector 2.0.4 → 2.0.6

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

@@ -0,0 +1,469 @@
+"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.UpdateAvailableModal = 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 BrandSquareIcon_1 = require("../BrandSquareIcon");
+const NetworkIcons_1 = require("../NetworkIcons");
+const constants_1 = require("../../constants");
+const helpers_1 = require("../../helpers");
+const toast_1 = require("../../helpers/toast");
+// ─── Crisp SVG Icons ─────────────────────────────────────────────────────────
+const CopySvg = ({ size = 14, color = '#64748B' }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+    <react_native_svg_1.Path d="M8 4v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2h-8a2 2 0 0 0-2 2z" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
+    <react_native_svg_1.Path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
+  </react_native_svg_1.default>);
+const CheckSvg = ({ size = 14, color = '#10B981' }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+    <react_native_svg_1.Path d="M20 6L9 17l-5-5" stroke={color} strokeWidth="2.4" strokeLinecap="round" strokeLinejoin="round"/>
+  </react_native_svg_1.default>);
+const ExternalLinkSvg = ({ size = 13, color = '#FFFFFF' }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+    <react_native_svg_1.Path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
+    <react_native_svg_1.Path d="M15 3h6v6" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
+    <react_native_svg_1.Path d="M10 14L21 3" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
+  </react_native_svg_1.default>);
+const CloseSvg = ({ size = 13, color = '#64748B' }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+    <react_native_svg_1.Path d="M18 6L6 18M6 6l12 12" stroke={color} strokeWidth="2.2" strokeLinecap="round" strokeLinejoin="round"/>
+  </react_native_svg_1.default>);
+const SparkleSvg = ({ size = 14, color = '#F59E0B' }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+    <react_native_svg_1.Path d="M12 2l2.4 6.6L21 11l-6.6 2.4L12 20l-2.4-6.6L3 11l6.6-2.4L12 2z" fill={color}/>
+  </react_native_svg_1.default>);
+const UpdateAvailableModal = ({ visible, latestVersion, onClose, }) => {
+    const [copied, setCopied] = (0, react_1.useState)(false);
+    const fadeAnim = (0, react_1.useState)(new react_native_1.Animated.Value(0))[0];
+    const scaleAnim = (0, react_1.useState)(new react_native_1.Animated.Value(0.92))[0];
+    const installCommand = `npm install react-native-inapp-inspector@latest`;
+    (0, react_1.useEffect)(() => {
+        if (visible) {
+            setCopied(false);
+            react_native_1.Animated.parallel([
+                react_native_1.Animated.timing(fadeAnim, {
+                    toValue: 1,
+                    duration: 220,
+                    useNativeDriver: true,
+                }),
+                react_native_1.Animated.spring(scaleAnim, {
+                    toValue: 1,
+                    friction: 8,
+                    tension: 50,
+                    useNativeDriver: true,
+                }),
+            ]).start();
+        }
+    }, [visible, fadeAnim, scaleAnim]);
+    const handleClose = () => {
+        react_native_1.Animated.parallel([
+            react_native_1.Animated.timing(fadeAnim, {
+                toValue: 0,
+                duration: 160,
+                useNativeDriver: true,
+            }),
+            react_native_1.Animated.timing(scaleAnim, {
+                toValue: 0.92,
+                duration: 160,
+                useNativeDriver: true,
+            }),
+        ]).start(() => {
+            onClose();
+        });
+    };
+    const handleCopyCommand = () => {
+        (0, helpers_1.copyToClipboard)(installCommand, 'Install Command');
+        setCopied(true);
+        (0, toast_1.showToast)('Copied npm install command to clipboard!');
+        setTimeout(() => {
+            setCopied(false);
+        }, 2500);
+    };
+    const handleOpenNpm = () => {
+        react_native_1.Linking.openURL('https://www.npmjs.com/package/react-native-inapp-inspector').catch(() => { });
+        handleClose();
+    };
+    if (!visible)
+        return null;
+    return (<react_native_1.Modal transparent visible={visible} animationType="none" statusBarTranslucent onRequestClose={handleClose}>
+      <react_native_1.View style={styles.overlay}>
+        <react_native_1.Animated.View style={[
+            styles.card,
+            {
+                opacity: fadeAnim,
+                transform: [{ scale: scaleAnim }],
+            },
+        ]}>
+          {/* Top-Right Dismiss Button */}
+          <react_native_1.TouchableOpacity style={styles.topCloseButton} onPress={handleClose} hitSlop={10} activeOpacity={0.7}>
+            <CloseSvg size={13} color="#64748B"/>
+          </react_native_1.TouchableOpacity>
+
+          {/* Header section with brand square icon & sparkle */}
+          <react_native_1.View style={styles.headerSection}>
+            <react_native_1.View style={styles.iconHaloRing}>
+              <BrandSquareIcon_1.BrandSquareIcon size={52}/>
+              <react_native_1.View style={styles.sparkleBadge}>
+                <SparkleSvg size={13} color="#F59E0B"/>
+              </react_native_1.View>
+            </react_native_1.View>
+
+            <react_native_1.Text style={styles.title}>Update Available</react_native_1.Text>
+            <react_native_1.Text style={styles.subtitle}>
+              A newer release of react-native-inapp-inspector is ready
+            </react_native_1.Text>
+          </react_native_1.View>
+
+          {/* Version Comparison Card */}
+          <react_native_1.View style={styles.versionComparisonCard}>
+            <react_native_1.View style={styles.versionColumn}>
+              <react_native_1.Text style={styles.versionLabel}>INSTALLED</react_native_1.Text>
+              <react_native_1.View style={styles.installedChip}>
+                <react_native_1.Text style={styles.installedText}>v{constants_1.LIB_VERSION}</react_native_1.Text>
+              </react_native_1.View>
+            </react_native_1.View>
+
+            <react_native_1.View style={styles.arrowContainer}>
+              <react_native_1.Text style={styles.arrowText}>➔</react_native_1.Text>
+            </react_native_1.View>
+
+            <react_native_1.View style={styles.versionColumn}>
+              <react_native_1.Text style={styles.versionLabel}>LATEST ON NPM</react_native_1.Text>
+              <react_native_1.View style={styles.latestChip}>
+                <NetworkIcons_1.NpmIcon size={12} color="#CB3837"/>
+                <react_native_1.Text style={styles.latestText}>v{latestVersion || 'latest'}</react_native_1.Text>
+              </react_native_1.View>
+            </react_native_1.View>
+          </react_native_1.View>
+
+          {/* Quick Install Snippet Box */}
+          <react_native_1.View style={styles.codeSnippetBox}>
+            <react_native_1.View style={styles.codeSnippetHeader}>
+              <react_native_1.Text style={styles.codeSnippetLabel}>UPGRADE COMMAND</react_native_1.Text>
+              {copied && (<react_native_1.View style={styles.copiedIndicator}>
+                  <CheckSvg size={11} color="#10B981"/>
+                  <react_native_1.Text style={styles.copiedText}>Copied</react_native_1.Text>
+                </react_native_1.View>)}
+            </react_native_1.View>
+
+            <react_native_1.TouchableOpacity style={styles.commandRow} onPress={handleCopyCommand} activeOpacity={0.75}>
+              <react_native_1.Text style={styles.commandText} numberOfLines={1}>
+                {installCommand}
+              </react_native_1.Text>
+              <react_native_1.View style={styles.copyIconWrapper}>
+                {copied ? <CheckSvg size={14} color="#10B981"/> : <CopySvg size={14} color="#64748B"/>}
+              </react_native_1.View>
+            </react_native_1.TouchableOpacity>
+          </react_native_1.View>
+
+          {/* Action Buttons */}
+          <react_native_1.View style={styles.buttonRow}>
+            <react_native_1.TouchableOpacity style={styles.secondaryButton} onPress={handleClose} activeOpacity={0.7}>
+              <react_native_1.Text style={styles.secondaryButtonText}>Later</react_native_1.Text>
+            </react_native_1.TouchableOpacity>
+
+            <react_native_1.TouchableOpacity style={styles.primaryButton} onPress={handleOpenNpm} activeOpacity={0.85}>
+              <react_native_1.Text style={styles.primaryButtonText}>View on NPM</react_native_1.Text>
+              <ExternalLinkSvg size={12} color="#FFFFFF"/>
+            </react_native_1.TouchableOpacity>
+          </react_native_1.View>
+        </react_native_1.Animated.View>
+      </react_native_1.View>
+    </react_native_1.Modal>);
+};
+exports.UpdateAvailableModal = UpdateAvailableModal;
+const fontStack = react_native_1.Platform.select({
+    ios: {
+        fontFamily: 'System',
+    },
+    android: {
+        fontFamily: 'sans-serif',
+    },
+    default: {},
+});
+const styles = react_native_1.StyleSheet.create({
+    overlay: {
+        flex: 1,
+        backgroundColor: 'rgba(15, 23, 42, 0.62)',
+        justifyContent: 'center',
+        alignItems: 'center',
+        paddingHorizontal: 20,
+        zIndex: 999999,
+    },
+    card: {
+        width: '100%',
+        maxWidth: 360,
+        backgroundColor: '#FFFFFF',
+        borderRadius: 24,
+        borderWidth: 1,
+        borderColor: '#E2E8F0',
+        paddingHorizontal: 20,
+        paddingTop: 22,
+        paddingBottom: 20,
+        alignItems: 'center',
+        shadowColor: '#0F172A',
+        shadowOffset: { width: 0, height: 18 },
+        shadowOpacity: 0.24,
+        shadowRadius: 36,
+        elevation: 24,
+    },
+    topCloseButton: {
+        position: 'absolute',
+        top: 14,
+        right: 14,
+        width: 28,
+        height: 28,
+        borderRadius: 14,
+        backgroundColor: '#F8FAFC',
+        justifyContent: 'center',
+        alignItems: 'center',
+        borderWidth: 1,
+        borderColor: '#E2E8F0',
+        zIndex: 10,
+    },
+    headerSection: {
+        alignItems: 'center',
+        width: '100%',
+        marginBottom: 12,
+    },
+    iconHaloRing: {
+        width: 66,
+        height: 66,
+        borderRadius: 20,
+        backgroundColor: '#FAF5FF',
+        justifyContent: 'center',
+        alignItems: 'center',
+        borderWidth: 1.5,
+        borderColor: '#F3E8FF',
+        marginBottom: 8,
+        shadowColor: '#7C3AED',
+        shadowOffset: { width: 0, height: 4 },
+        shadowOpacity: 0.16,
+        shadowRadius: 10,
+        elevation: 4,
+    },
+    sparkleBadge: {
+        position: 'absolute',
+        top: -4,
+        right: -4,
+        width: 22,
+        height: 22,
+        borderRadius: 11,
+        backgroundColor: '#FEF3C7',
+        justifyContent: 'center',
+        alignItems: 'center',
+        borderWidth: 1.5,
+        borderColor: '#FFFFFF',
+    },
+    title: {
+        fontSize: 17.5,
+        fontWeight: '800',
+        color: '#0F172A',
+        letterSpacing: -0.4,
+        textAlign: 'center',
+        lineHeight: 22,
+        marginBottom: 2,
+        ...fontStack,
+    },
+    subtitle: {
+        fontSize: 12,
+        fontWeight: '500',
+        color: '#64748B',
+        textAlign: 'center',
+        lineHeight: 16,
+        paddingHorizontal: 8,
+        ...fontStack,
+    },
+    versionComparisonCard: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'space-between',
+        backgroundColor: '#F8FAFC',
+        borderRadius: 14,
+        borderWidth: 1,
+        borderColor: '#E2E8F0',
+        paddingVertical: 10,
+        paddingHorizontal: 14,
+        marginBottom: 12,
+        width: '100%',
+    },
+    versionColumn: {
+        alignItems: 'center',
+        gap: 4,
+    },
+    versionLabel: {
+        fontSize: 9.5,
+        fontWeight: '700',
+        color: '#94A3B8',
+        letterSpacing: 0.6,
+        ...fontStack,
+    },
+    installedChip: {
+        backgroundColor: '#E2E8F0',
+        paddingHorizontal: 8,
+        paddingVertical: 3,
+        borderRadius: 6,
+    },
+    installedText: {
+        fontSize: 12,
+        fontWeight: '700',
+        color: '#475569',
+        ...fontStack,
+    },
+    arrowContainer: {
+        paddingHorizontal: 6,
+    },
+    arrowText: {
+        fontSize: 14,
+        color: '#94A3B8',
+        fontWeight: '700',
+    },
+    latestChip: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        gap: 4,
+        backgroundColor: '#EDE9FE',
+        paddingHorizontal: 8,
+        paddingVertical: 3,
+        borderRadius: 6,
+        borderWidth: 1,
+        borderColor: '#DDD6FE',
+    },
+    latestText: {
+        fontSize: 12,
+        fontWeight: '800',
+        color: '#6D28D9',
+        ...fontStack,
+    },
+    codeSnippetBox: {
+        backgroundColor: '#0F172A',
+        borderRadius: 12,
+        padding: 10,
+        width: '100%',
+        marginBottom: 14,
+        borderWidth: 1,
+        borderColor: '#1E293B',
+    },
+    codeSnippetHeader: {
+        flexDirection: 'row',
+        justifyContent: 'space-between',
+        alignItems: 'center',
+        marginBottom: 6,
+    },
+    codeSnippetLabel: {
+        fontSize: 9.5,
+        fontWeight: '700',
+        color: '#64748B',
+        letterSpacing: 0.6,
+        ...fontStack,
+    },
+    copiedIndicator: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        gap: 3,
+    },
+    copiedText: {
+        fontSize: 9.5,
+        fontWeight: '600',
+        color: '#10B981',
+        ...fontStack,
+    },
+    commandRow: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'space-between',
+        backgroundColor: '#1E293B',
+        borderRadius: 8,
+        paddingVertical: 7,
+        paddingHorizontal: 9,
+        gap: 8,
+    },
+    commandText: {
+        flex: 1,
+        fontSize: 11,
+        fontFamily: react_native_1.Platform.OS === 'ios' ? 'Courier' : 'monospace',
+        color: '#38BDF8',
+    },
+    copyIconWrapper: {
+        width: 22,
+        height: 22,
+        borderRadius: 6,
+        backgroundColor: '#334155',
+        justifyContent: 'center',
+        alignItems: 'center',
+    },
+    buttonRow: {
+        flexDirection: 'row',
+        justifyContent: 'space-between',
+        alignItems: 'center',
+        gap: 10,
+        width: '100%',
+    },
+    secondaryButton: {
+        flex: 1,
+        alignItems: 'center',
+        justifyContent: 'center',
+        paddingVertical: 11,
+        borderRadius: 12,
+        backgroundColor: '#F1F5F9',
+        borderWidth: 1,
+        borderColor: '#E2E8F0',
+    },
+    secondaryButtonText: {
+        fontSize: 13,
+        fontWeight: '600',
+        color: '#475569',
+        ...fontStack,
+    },
+    primaryButton: {
+        flex: 1.3,
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'center',
+        gap: 6,
+        paddingVertical: 11,
+        borderRadius: 12,
+        backgroundColor: '#7C3AED',
+        shadowColor: '#7C3AED',
+        shadowOffset: { width: 0, height: 3 },
+        shadowOpacity: 0.28,
+        shadowRadius: 6,
+        elevation: 4,
+    },
+    primaryButtonText: {
+        fontSize: 13,
+        fontWeight: '700',
+        color: '#FFFFFF',
+        ...fontStack,
+    },
+});
+exports.default = exports.UpdateAvailableModal;

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

@@ -22,6 +22,7 @@ export declare const SizeIcon: ({ color }: IconProps) => React.JSX.Element;
 export declare const RequestIcon: ({ color }: IconProps) => React.JSX.Element;
 export declare const ResponseIcon: ({ color }: IconProps) => React.JSX.Element;
 export declare const HeadersIcon: ({ color }: IconProps) => React.JSX.Element;
+export declare const ReplayIcon: ({ color, size, }: IconProps) => React.JSX.Element;
 export declare const CopyIcon: ({ color, size }: IconProps) => React.JSX.Element;
 export declare const FetchIcon: ({ color, size }: IconProps) => React.JSX.Element;
 export declare const TerminalIcon: ({ color, size, }: IconProps) => React.JSX.Element;
@@ -127,3 +128,14 @@ export declare const TagIcon: ({ color, size }: IconProps) => React.JSX.Element;
 export declare const NpmIcon: ({ color, size }: IconProps) => React.JSX.Element;
 export declare const ResetIcon: ({ color, size }: IconProps) => React.JSX.Element;
 export declare const ChevronDownIcon: ({ color, size }: IconProps) => React.JSX.Element;
+export declare const DatabaseIcon: ({ color, size }: IconProps) => React.JSX.Element;
+export declare const DevicePhoneIcon: ({ color, size }: IconProps) => React.JSX.Element;
+export declare const FlagIcon: ({ color, size }: IconProps) => React.JSX.Element;
+export declare const EditIcon: ({ color, size }: IconProps) => React.JSX.Element;
+export declare const PlusIcon: ({ color, size }: IconProps) => React.JSX.Element;
+export declare const CodeIcon: ({ color, size }: IconProps) => React.JSX.Element;
+export declare const CpuIcon: ({ color, size }: IconProps) => React.JSX.Element;
+export declare const FingerprintIcon: ({ color, size }: IconProps) => React.JSX.Element;
+export declare const MonitorIcon: ({ color, size }: IconProps) => React.JSX.Element;
+export declare const ShieldCheckIcon: ({ color, size }: IconProps) => React.JSX.Element;
+export declare const SparklesIcon: ({ color, size }: IconProps) => React.JSX.Element;

package/dist/commonjs/components/NetworkIcons.js

@@ -36,9 +36,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": 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.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.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.ReplayIcon = 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.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 = exports.InfoCircleIcon = void 0;
+exports.SparklesIcon = exports.ShieldCheckIcon = exports.MonitorIcon = exports.FingerprintIcon = exports.CpuIcon = exports.CodeIcon = exports.PlusIcon = exports.EditIcon = exports.FlagIcon = exports.DevicePhoneIcon = exports.DatabaseIcon = 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 = exports.DiagnosticsIcon = void 0;
 const react_1 = __importDefault(require("react"));
 const react_native_svg_1 = __importStar(require("react-native-svg"));
 // Stylesheet
@@ -133,6 +133,14 @@ const HeadersIcon = ({ color = AppColors_1.AppColors.skyBlue }) => {
     </react_native_svg_1.default>);
 };
 exports.HeadersIcon = HeadersIcon;
+const ReplayIcon = ({ color = AppColors_1.AppColors.purple, 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="M21 2v6h-6" stroke={color} strokeWidth="2.2" strokeLinecap="round" strokeLinejoin="round"/>
+      <react_native_svg_1.Path d="M21 8A10 10 0 1 0 21.8 14" stroke={color} strokeWidth="2.2" strokeLinecap="round" strokeLinejoin="round"/>
+      <react_native_svg_1.Path d="M10 8.5l5.5 3.5-5.5 3.5v-7z" fill={color}/>
+    </react_native_svg_1.default>);
+};
+exports.ReplayIcon = ReplayIcon;
 const CopyIcon = ({ 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 9V5a2 2 0 0 1 2-2h7a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-4" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
@@ -869,3 +877,64 @@ const ChevronDownIcon = ({ color = AppColors_1.AppColors.grayTextWeak, size = 14
     <react_native_svg_1.Path d="M6 9l6 6 6-6" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
   </react_native_svg_1.default>);
 exports.ChevronDownIcon = ChevronDownIcon;
+const DatabaseIcon = ({ color = AppColors_1.AppColors.purple, size = 16 }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+    <react_native_svg_1.Ellipse cx="12" cy="5" rx="9" ry="3" stroke={color} strokeWidth="1.8"/>
+    <react_native_svg_1.Path d="M21 12c0 1.66-4 3-9 3s-9-1.34-9-3" stroke={color} strokeWidth="1.8" strokeLinecap="round"/>
+    <react_native_svg_1.Path d="M3 5v14c0 1.66 4 3 9 3s9-1.34 9-3V5" stroke={color} strokeWidth="1.8" strokeLinecap="round"/>
+  </react_native_svg_1.default>);
+exports.DatabaseIcon = DatabaseIcon;
+const DevicePhoneIcon = ({ color = AppColors_1.AppColors.purple, size = 16 }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+    <react_native_svg_1.Rect x="5" y="2" width="14" height="20" rx="3" stroke={color} strokeWidth="1.8"/>
+    <react_native_svg_1.Line x1="12" y1="18" x2="12.01" y2="18" stroke={color} strokeWidth="2.5" strokeLinecap="round"/>
+    <react_native_svg_1.Line x1="9" y1="5" x2="15" y2="5" stroke={color} strokeWidth="1.5" strokeLinecap="round"/>
+  </react_native_svg_1.default>);
+exports.DevicePhoneIcon = DevicePhoneIcon;
+const FlagIcon = ({ color = AppColors_1.AppColors.purple, size = 16 }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+    <react_native_svg_1.Path d="M4 15s1-1 4-1 5 2 8 2 4-1 4-1V3s-1 1-4 1-5-2-8-2-4 1-4 1zM4 22v-7" stroke={color} strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round"/>
+  </react_native_svg_1.default>);
+exports.FlagIcon = FlagIcon;
+const EditIcon = ({ color = AppColors_1.AppColors.grayText, size = 14 }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+    <react_native_svg_1.Path d="M17 3a2.828 2.828 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5L17 3z" stroke={color} strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round"/>
+  </react_native_svg_1.default>);
+exports.EditIcon = EditIcon;
+const PlusIcon = ({ color = AppColors_1.AppColors.white, size = 14 }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+    <react_native_svg_1.Line x1="12" y1="5" x2="12" y2="19" stroke={color} strokeWidth="2" strokeLinecap="round"/>
+    <react_native_svg_1.Line x1="5" y1="12" x2="19" y2="12" stroke={color} strokeWidth="2" strokeLinecap="round"/>
+  </react_native_svg_1.default>);
+exports.PlusIcon = PlusIcon;
+const CodeIcon = ({ color = AppColors_1.AppColors.grayText, size = 14 }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+    <react_native_svg_1.Path d="M16 18l6-6-6-6M8 6l-6 6 6 6" stroke={color} strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round"/>
+  </react_native_svg_1.default>);
+exports.CodeIcon = CodeIcon;
+const CpuIcon = ({ color = AppColors_1.AppColors.grayText, size = 14 }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+    <react_native_svg_1.Rect x="4" y="4" width="16" height="16" rx="2" stroke={color} strokeWidth="1.8"/>
+    <react_native_svg_1.Rect x="9" y="9" width="6" height="6" stroke={color} strokeWidth="1.8"/>
+    <react_native_svg_1.Line x1="9" y1="1" x2="9" y2="4" stroke={color} strokeWidth="1.8" strokeLinecap="round"/>
+    <react_native_svg_1.Line x1="15" y1="1" x2="15" y2="4" stroke={color} strokeWidth="1.8" strokeLinecap="round"/>
+    <react_native_svg_1.Line x1="9" y1="20" x2="9" y2="23" stroke={color} strokeWidth="1.8" strokeLinecap="round"/>
+    <react_native_svg_1.Line x1="15" y1="20" x2="15" y2="23" stroke={color} strokeWidth="1.8" strokeLinecap="round"/>
+    <react_native_svg_1.Line x1="20" y1="9" x2="23" y2="9" stroke={color} strokeWidth="1.8" strokeLinecap="round"/>
+    <react_native_svg_1.Line x1="20" y1="15" x2="23" y2="15" stroke={color} strokeWidth="1.8" strokeLinecap="round"/>
+    <react_native_svg_1.Line x1="1" y1="9" x2="4" y2="9" stroke={color} strokeWidth="1.8" strokeLinecap="round"/>
+    <react_native_svg_1.Line x1="1" y1="15" x2="4" y2="15" stroke={color} strokeWidth="1.8" strokeLinecap="round"/>
+  </react_native_svg_1.default>);
+exports.CpuIcon = CpuIcon;
+const FingerprintIcon = ({ color = AppColors_1.AppColors.grayText, size = 14 }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+    <react_native_svg_1.Path d="M2 12C2 6.477 6.477 2 12 2s10 4.477 10 10c0 2.21-.895 4.21-2.343 5.657M12 7c-2.761 0-5 2.239-5 5 0 1.38.56 2.63 1.464 3.536M12 11c-.552 0-1 .448-1 1 0 2.5 1.5 4.5 4 5" stroke={color} strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round"/>
+  </react_native_svg_1.default>);
+exports.FingerprintIcon = FingerprintIcon;
+const MonitorIcon = ({ color = AppColors_1.AppColors.grayText, size = 14 }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+    <react_native_svg_1.Rect x="2" y="3" width="20" height="14" rx="2" stroke={color} strokeWidth="1.8"/>
+    <react_native_svg_1.Line x1="8" y1="21" x2="16" y2="21" stroke={color} strokeWidth="1.8" strokeLinecap="round"/>
+    <react_native_svg_1.Line x1="12" y1="17" x2="12" y2="21" stroke={color} strokeWidth="1.8" strokeLinecap="round"/>
+  </react_native_svg_1.default>);
+exports.MonitorIcon = MonitorIcon;
+const ShieldCheckIcon = ({ color = AppColors_1.AppColors.greenColor, size = 16 }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+    <react_native_svg_1.Path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" stroke={color} strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round"/>
+    <react_native_svg_1.Path d="M9 12l2 2 4-4" stroke={color} strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round"/>
+  </react_native_svg_1.default>);
+exports.ShieldCheckIcon = ShieldCheckIcon;
+const SparklesIcon = ({ color = AppColors_1.AppColors.purple, size = 16 }) => (<react_native_svg_1.default width={size} height={size} viewBox="0 0 24 24" fill="none">
+    <react_native_svg_1.Path d="M12 3l1.912 5.885L20 10.8l-4.756 3.63L16.824 20 12 16.3 7.176 20l1.58-5.57L4 10.8l6.088-1.915L12 3z" stroke={color} strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round"/>
+  </react_native_svg_1.default>);
+exports.SparklesIcon = SparklesIcon;

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

@@ -1 +1 @@
-export declare const LIB_VERSION = "2.0.4";
+export declare const LIB_VERSION = "2.0.6";

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 = '2.0.4';
+exports.LIB_VERSION = '2.0.6';

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

@@ -0,0 +1,13 @@
+import { StorageEntry } from '../types';
+type StorageListener = () => void;
+export declare function setCustomStorageAdapter(adapter: any): void;
+export declare function subscribeStorageChanges(listener: StorageListener): () => void;
+export declare function notifyStorageChange(): void;
+/**
+ * Reads all entries from on-device storage (AsyncStorage or fallback store).
+ */
+export declare function fetchAllStorageEntries(): Promise<StorageEntry[]>;
+export declare function setStorageItem(key: string, value: string): Promise<void>;
+export declare function removeStorageItem(key: string): Promise<void>;
+export declare function clearAllStorage(): Promise<void>;
+export {};