react-native-debug-toolkit 0.6.3 → 2.0.0

package/lib/typescript/src/types/index.d.ts

@@ -0,0 +1,112 @@
+import type { ComponentType } from 'react';
+export type DebugFeatureListener = () => void;
+export type BuiltInFeatureName = 'network' | 'console' | 'zustand' | 'navigation' | 'track' | 'thirdPartyLibs' | 'environment' | 'clipboard';
+export interface DebugFeatureRenderProps<TData = unknown> {
+    data: TData[];
+    feature: DebugFeature<TData>;
+}
+export type DebugFeatureRenderer<TData = unknown> = ComponentType<DebugFeatureRenderProps<TData>>;
+export type DebugFeatureFactory = () => DebugFeature<any>;
+export type DebugFeatureInput = BuiltInFeatureName | DebugFeature<any> | DebugFeatureFactory;
+/** Base interface all debug features must implement */
+export interface DebugFeature<TData = unknown> {
+    name: string;
+    label: string;
+    setup: () => void;
+    getData: () => TData[];
+    clear?: () => void;
+    cleanup: () => void;
+    subscribe?: (listener: DebugFeatureListener) => () => void;
+    renderContent?: DebugFeatureRenderer<TData>;
+    badge?: () => {
+        label: string;
+        color: string;
+    } | null;
+}
+export interface NetworkLogEntry {
+    id: string;
+    timestamp: number;
+    duration?: number;
+    request: {
+        url: string;
+        method: string;
+        headers?: Record<string, string>;
+        body?: unknown;
+    };
+    response?: {
+        status: number;
+        statusText?: string;
+        headers?: Record<string, string>;
+        data?: unknown;
+        success?: boolean;
+    };
+    error?: string;
+}
+export interface ConsoleLogEntry {
+    id: string;
+    timestamp: number;
+    level: 'log' | 'info' | 'warn' | 'error';
+    data: unknown[];
+}
+export interface ZustandLogEntry {
+    id: string;
+    timestamp: number;
+    action: string;
+    prevState: unknown;
+    nextState: unknown;
+    actionCompleteTime?: number;
+    storeName?: string;
+}
+export interface NavigationLogEntry {
+    id: string;
+    timestamp: number;
+    action: string;
+    from: string;
+    to: string;
+    startTime?: number;
+    duration?: number;
+    debugLog?: string;
+}
+export interface TrackLogEntry {
+    id: string;
+    timestamp: number;
+    eventName: string;
+    [key: string]: unknown;
+}
+export interface ThirdPartyLib {
+    id: string;
+    name: string;
+    description: string;
+    platform: 'ios' | 'android' | 'both';
+    actions: Array<{
+        id: string;
+        label: string;
+        onPress: () => void;
+    }>;
+}
+export interface EnvironmentConfig {
+    id: string;
+    label: string;
+    host: string;
+    color?: string;
+}
+export interface EnvironmentState {
+    environments: EnvironmentConfig[];
+    currentEnvironmentId: string | null;
+}
+export interface DebugToolkitConfig {
+    features?: DebugFeatureInput[];
+    enabled?: boolean;
+    /** Maximum number of log entries per feature (default: 200) */
+    maxLogsPerFeature?: number;
+}
+export interface DebugToolkitAPI {
+    readonly features: ReadonlyArray<DebugFeature<any>>;
+    addFeature: (feature: DebugFeature<any>) => void;
+    removeFeature: (name: string) => void;
+    showPanel: () => void;
+    hidePanel: () => void;
+    clearAll: () => void;
+    destroy: () => void;
+}
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/types/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/types/index.ts"],"names":[],"mappings":"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"}

package/lib/typescript/src/utils/constants.d.ts

