react-native-debug-toolkit 2.0.0 → 2.2.0

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

@@ -1,96 +0,0 @@
-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

@@ -1 +0,0 @@
-{"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/src/components/ConsoleLogTab.tsx

@@ -1,209 +0,0 @@
-import React, { useState } from 'react';
-import { View, Text, FlatList, TouchableOpacity, StyleSheet, Animated, ScrollView } from 'react-native';
-import { Colors } from '../utils/constants';
-import { safeStringify } from '../utils/safeStringify';
-import { CollapsibleSection } from './shared/CollapsibleSection';
-import { JsonView } from './shared/JsonView';
-import { CopyButton } from './shared/CopyButton';
-import { fmt } from '../utils/copyToComputer';
-import { useSlideDetailAnimation } from '../hooks/useSlideDetailAnimation';
-import type { ConsoleLogEntry, DebugFeatureRenderProps } from '../types';
-
-const LEVEL_COLORS: Record<string, string> = {
-  log: '#8E8E93',
-  info: '#007AFF',
-  warn: '#FF9500',
-  error: '#FF3B30',
-};
-
-const LEVEL_ICONS: Record<string, string> = {
-  log: '●',
-  info: 'ℹ',
-  warn: '⚠',
-  error: '✕',
-};
-
-export const ConsoleLogTab: React.FC<DebugFeatureRenderProps<ConsoleLogEntry>> = React.memo(({
-  data,
-}) => {
-  const [selected, setSelected] = useState<ConsoleLogEntry | null>(null);
-  const { detailTranslateX, listTranslateX, listOpacity } = useSlideDetailAnimation(selected);
-
-  const renderItem = ({ item }: { item: ConsoleLogEntry }) => (
-    <TouchableOpacity style={s.card} onPress={() => setSelected(item)} activeOpacity={0.6}>
-      <View style={s.cardRow}>
-        <View style={[s.levelDot, { backgroundColor: LEVEL_COLORS[item.level] ?? '#8E8E93' }]}>
-          <Text style={s.levelIcon}>{LEVEL_ICONS[item.level] ?? '●'}</Text>
-        </View>
-        <View style={s.cardContent}>
-          <Text style={s.logMessage} numberOfLines={2}>
-            {item.data.map((d) => (typeof d === 'string' ? d : safeStringify(d))).join(' ')}
-          </Text>
-          <Text style={s.time}>
-            {new Date(item.timestamp).toLocaleTimeString()}
-          </Text>
-        </View>
-      </View>
-    </TouchableOpacity>
-  );
-
-  return (
-    <View style={s.container}>
-      {/* List */}
-      <Animated.View style={[s.listWrap, selected ? { opacity: listOpacity, transform: [{ translateX: listTranslateX }] } : null]}>
-        {data.length === 0 ? (
-          <View style={s.emptyContainer}>
-            <Text style={s.emptyIcon}>~</Text>
-            <Text style={s.empty}>No console logs</Text>
-          </View>
-        ) : (
-          <FlatList
-            data={[...data].reverse()}
-            renderItem={renderItem}
-            keyExtractor={(item) => item.id}
-            contentContainerStyle={s.listContent}
-            initialNumToRender={20}
-            maxToRenderPerBatch={10}
-            windowSize={5}
-            removeClippedSubviews={true}
-          />
-        )}
-      </Animated.View>
-
-      {/* Detail (push navigation) */}
-      {selected && (
-        <Animated.View style={[s.detailWrap, { transform: [{ translateX: detailTranslateX }] }]}>
-          <View style={s.detailHeader}>
-            <TouchableOpacity onPress={() => setSelected(null)} style={s.backBtn} activeOpacity={0.6}>
-              <Text style={s.backIcon}>‹</Text>
-              <Text style={s.backText}>Back</Text>
-            </TouchableOpacity>
-            <View style={[s.levelBadge, { backgroundColor: LEVEL_COLORS[selected.level] ?? '#8E8E93' }]}>
-              <Text style={s.levelBadgeText}>{selected.level.toUpperCase()}</Text>
-            </View>
-            <Text style={s.detailTime}>
-              {new Date(selected.timestamp).toLocaleString()}
-            </Text>
-          </View>
-          <ScrollView style={s.detailBody} contentContainerStyle={s.detailBodyContent}>
-            {selected.data.map((item, index) => {
-              const formatted = typeof item === 'object' && item !== null
-                ? fmt(item)
-                : String(item);
-              return (
-              <CollapsibleSection
-                key={index}
-                title={typeof item === 'object' && item !== null ? `Arg ${index + 1} (object)` : `Arg ${index + 1}`}
-                initiallyExpanded={index === 0}
-              >
-                <View style={s.sectionWithCopy}>
-                  <CopyButton text={formatted} label={`Console Arg ${index + 1}`} />
-                  {typeof item === 'object' && item !== null ? (
-                    <JsonView data={item} maxHeight={250} />
-                  ) : (
-                    <Text style={s.plainText} selectable>{String(item)}</Text>
-                  )}
-                </View>
-              </CollapsibleSection>
-              );
-            })}
-          </ScrollView>
-        </Animated.View>
-      )}
-    </View>
-  );
-});
-
-const s = StyleSheet.create({
-  container: { flex: 1, backgroundColor: Colors.background },
-  listWrap: {
-    position: 'absolute',
-    top: 0,
-    left: 0,
-    right: 0,
-    bottom: 0,
-  },
-  listContent: { padding: 12 },
-
-  // Empty
-  emptyContainer: { flex: 1, alignItems: 'center', justifyContent: 'center' },
-  emptyIcon: { fontSize: 40, color: Colors.textLight, marginBottom: 4 },
-  empty: { textAlign: 'center', color: Colors.textLight, fontSize: 14 },
-
-  // Card
-  card: {
-    backgroundColor: Colors.surface,
-    borderRadius: 12,
-    marginBottom: 8,
-    overflow: 'hidden',
-  },
-  cardRow: { flexDirection: 'row', padding: 14, alignItems: 'flex-start' },
-  levelDot: {
-    width: 24,
-    height: 24,
-    borderRadius: 12,
-    alignItems: 'center',
-    justifyContent: 'center',
-    marginRight: 12,
-    marginTop: 1,
-  },
-  levelIcon: { color: '#FFF', fontSize: 11, fontWeight: '700' },
-  cardContent: { flex: 1 },
-  logMessage: { fontSize: 14, color: Colors.text, lineHeight: 20 },
-  time: { fontSize: 12, color: Colors.textSecondary, marginTop: 4 },
-
-  // Detail (in-panel navigation)
-  detailWrap: {
-    position: 'absolute',
-    top: 0,
-    left: 0,
-    right: 0,
-    bottom: 0,
-    backgroundColor: Colors.background,
-  },
-  detailHeader: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    paddingHorizontal: 8,
-    paddingVertical: 10,
-    backgroundColor: Colors.surface,
-    borderBottomWidth: StyleSheet.hairlineWidth,
-    borderBottomColor: Colors.border,
-    gap: 6,
-  },
-  backBtn: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    paddingHorizontal: 6,
-    paddingVertical: 4,
-    borderRadius: 8,
-  },
-  backIcon: {
-    fontSize: 24,
-    fontWeight: '300',
-    color: Colors.primary,
-    marginTop: -2,
-    marginRight: 2,
-  },
-  backText: {
-    fontSize: 16,
-    color: Colors.primary,
-    fontWeight: '500',
-  },
-  levelBadge: {
-    paddingHorizontal: 10,
-    paddingVertical: 4,
-    borderRadius: 6,
-  },
-  levelBadgeText: { color: '#FFF', fontSize: 12, fontWeight: '700' },
-  detailTime: { flex: 1, fontSize: 13, color: Colors.textSecondary, textAlign: 'right' },
-  detailBody: { flex: 1 },
-  detailBodyContent: { padding: 12 },
-  sectionWithCopy: { gap: 8 },
-  plainText: {
-    fontFamily: 'Courier',
-    fontSize: 13,
-    color: Colors.text,
-    lineHeight: 20,
-  },
-});