@@ -0,0 +1,96 @@
+export declare const Layout: {
+    readonly screenWidth: number;
+    readonly screenHeight: number;
+    readonly iconSize: 52;
+};
+export declare const Colors: {
+    readonly primary: "#007AFF";
+    readonly text: "#1C1C1E";
+    readonly textSecondary: "#8E8E93";
+    readonly textLight: "#C7C7CC";
+    readonly border: "#E5E5EA";
+    readonly opaqueSeparator: "#C6C6C8";
+    readonly background: "#F2F2F7";
+    readonly surface: "#FFFFFF";
+    readonly success: "#34C759";
+    readonly error: "#FF3B30";
+    readonly warning: "#FF9500";
+    readonly info: "#5AC8FA";
+    readonly blue: "#007AFF";
+    readonly green: "#34C759";
+    readonly indigo: "#5856D6";
+    readonly orange: "#FF9500";
+    readonly pink: "#FF2D55";
+    readonly purple: "#AF52DE";
+    readonly red: "#FF3B30";
+    readonly teal: "#5AC8FA";
+    readonly yellow: "#FFCC00";
+    readonly get: "#007AFF";
+    readonly post: "#34C759";
+    readonly put: "#FF9500";
+    readonly delete: "#FF3B30";
+    readonly patch: "#5AC8FA";
+};
+export declare const getMethodColor: (method: string) => string;
+export declare const Spacing: {
+    readonly xs: 4;
+    readonly sm: 8;
+    readonly md: 12;
+    readonly lg: 16;
+    readonly xl: 20;
+    readonly xxl: 24;
+};
+export declare const Radius: {
+    readonly sm: 8;
+    readonly md: 12;
+    readonly lg: 16;
+    readonly xl: 20;
+    readonly full: 999;
+};
+export declare const Typography: {
+    readonly largeTitle: {
+        readonly fontSize: 34;
+        readonly fontWeight: "700";
+    };
+    readonly title1: {
+        readonly fontSize: 28;
+        readonly fontWeight: "700";
+    };
+    readonly title2: {
+        readonly fontSize: 22;
+        readonly fontWeight: "700";
+    };
+    readonly title3: {
+        readonly fontSize: 20;
+        readonly fontWeight: "600";
+    };
+    readonly headline: {
+        readonly fontSize: 17;
+        readonly fontWeight: "600";
+    };
+    readonly body: {
+        readonly fontSize: 17;
+        readonly fontWeight: "400";
+    };
+    readonly callout: {
+        readonly fontSize: 16;
+        readonly fontWeight: "400";
+    };
+    readonly subheadline: {
+        readonly fontSize: 15;
+        readonly fontWeight: "400";
+    };
+    readonly footnote: {
+        readonly fontSize: 13;
+        readonly fontWeight: "400";
+    };
+    readonly caption1: {
+        readonly fontSize: 12;
+        readonly fontWeight: "400";
+    };
+    readonly caption2: {
+        readonly fontSize: 11;
+        readonly fontWeight: "400";
+    };
+};
+//# sourceMappingURL=constants.d.ts.map

package/lib/typescript/src/utils/constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../src/utils/constants.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,MAAM;;;;CAIT,CAAC;AAGX,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkCT,CAAC;AAEX,eAAO,MAAM,cAAc,GAAI,QAAQ,MAAM,KAAG,MAS/C,CAAC;AAGF,eAAO,MAAM,OAAO;;;;;;;CAOV,CAAC;AAGX,eAAO,MAAM,MAAM;;;;;;CAMT,CAAC;AAGX,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAYb,CAAC"}

package/lib/typescript/src/utils/copyToComputer.d.ts

@@ -0,0 +1,30 @@
+export type CopyMethod = 'clipboard' | 'console' | 'none';
+export interface CopyResult {
+    success: boolean;
+    method: CopyMethod;
+}
+export interface CopyOptions {
+    /** Descriptive label for console.log identification */
+    label?: string;
+    /** If true, only copy to clipboard without console.log */
+    silent?: boolean;
+}
+/**
+ * Format data for copying (pretty JSON or raw string).
+ */
+export declare function fmt(data: unknown): string;
+/**
+ * Log content to console (Metro terminal / DevTools) with a structured prefix.
+ * ConsoleLogFeature intercepts console.log but still calls the original first,
+ * so output reliably appears in Metro terminal.
+ */
+export declare function logToComputer(content: string, label?: string): void;
+/**
+ * Copy content to computer via the best available method.
+ *
+ * 1. Attempts device clipboard (if @react-native-clipboard/clipboard is installed)
+ * 2. Always console.logs with structured prefix (appears in Metro terminal)
+ * 3. Returns result indicating what succeeded
+ */
+export declare function copyToComputer(content: string, options?: CopyOptions): CopyResult;
+//# sourceMappingURL=copyToComputer.d.ts.map

package/lib/typescript/src/utils/copyToComputer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"copyToComputer.d.ts","sourceRoot":"","sources":["../../../../src/utils/copyToComputer.ts"],"names":[],"mappings":"AAsBA,MAAM,MAAM,UAAU,GAAG,WAAW,GAAG,SAAS,GAAG,MAAM,CAAC;AAE1D,MAAM,WAAW,UAAU;IACzB,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,UAAU,CAAC;CACpB;AAED,MAAM,WAAW,WAAW;IAC1B,uDAAuD;IACvD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,0DAA0D;IAC1D,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAID;;GAEG;AACH,wBAAgB,GAAG,CAAC,IAAI,EAAE,OAAO,GAAG,MAAM,CAOzC;AAED;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAgBnE;AAED;;;;;;GAMG;AACH,wBAAgB,cAAc,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,WAAW,GAAG,UAAU,CAuBjF"}

package/lib/typescript/src/utils/createEventChannel.d.ts

@@ -0,0 +1,7 @@
+export type EventListener<TEvent> = (event: TEvent) => void;
+export interface EventChannel<TEvent> {
+    emit: (event: TEvent) => void;
+    subscribe: (listener: EventListener<TEvent>) => () => void;
+}
+export declare function createEventChannel<TEvent>(): EventChannel<TEvent>;
+//# sourceMappingURL=createEventChannel.d.ts.map

package/lib/typescript/src/utils/createEventChannel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createEventChannel.d.ts","sourceRoot":"","sources":["../../../../src/utils/createEventChannel.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,aAAa,CAAC,MAAM,IAAI,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;AAE5D,MAAM,WAAW,YAAY,CAAC,MAAM;IAClC,IAAI,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9B,SAAS,EAAE,CAAC,QAAQ,EAAE,aAAa,CAAC,MAAM,CAAC,KAAK,MAAM,IAAI,CAAC;CAC5D;AAED,wBAAgB,kBAAkB,CAAC,MAAM,KAAK,YAAY,CAAC,MAAM,CAAC,CAcjE"}

package/lib/typescript/src/utils/createObservableStore.d.ts

@@ -0,0 +1,9 @@
+export type StoreListener = () => void;
+export interface ObservableStore<T> {
+    getData: () => T[];
+    push: (item: T, maxEntries?: number) => void;
+    clear: () => void;
+    subscribe: (listener: StoreListener) => () => void;
+}
+export declare function createObservableStore<T>(): ObservableStore<T>;
+//# sourceMappingURL=createObservableStore.d.ts.map

package/lib/typescript/src/utils/createObservableStore.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createObservableStore.d.ts","sourceRoot":"","sources":["../../../../src/utils/createObservableStore.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,aAAa,GAAG,MAAM,IAAI,CAAC;AAEvC,MAAM,WAAW,eAAe,CAAC,CAAC;IAChC,OAAO,EAAE,MAAM,CAAC,EAAE,CAAC;IACnB,IAAI,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,UAAU,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,SAAS,EAAE,CAAC,QAAQ,EAAE,aAAa,KAAK,MAAM,IAAI,CAAC;CACpD;AAED,wBAAgB,qBAAqB,CAAC,CAAC,KAAK,eAAe,CAAC,CAAC,CAAC,CAgC7D"}

package/lib/typescript/src/utils/safeStringify.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Safely stringify a value to JSON, handling circular references
+ * and values that can't be serialized.
+ */
+export declare function safeStringify(value: unknown, space?: number): string;
+//# sourceMappingURL=safeStringify.d.ts.map

package/lib/typescript/src/utils/safeStringify.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"safeStringify.d.ts","sourceRoot":"","sources":["../../../../src/utils/safeStringify.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,OAAO,EAAE,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAoBpE"}

package/package.json

@@ -1,43 +1,82 @@
 {
   "name": "react-native-debug-toolkit",
-  "version": "0.6.3",
-  "description": "A simple yet powerful debugging toolkit for React Native with a convenient floating UI for development",
-  "main": "index.js",
-  "types": "index.d.ts",
-  "podspec": "react-native-debug-toolkit.podspec",
+  "version": "2.0.0",
+  "description": "A dev-only floating debug panel for React Native with network, console, Zustand, navigation, and event logs",
+  "main": "lib/commonjs/index.js",
+  "module": "lib/module/index.js",
+  "types": "lib/typescript/src/index.d.ts",
+  "files": [
+    "src",
+    "lib",
+    "README.md",
+    "LICENSE",
+    "!**/__tests__",
+    "!**/__fixtures__",
+    "!**/__mocks__"
+  ],
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1",
-    "bundle": "react-native bundle --platform ios --dev false --entry-file index.js --bundle-output dist/main.jsbundle --assets-dest dist"
-  },
-  "repository": {
-    "type": "git",
-    "url": "git+https://gitlab.outer.staruniongame.com/seaart-app-front/react-native-debug-toolkit.git"
+    "typecheck": "tsc --noEmit",
+    "typescript": "npm run typecheck",
+    "build": "bob build",
+    "lint": "eslint \"src/**/*.{js,ts,tsx}\"",
+    "prepare": "bob build"
   },
   "keywords": [
     "react-native",
     "debug",
     "toolkit",
-    "logging",
+    "http-inspector",
     "development-tools",
-    "floating-ui"
+    "floating-panel"
   ],
   "author": "zcj",
   "license": "MIT",
-  "dependencies": {
-    "react-native-mmkv": "2.12.2",
-    "react-native-json-tree": "^1.5.0",
-    "react-native-performance": "5.1.2",
-    "react-native-root-siblings": "^4.0.0"
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/zcj0808/react-native-debug-toolkit"
+  },
+  "homepage": "https://github.com/zcj0808/react-native-debug-toolkit#readme",
+  "bugs": {
+    "url": "https://github.com/zcj0808/react-native-debug-toolkit/issues"
   },
   "peerDependencies": {
-    "react": "*",
-    "react-native": "*"
+    "@react-native-clipboard/clipboard": ">=1.0.0",
+    "react": ">=18.0.0",
+    "react-native": ">=0.72.0"
+  },
+  "peerDependenciesMeta": {
+    "@react-native-clipboard/clipboard": {
+      "optional": true
+    }
   },
   "devDependencies": {
-    "@types/react": "^18.0.0",
-    "@types/react-native": "^0.70.0"
+    "@react-native/babel-preset": "^0.76.0",
+    "@react-native/eslint-config": "^0.76.0",
+    "@types/react": "^18.3.1",
+    "eslint": "^8.57.0",
+    "prettier": "^3.3.0",
+    "react": "^18.3.1",
+    "react-native": "^0.76.6",
+    "react-native-builder-bob": "^0.30.0",
+    "typescript": "^5.5.0"
   },
-  "jest": {
-    "preset": "react-native"
+  "react-native": "src/index.ts",
+  "source": "src/index.ts",
+  "react-native-builder-bob": {
+    "source": "src",
+    "output": "lib",
+    "targets": [
+      "commonjs",
+      "module",
+      [
+        "typescript",
+        {
+          "project": "tsconfig.json"
+        }
+      ]
+    ]
+  },
+  "dependencies": {
+    "@babel/runtime": "^7.29.2"
   }
 }

package/src/components/ClipboardTab.tsx

@@ -0,0 +1,81 @@
+import React, { useState, useCallback } from 'react';
+import { View, Text, TextInput, TouchableOpacity, StyleSheet } from 'react-native';
+import { Colors, Spacing, Radius } from '../utils/constants';
+import { copyToComputer } from '../utils/copyToComputer';
+import type { DebugFeatureRenderProps } from '../types';
+
+export const ClipboardTab: React.FC<DebugFeatureRenderProps<void>> = () => {
+  const [text, setText] = useState('');
+  const [feedback, setFeedback] = useState<string | null>(null);
+
+  const handleCopy = useCallback(() => {
+    if (!text) return;
+    try {
+      const result = copyToComputer(text, { label: 'Clipboard' });
+      setFeedback(result.method === 'clipboard' ? 'Copied' : 'Logged');
+    } catch {
+      setFeedback('Logged');
+    }
+    setTimeout(() => setFeedback(null), 2000);
+  }, [text]);
+
+  return (
+    <View style={s.container}>
+      <TextInput
+        style={s.input}
+        value={text}
+        onChangeText={setText}
+        placeholder="Paste or type text here..."
+        placeholderTextColor={Colors.textLight}
+        multiline
+        textAlignVertical="top"
+      />
+      <View style={s.footer}>
+        {text ? (
+          <TouchableOpacity style={s.copyBtn} onPress={handleCopy} activeOpacity={0.7}>
+            <Text style={s.copyBtnText}>{feedback ?? 'Copy'}</Text>
+          </TouchableOpacity>
+        ) : (
+          <Text style={s.hint}>Paste or type content above, then copy to computer</Text>
+        )}
+      </View>
+    </View>
+  );
+};
+
+const s = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: Colors.background,
+    padding: Spacing.md,
+  },
+  input: {
+    flex: 1,
+    backgroundColor: Colors.surface,
+    borderRadius: Radius.md,
+    padding: Spacing.md,
+    fontSize: 14,
+    color: Colors.text,
+    lineHeight: 20,
+  },
+  footer: {
+    paddingTop: Spacing.sm,
+    minHeight: 36,
+    alignItems: 'flex-end',
+  },
+  hint: {
+    fontSize: 12,
+    color: Colors.textLight,
+  },
+  copyBtn: {
+    backgroundColor: Colors.background,
+    paddingHorizontal: 16,
+    paddingVertical: 6,
+    borderRadius: Radius.sm,
+  },
+  copyBtnText: {
+    fontSize: 13,
+    color: Colors.primary,
+    fontWeight: '600',
+  },
+});