react-native-inapp-inspector 2.3.2 → 2.3.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (24) hide show
  1. package/dist/commonjs/components/Inspector/MainScreen.js +1 -1
  2. package/dist/commonjs/components/Inspector/SkeletonPlaceholder.d.ts +6 -0
  3. package/dist/commonjs/components/Inspector/SkeletonPlaceholder.js +209 -0
  4. package/dist/commonjs/components/SkeletonPlaceholder.d.ts +2 -2
  5. package/dist/commonjs/components/SkeletonPlaceholder.js +3 -2
  6. package/dist/commonjs/constants/version.d.ts +1 -1
  7. package/dist/commonjs/constants/version.js +1 -1
  8. package/dist/commonjs/index.d.ts +1 -0
  9. package/dist/commonjs/index.js +5 -3
  10. package/dist/esm/components/Inspector/MainScreen.js +1 -1
  11. package/dist/esm/components/Inspector/SkeletonPlaceholder.d.ts +6 -0
  12. package/dist/esm/components/Inspector/SkeletonPlaceholder.js +173 -0
  13. package/dist/esm/components/SkeletonPlaceholder.d.ts +2 -2
  14. package/dist/esm/components/SkeletonPlaceholder.js +1 -1
  15. package/dist/esm/constants/version.d.ts +1 -1
  16. package/dist/esm/constants/version.js +1 -1
  17. package/dist/esm/index.d.ts +1 -0
  18. package/dist/esm/index.js +1 -0
  19. package/package.json +1 -1
  20. package/src/components/Inspector/MainScreen.tsx +1 -1
  21. package/src/components/Inspector/SkeletonPlaceholder.tsx +206 -0
  22. package/src/components/SkeletonPlaceholder.tsx +2 -2
  23. package/src/constants/version.ts +1 -1
  24. package/src/index.tsx +1 -0
package/dist/commonjs/components/Inspector/MainScreen.js CHANGED
@@ -49,7 +49,7 @@ const LogDetail_1 = __importDefault(require("./LogDetail"));
49
49
  const ConsoleTab_1 = __importDefault(require("./ConsoleTab"));
50
50
  const AnalyticsTab_1 = __importDefault(require("./AnalyticsTab"));
51
51
  const AnalyticsDetail_1 = __importDefault(require("../AnalyticsDetail"));
52
- const SkeletonPlaceholder_1 = __importDefault(require("../SkeletonPlaceholder"));
52
+ const SkeletonPlaceholder_1 = __importDefault(require("./SkeletonPlaceholder"));
53
53
  const ReduxTab_1 = __importDefault(require("./ReduxTab"));
54
54
  const ReduxDetail_1 = __importDefault(require("./ReduxDetail"));
55
55
  const BundleTab_1 = __importDefault(require("./BundleTab"));
package/dist/commonjs/components/Inspector/SkeletonPlaceholder.d.ts ADDED
@@ -0,0 +1,6 @@
1
+ import React from 'react';
2
+ export interface SkeletonPlaceholderProps {
3
+ cardCount?: number;
4
+ }
5
+ export declare const SkeletonPlaceholder: React.NamedExoticComponent<SkeletonPlaceholderProps>;
6
+ export default SkeletonPlaceholder;
package/dist/commonjs/components/Inspector/SkeletonPlaceholder.js ADDED
@@ -0,0 +1,209 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || (function () {
19
+ var ownKeys = function(o) {
20
+ ownKeys = Object.getOwnPropertyNames || function (o) {
21
+ var ar = [];
22
+ for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
23
+ return ar;
24
+ };
25
+ return ownKeys(o);
26
+ };
27
+ return function (mod) {
28
+ if (mod && mod.__esModule) return mod;
29
+ var result = {};
30
+ if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
31
+ __setModuleDefault(result, mod);
32
+ return result;
33
+ };
34
+ })();
35
+ Object.defineProperty(exports, "__esModule", { value: true });
36
+ exports.SkeletonPlaceholder = void 0;
37
+ const react_1 = __importStar(require("react"));
38
+ const react_native_1 = require("react-native");
39
+ const AppColors_1 = require("../../styles/AppColors");
40
+ exports.SkeletonPlaceholder = react_1.default.memo(function SkeletonPlaceholder({ cardCount = 4, }) {
41
+ const shimmerAnim = (0, react_1.useRef)(new react_native_1.Animated.Value(0.35)).current;
42
+ (0, react_1.useEffect)(() => {
43
+ const animation = react_native_1.Animated.loop(react_native_1.Animated.sequence([
44
+ react_native_1.Animated.timing(shimmerAnim, {
45
+ toValue: 0.85,
46
+ duration: 750,
47
+ useNativeDriver: true,
48
+ }),
49
+ react_native_1.Animated.timing(shimmerAnim, {
50
+ toValue: 0.35,
51
+ duration: 750,
52
+ useNativeDriver: true,
53
+ }),
54
+ ]));
55
+ animation.start();
56
+ return () => animation.stop();
57
+ }, [shimmerAnim]);
58
+ return (<react_native_1.View style={skeletonStyles.container}>
59
+ {/* ─── Search & Scope Toolbar Skeleton ─── */}
60
+ <react_native_1.View style={skeletonStyles.toolbarSkeleton}>
61
+ <react_native_1.Animated.View style={[
62
+ skeletonStyles.searchBarSkeleton,
63
+ { opacity: shimmerAnim },
64
+ ]}/>
65
+ <react_native_1.View style={skeletonStyles.actionButtonsRow}>
66
+ <react_native_1.Animated.View style={[skeletonStyles.iconButtonSkeleton, { opacity: shimmerAnim }]}/>
67
+ <react_native_1.Animated.View style={[skeletonStyles.iconButtonSkeleton, { opacity: shimmerAnim }]}/>
68
+ </react_native_1.View>
69
+ </react_native_1.View>
70
+
71
+ {/* ─── Quick Filter Chips Skeleton Strip ─── */}
72
+ <react_native_1.View style={skeletonStyles.chipStripSkeleton}>
73
+ <react_native_1.Animated.View style={[skeletonStyles.chipSkeleton, { width: 48, opacity: shimmerAnim }]}/>
74
+ <react_native_1.Animated.View style={[skeletonStyles.chipSkeleton, { width: 68, opacity: shimmerAnim }]}/>
75
+ <react_native_1.Animated.View style={[skeletonStyles.chipSkeleton, { width: 76, opacity: shimmerAnim }]}/>
76
+ <react_native_1.Animated.View style={[skeletonStyles.chipSkeleton, { width: 58, opacity: shimmerAnim }]}/>
77
+ </react_native_1.View>
78
+
79
+ {/* ─── List Cards Skeleton ─── */}
80
+ {Array.from({ length: cardCount }).map((_, i) => (<react_native_1.Animated.View key={`skeleton_card_${i}`} style={[skeletonStyles.cardSkeleton, { opacity: shimmerAnim }]}>
81
+ {/* Top row: Status pill + Method + Time */}
82
+ <react_native_1.View style={skeletonStyles.cardTopRow}>
83
+ <react_native_1.View style={skeletonStyles.badgeGroup}>
84
+ <react_native_1.View style={skeletonStyles.statusBadgeSkeleton}/>
85
+ <react_native_1.View style={skeletonStyles.methodBadgeSkeleton}/>
86
+ </react_native_1.View>
87
+ <react_native_1.View style={skeletonStyles.timeSkeleton}/>
88
+ </react_native_1.View>
89
+
90
+ {/* Middle row: URL lines */}
91
+ <react_native_1.View style={skeletonStyles.urlLineLong}/>
92
+ <react_native_1.View style={skeletonStyles.urlLineShort}/>
93
+
94
+ {/* Bottom row: Latency & Size */}
95
+ <react_native_1.View style={skeletonStyles.cardBottomRow}>
96
+ <react_native_1.View style={skeletonStyles.metaPillSkeleton}/>
97
+ <react_native_1.View style={skeletonStyles.metaPillSkeleton}/>
98
+ </react_native_1.View>
99
+ </react_native_1.Animated.View>))}
100
+ </react_native_1.View>);
101
+ });
102
+ const skeletonStyles = react_native_1.StyleSheet.create({
103
+ container: {
104
+ flex: 1,
105
+ paddingHorizontal: 12,
106
+ paddingTop: 8,
107
+ },
108
+ toolbarSkeleton: {
109
+ flexDirection: 'row',
110
+ alignItems: 'center',
111
+ gap: 8,
112
+ marginBottom: 8,
113
+ },
114
+ searchBarSkeleton: {
115
+ flex: 1,
116
+ height: 36,
117
+ borderRadius: 8,
118
+ backgroundColor: AppColors_1.AppColors.graySurface,
119
+ borderWidth: 1,
120
+ borderColor: AppColors_1.AppColors.dividerColor,
121
+ },
122
+ actionButtonsRow: {
123
+ flexDirection: 'row',
124
+ gap: 6,
125
+ },
126
+ iconButtonSkeleton: {
127
+ width: 36,
128
+ height: 36,
129
+ borderRadius: 8,
130
+ backgroundColor: AppColors_1.AppColors.graySurface,
131
+ borderWidth: 1,
132
+ borderColor: AppColors_1.AppColors.dividerColor,
133
+ },
134
+ chipStripSkeleton: {
135
+ flexDirection: 'row',
136
+ gap: 6,
137
+ marginBottom: 10,
138
+ },
139
+ chipSkeleton: {
140
+ height: 24,
141
+ borderRadius: 6,
142
+ backgroundColor: AppColors_1.AppColors.graySurface,
143
+ borderWidth: 1,
144
+ borderColor: AppColors_1.AppColors.dividerColor,
145
+ },
146
+ cardSkeleton: {
147
+ backgroundColor: AppColors_1.AppColors.primaryLight,
148
+ borderRadius: 10,
149
+ padding: 12,
150
+ marginBottom: 8,
151
+ borderWidth: 1,
152
+ borderColor: AppColors_1.AppColors.dividerColor,
153
+ },
154
+ cardTopRow: {
155
+ flexDirection: 'row',
156
+ justifyContent: 'space-between',
157
+ alignItems: 'center',
158
+ marginBottom: 8,
159
+ },
160
+ badgeGroup: {
161
+ flexDirection: 'row',
162
+ alignItems: 'center',
163
+ gap: 6,
164
+ },
165
+ statusBadgeSkeleton: {
166
+ width: 38,
167
+ height: 18,
168
+ borderRadius: 4,
169
+ backgroundColor: AppColors_1.AppColors.graySurface,
170
+ },
171
+ methodBadgeSkeleton: {
172
+ width: 44,
173
+ height: 18,
174
+ borderRadius: 4,
175
+ backgroundColor: AppColors_1.AppColors.graySurface,
176
+ },
177
+ timeSkeleton: {
178
+ width: 48,
179
+ height: 12,
180
+ borderRadius: 4,
181
+ backgroundColor: AppColors_1.AppColors.graySurface,
182
+ },
183
+ urlLineLong: {
184
+ height: 13,
185
+ borderRadius: 4,
186
+ backgroundColor: AppColors_1.AppColors.graySurface,
187
+ marginBottom: 5,
188
+ width: '90%',
189
+ },
190
+ urlLineShort: {
191
+ height: 11,
192
+ borderRadius: 4,
193
+ backgroundColor: AppColors_1.AppColors.graySurface,
194
+ marginBottom: 8,
195
+ width: '55%',
196
+ },
197
+ cardBottomRow: {
198
+ flexDirection: 'row',
199
+ gap: 8,
200
+ marginTop: 2,
201
+ },
202
+ metaPillSkeleton: {
203
+ width: 52,
204
+ height: 14,
205
+ borderRadius: 4,
206
+ backgroundColor: AppColors_1.AppColors.graySurface,
207
+ },
208
+ });
209
+ exports.default = exports.SkeletonPlaceholder;
package/dist/commonjs/components/SkeletonPlaceholder.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
- interface SkeletonPlaceholderProps {
2
+ export interface SkeletonPlaceholderProps {
3
3
  cardCount?: number;
4
4
  }
5
- declare const SkeletonPlaceholder: React.NamedExoticComponent<SkeletonPlaceholderProps>;
5
+ export declare const SkeletonPlaceholder: React.NamedExoticComponent<SkeletonPlaceholderProps>;
6
6
  export default SkeletonPlaceholder;
package/dist/commonjs/components/SkeletonPlaceholder.js CHANGED
@@ -33,10 +33,11 @@ var __importStar = (this && this.__importStar) || (function () {
33
33
  };
34
34
  })();
35
35
  Object.defineProperty(exports, "__esModule", { value: true });
36
+ exports.SkeletonPlaceholder = void 0;
36
37
  const react_1 = __importStar(require("react"));
37
38
  const react_native_1 = require("react-native");
38
39
  const AppColors_1 = require("../styles/AppColors");
39
- const SkeletonPlaceholder = react_1.default.memo(function SkeletonPlaceholder({ cardCount = 4, }) {
40
+ exports.SkeletonPlaceholder = react_1.default.memo(function SkeletonPlaceholder({ cardCount = 4, }) {
40
41
  const shimmerAnim = (0, react_1.useRef)(new react_native_1.Animated.Value(0.35)).current;
41
42
  (0, react_1.useEffect)(() => {
42
43
  const animation = react_native_1.Animated.loop(react_native_1.Animated.sequence([
@@ -205,4 +206,4 @@ const skeletonStyles = react_native_1.StyleSheet.create({
205
206
  backgroundColor: AppColors_1.AppColors.graySurface,
206
207
  },
207
208
  });
208
- exports.default = SkeletonPlaceholder;
209
+ exports.default = exports.SkeletonPlaceholder;
package/dist/commonjs/constants/version.d.ts CHANGED
@@ -1 +1 @@
1
- export declare const LIB_VERSION = "2.3.2";
1
+ export declare const LIB_VERSION = "2.3.4";
package/dist/commonjs/constants/version.js CHANGED
@@ -3,4 +3,4 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.LIB_VERSION = void 0;
4
4
  // AUTO-GENERATED FILE — do not edit by hand.
5
5
  // Regenerated from package.json on every build by scripts/gen-version.js.
6
- exports.LIB_VERSION = '2.3.2';
6
+ exports.LIB_VERSION = '2.3.4';
package/dist/commonjs/index.d.ts CHANGED
@@ -8,6 +8,7 @@ export { setupAnalyticsLogger, logAnalyticsEvent, subscribeAnalyticsEvents, clea
8
8
  export { setupGlobalCrashHandler, subscribeCrashEvents, emitCrashEvent, getCrashRecords, clearCrashRecords, simulateTestCrash, exportCrashReport, parseCrashStackTrace, recordCustomCrash, addCrashBreadcrumb, recordNavigationBreadcrumb, recordNetworkBreadcrumb, recordReduxBreadcrumb, recordUserActionBreadcrumb, computeCrashFingerprint, type CrashEventPayload, } from './customHooks/crashHandler';
9
9
  export { default as CrashTab } from './components/Inspector/CrashTab';
10
10
  export { default as ErrorBoundary } from './components/ErrorBoundary';
11
+ export { default as SkeletonPlaceholder } from './components/SkeletonPlaceholder';
11
12
  export { connectReduxStore, inspectorReduxMiddleware, getReduxState, subscribeReduxState, getActionHistory, clearActionHistory, getLastActionForReducer, } from './customHooks/reduxLogger';
12
13
  export { getEventCategory, registerGAPlugin, type GAPlugin, } from './helpers/gaAnalyticsRegistry';
13
14
  export { usePerformanceTracker, useComponentProfiler, useNavigationProfiler, trackComponentRender, trackNavigationTransition, trackHeavyTask, measureAsync, getHermesMemoryStats, registerComponentProfile, subscribeRenderProfiles, getRenderProfiles, logPerformanceEvent, clearPerformanceEvents, subscribePerformanceEvents, getPerformanceEvents, getInitialRenderProfiles, getInitialPerformanceEvents, generateFixSnippet, } from './customHooks/performanceTracker';
package/dist/commonjs/index.js CHANGED
@@ -36,9 +36,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
36
36
  return (mod && mod.__esModule) ? mod : { "default": mod };
37
37
  };
38
38
  Object.defineProperty(exports, "__esModule", { value: true });
39
- exports.registerComponentProfile = exports.getHermesMemoryStats = exports.measureAsync = exports.trackHeavyTask = exports.trackNavigationTransition = exports.trackComponentRender = exports.useNavigationProfiler = exports.useComponentProfiler = exports.usePerformanceTracker = exports.registerGAPlugin = exports.getEventCategory = exports.getLastActionForReducer = exports.clearActionHistory = exports.getActionHistory = exports.subscribeReduxState = exports.getReduxState = exports.inspectorReduxMiddleware = exports.connectReduxStore = exports.ErrorBoundary = exports.CrashTab = exports.computeCrashFingerprint = exports.recordUserActionBreadcrumb = exports.recordReduxBreadcrumb = exports.recordNetworkBreadcrumb = exports.recordNavigationBreadcrumb = exports.addCrashBreadcrumb = exports.recordCustomCrash = exports.parseCrashStackTrace = exports.exportCrashReport = exports.simulateTestCrash = exports.clearCrashRecords = exports.getCrashRecords = exports.emitCrashEvent = exports.subscribeCrashEvents = exports.setupGlobalCrashHandler = exports.getCollectionEnabled = exports.getDefaultEventParameters = exports.getCurrentUserId = exports.getCurrentUserProperties = exports.clearAnalyticsEvents = exports.subscribeAnalyticsEvents = exports.logAnalyticsEvent = exports.setupAnalyticsLogger = exports.subscribeConsoleLogs = exports.clearConsoleLogs = exports.setupConsoleLogger = exports.addAxiosInterceptors = exports.subscribeNetworkLogs = exports.clearNetworkLogs = exports.setupNetworkLogger = void 0;
40
- exports.connectMMKV = exports.connectAsyncStorage = exports.BrandCircleIcon = exports.BrandSquareIcon = exports.prunePerformanceEvents = exports.getMaxPerformanceEventsLimit = exports.setMaxPerformanceEventsLimit = exports.pruneCrashRecords = exports.getMaxCrashLogsLimit = exports.pruneAnalyticsLogs = exports.getMaxAnalyticsLogsLimit = exports.setMaxAnalyticsLogsLimit = exports.pruneReduxHistory = exports.getMaxReduxHistoryLimit = exports.setMaxReduxHistoryLimit = exports.pruneConsoleLogs = exports.getMaxConsoleLogsLimit = exports.setMaxConsoleLogsLimit = exports.pruneNetworkLogs = exports.getMaxNetworkLogsLimit = exports.setMaxNetworkLogsLimit = exports.subscribeMemoryWarning = exports.pruneAllLogs = exports.setupMemoryWarningHandler = exports.isNativeModuleAvailable = exports.setNativeStorageItem = exports.getNativeStorageItem = exports.getNativeFpsMetrics = exports.stopNativeFpsMonitoring = exports.startNativeFpsMonitoring = exports.subscribeNativeDeviceShake = exports.subscribeNativeFloatingButtonPress = exports.setNativeFloatingButtonBadge = exports.hideNativeFloatingButton = exports.showNativeFloatingButton = exports.subscribeNativeCrashes = exports.enableNativeCrashProtection = exports.getNativeDeviceMetrics = exports.InspectCatch = exports.InspectTrackTime = exports.InspectLog = exports.generateFixSnippet = exports.getInitialPerformanceEvents = exports.getInitialRenderProfiles = exports.getPerformanceEvents = exports.subscribePerformanceEvents = exports.clearPerformanceEvents = exports.logPerformanceEvent = exports.getRenderProfiles = exports.subscribeRenderProfiles = void 0;
41
- exports.I18nextProvider = exports.setTranslations = exports.addTranslations = exports.setLanguage = exports.useTranslation = exports.i18n = exports.t = exports.updateAppColorsTheme = exports.getThemeColors = exports.setAppColors = exports.AppColors = exports.setAppFonts = exports.AppFonts = exports.BreadcrumbType = exports.CrashFilterType = exports.CrashDetailSubTab = exports.CrashExportFormat = exports.CrashType = exports.PerformanceSubTab = exports.BundleSubTab = exports.DiffResultType = exports.StackFrameType = exports.GAEventCategory = exports.AnalyticsEventSource = exports.ConsoleLogType = exports.LogFilter = exports.SettingsSubTab = exports.SettingsPage = exports.ModalAnimationType = exports.LocalFilter = exports.SortOrder = exports.StatusFilter = exports.Method = exports.ActiveTab = exports.subscribeToStorageChanges = exports.clearStorageDriver = exports.removeStorageEntry = exports.setStorageEntry = exports.fetchStorageEntries = exports.getRegisteredMMKVInstanceIds = exports.isMMKVConnected = exports.isAsyncStorageConnected = void 0;
39
+ exports.getHermesMemoryStats = exports.measureAsync = exports.trackHeavyTask = exports.trackNavigationTransition = exports.trackComponentRender = exports.useNavigationProfiler = exports.useComponentProfiler = exports.usePerformanceTracker = exports.registerGAPlugin = exports.getEventCategory = exports.getLastActionForReducer = exports.clearActionHistory = exports.getActionHistory = exports.subscribeReduxState = exports.getReduxState = exports.inspectorReduxMiddleware = exports.connectReduxStore = exports.SkeletonPlaceholder = exports.ErrorBoundary = exports.CrashTab = exports.computeCrashFingerprint = exports.recordUserActionBreadcrumb = exports.recordReduxBreadcrumb = exports.recordNetworkBreadcrumb = exports.recordNavigationBreadcrumb = exports.addCrashBreadcrumb = exports.recordCustomCrash = exports.parseCrashStackTrace = exports.exportCrashReport = exports.simulateTestCrash = exports.clearCrashRecords = exports.getCrashRecords = exports.emitCrashEvent = exports.subscribeCrashEvents = exports.setupGlobalCrashHandler = exports.getCollectionEnabled = exports.getDefaultEventParameters = exports.getCurrentUserId = exports.getCurrentUserProperties = exports.clearAnalyticsEvents = exports.subscribeAnalyticsEvents = exports.logAnalyticsEvent = exports.setupAnalyticsLogger = exports.subscribeConsoleLogs = exports.clearConsoleLogs = exports.setupConsoleLogger = exports.addAxiosInterceptors = exports.subscribeNetworkLogs = exports.clearNetworkLogs = exports.setupNetworkLogger = void 0;
40
+ exports.connectAsyncStorage = exports.BrandCircleIcon = exports.BrandSquareIcon = exports.prunePerformanceEvents = exports.getMaxPerformanceEventsLimit = exports.setMaxPerformanceEventsLimit = exports.pruneCrashRecords = exports.getMaxCrashLogsLimit = exports.pruneAnalyticsLogs = exports.getMaxAnalyticsLogsLimit = exports.setMaxAnalyticsLogsLimit = exports.pruneReduxHistory = exports.getMaxReduxHistoryLimit = exports.setMaxReduxHistoryLimit = exports.pruneConsoleLogs = exports.getMaxConsoleLogsLimit = exports.setMaxConsoleLogsLimit = exports.pruneNetworkLogs = exports.getMaxNetworkLogsLimit = exports.setMaxNetworkLogsLimit = exports.subscribeMemoryWarning = exports.pruneAllLogs = exports.setupMemoryWarningHandler = exports.isNativeModuleAvailable = exports.setNativeStorageItem = exports.getNativeStorageItem = exports.getNativeFpsMetrics = exports.stopNativeFpsMonitoring = exports.startNativeFpsMonitoring = exports.subscribeNativeDeviceShake = exports.subscribeNativeFloatingButtonPress = exports.setNativeFloatingButtonBadge = exports.hideNativeFloatingButton = exports.showNativeFloatingButton = exports.subscribeNativeCrashes = exports.enableNativeCrashProtection = exports.getNativeDeviceMetrics = exports.InspectCatch = exports.InspectTrackTime = exports.InspectLog = exports.generateFixSnippet = exports.getInitialPerformanceEvents = exports.getInitialRenderProfiles = exports.getPerformanceEvents = exports.subscribePerformanceEvents = exports.clearPerformanceEvents = exports.logPerformanceEvent = exports.getRenderProfiles = exports.subscribeRenderProfiles = exports.registerComponentProfile = void 0;
41
+ exports.I18nextProvider = exports.setTranslations = exports.addTranslations = exports.setLanguage = exports.useTranslation = exports.i18n = exports.t = exports.updateAppColorsTheme = exports.getThemeColors = exports.setAppColors = exports.AppColors = exports.setAppFonts = exports.AppFonts = exports.BreadcrumbType = exports.CrashFilterType = exports.CrashDetailSubTab = exports.CrashExportFormat = exports.CrashType = exports.PerformanceSubTab = exports.BundleSubTab = exports.DiffResultType = exports.StackFrameType = exports.GAEventCategory = exports.AnalyticsEventSource = exports.ConsoleLogType = exports.LogFilter = exports.SettingsSubTab = exports.SettingsPage = exports.ModalAnimationType = exports.LocalFilter = exports.SortOrder = exports.StatusFilter = exports.Method = exports.ActiveTab = exports.subscribeToStorageChanges = exports.clearStorageDriver = exports.removeStorageEntry = exports.setStorageEntry = exports.fetchStorageEntries = exports.getRegisteredMMKVInstanceIds = exports.isMMKVConnected = exports.isAsyncStorageConnected = exports.connectMMKV = void 0;
42
42
  const react_1 = __importStar(require("react"));
43
43
  const react_native_1 = require("react-native");
44
44
  const native_1 = require("@react-navigation/native");
@@ -1939,6 +1939,8 @@ var CrashTab_1 = require("./components/Inspector/CrashTab");
1939
1939
  Object.defineProperty(exports, "CrashTab", { enumerable: true, get: function () { return __importDefault(CrashTab_1).default; } });
1940
1940
  var ErrorBoundary_2 = require("./components/ErrorBoundary");
1941
1941
  Object.defineProperty(exports, "ErrorBoundary", { enumerable: true, get: function () { return __importDefault(ErrorBoundary_2).default; } });
1942
+ var SkeletonPlaceholder_1 = require("./components/SkeletonPlaceholder");
1943
+ Object.defineProperty(exports, "SkeletonPlaceholder", { enumerable: true, get: function () { return __importDefault(SkeletonPlaceholder_1).default; } });
1942
1944
  var reduxLogger_2 = require("./customHooks/reduxLogger");
1943
1945
  Object.defineProperty(exports, "connectReduxStore", { enumerable: true, get: function () { return reduxLogger_2.connectReduxStore; } });
1944
1946
  Object.defineProperty(exports, "inspectorReduxMiddleware", { enumerable: true, get: function () { return reduxLogger_2.inspectorReduxMiddleware; } });
package/dist/esm/components/Inspector/MainScreen.js CHANGED
@@ -11,7 +11,7 @@ import LogDetail from './LogDetail';
11
11
  import ConsoleTab from './ConsoleTab';
12
12
  import AnalyticsTab from './AnalyticsTab';
13
13
  import AnalyticsDetail from '../AnalyticsDetail';
14
- import SkeletonPlaceholder from '../SkeletonPlaceholder';
14
+ import SkeletonPlaceholder from './SkeletonPlaceholder';
15
15
  import ReduxTab from './ReduxTab';
16
16
  import ReduxDetail from './ReduxDetail';
17
17
  import BundleTab from './BundleTab';
package/dist/esm/components/Inspector/SkeletonPlaceholder.d.ts ADDED
@@ -0,0 +1,6 @@
1
+ import React from 'react';
2
+ export interface SkeletonPlaceholderProps {
3
+ cardCount?: number;
4
+ }
5
+ export declare const SkeletonPlaceholder: React.NamedExoticComponent<SkeletonPlaceholderProps>;
6
+ export default SkeletonPlaceholder;
package/dist/esm/components/Inspector/SkeletonPlaceholder.js ADDED
@@ -0,0 +1,173 @@
1
+ import React, { useEffect, useRef } from 'react';
2
+ import { Animated, StyleSheet, View } from 'react-native';
3
+ import { AppColors } from '../../styles/AppColors';
4
+ export const SkeletonPlaceholder = React.memo(function SkeletonPlaceholder({ cardCount = 4, }) {
5
+ const shimmerAnim = useRef(new Animated.Value(0.35)).current;
6
+ useEffect(() => {
7
+ const animation = Animated.loop(Animated.sequence([
8
+ Animated.timing(shimmerAnim, {
9
+ toValue: 0.85,
10
+ duration: 750,
11
+ useNativeDriver: true,
12
+ }),
13
+ Animated.timing(shimmerAnim, {
14
+ toValue: 0.35,
15
+ duration: 750,
16
+ useNativeDriver: true,
17
+ }),
18
+ ]));
19
+ animation.start();
20
+ return () => animation.stop();
21
+ }, [shimmerAnim]);
22
+ return (<View style={skeletonStyles.container}>
23
+ {/* ─── Search & Scope Toolbar Skeleton ─── */}
24
+ <View style={skeletonStyles.toolbarSkeleton}>
25
+ <Animated.View style={[
26
+ skeletonStyles.searchBarSkeleton,
27
+ { opacity: shimmerAnim },
28
+ ]}/>
29
+ <View style={skeletonStyles.actionButtonsRow}>
30
+ <Animated.View style={[skeletonStyles.iconButtonSkeleton, { opacity: shimmerAnim }]}/>
31
+ <Animated.View style={[skeletonStyles.iconButtonSkeleton, { opacity: shimmerAnim }]}/>
32
+ </View>
33
+ </View>
34
+
35
+ {/* ─── Quick Filter Chips Skeleton Strip ─── */}
36
+ <View style={skeletonStyles.chipStripSkeleton}>
37
+ <Animated.View style={[skeletonStyles.chipSkeleton, { width: 48, opacity: shimmerAnim }]}/>
38
+ <Animated.View style={[skeletonStyles.chipSkeleton, { width: 68, opacity: shimmerAnim }]}/>
39
+ <Animated.View style={[skeletonStyles.chipSkeleton, { width: 76, opacity: shimmerAnim }]}/>
40
+ <Animated.View style={[skeletonStyles.chipSkeleton, { width: 58, opacity: shimmerAnim }]}/>
41
+ </View>
42
+
43
+ {/* ─── List Cards Skeleton ─── */}
44
+ {Array.from({ length: cardCount }).map((_, i) => (<Animated.View key={`skeleton_card_${i}`} style={[skeletonStyles.cardSkeleton, { opacity: shimmerAnim }]}>
45
+ {/* Top row: Status pill + Method + Time */}
46
+ <View style={skeletonStyles.cardTopRow}>
47
+ <View style={skeletonStyles.badgeGroup}>
48
+ <View style={skeletonStyles.statusBadgeSkeleton}/>
49
+ <View style={skeletonStyles.methodBadgeSkeleton}/>
50
+ </View>
51
+ <View style={skeletonStyles.timeSkeleton}/>
52
+ </View>
53
+
54
+ {/* Middle row: URL lines */}
55
+ <View style={skeletonStyles.urlLineLong}/>
56
+ <View style={skeletonStyles.urlLineShort}/>
57
+
58
+ {/* Bottom row: Latency & Size */}
59
+ <View style={skeletonStyles.cardBottomRow}>
60
+ <View style={skeletonStyles.metaPillSkeleton}/>
61
+ <View style={skeletonStyles.metaPillSkeleton}/>
62
+ </View>
63
+ </Animated.View>))}
64
+ </View>);
65
+ });
66
+ const skeletonStyles = StyleSheet.create({
67
+ container: {
68
+ flex: 1,
69
+ paddingHorizontal: 12,
70
+ paddingTop: 8,
71
+ },
72
+ toolbarSkeleton: {
73
+ flexDirection: 'row',
74
+ alignItems: 'center',
75
+ gap: 8,
76
+ marginBottom: 8,
77
+ },
78
+ searchBarSkeleton: {
79
+ flex: 1,
80
+ height: 36,
81
+ borderRadius: 8,
82
+ backgroundColor: AppColors.graySurface,
83
+ borderWidth: 1,
84
+ borderColor: AppColors.dividerColor,
85
+ },
86
+ actionButtonsRow: {
87
+ flexDirection: 'row',
88
+ gap: 6,
89
+ },
90
+ iconButtonSkeleton: {
91
+ width: 36,
92
+ height: 36,
93
+ borderRadius: 8,
94
+ backgroundColor: AppColors.graySurface,
95
+ borderWidth: 1,
96
+ borderColor: AppColors.dividerColor,
97
+ },
98
+ chipStripSkeleton: {
99
+ flexDirection: 'row',
100
+ gap: 6,
101
+ marginBottom: 10,
102
+ },
103
+ chipSkeleton: {
104
+ height: 24,
105
+ borderRadius: 6,
106
+ backgroundColor: AppColors.graySurface,
107
+ borderWidth: 1,
108
+ borderColor: AppColors.dividerColor,
109
+ },
110
+ cardSkeleton: {
111
+ backgroundColor: AppColors.primaryLight,
112
+ borderRadius: 10,
113
+ padding: 12,
114
+ marginBottom: 8,
115
+ borderWidth: 1,
116
+ borderColor: AppColors.dividerColor,
117
+ },
118
+ cardTopRow: {
119
+ flexDirection: 'row',
120
+ justifyContent: 'space-between',
121
+ alignItems: 'center',
122
+ marginBottom: 8,
123
+ },
124
+ badgeGroup: {
125
+ flexDirection: 'row',
126
+ alignItems: 'center',
127
+ gap: 6,
128
+ },
129
+ statusBadgeSkeleton: {
130
+ width: 38,
131
+ height: 18,
132
+ borderRadius: 4,
133
+ backgroundColor: AppColors.graySurface,
134
+ },
135
+ methodBadgeSkeleton: {
136
+ width: 44,
137
+ height: 18,
138
+ borderRadius: 4,
139
+ backgroundColor: AppColors.graySurface,
140
+ },
141
+ timeSkeleton: {
142
+ width: 48,
143
+ height: 12,
144
+ borderRadius: 4,
145
+ backgroundColor: AppColors.graySurface,
146
+ },
147
+ urlLineLong: {
148
+ height: 13,
149
+ borderRadius: 4,
150
+ backgroundColor: AppColors.graySurface,
151
+ marginBottom: 5,
152
+ width: '90%',
153
+ },
154
+ urlLineShort: {
155
+ height: 11,
156
+ borderRadius: 4,
157
+ backgroundColor: AppColors.graySurface,
158
+ marginBottom: 8,
159
+ width: '55%',
160
+ },
161
+ cardBottomRow: {
162
+ flexDirection: 'row',
163
+ gap: 8,
164
+ marginTop: 2,
165
+ },
166
+ metaPillSkeleton: {
167
+ width: 52,
168
+ height: 14,
169
+ borderRadius: 4,
170
+ backgroundColor: AppColors.graySurface,
171
+ },
172
+ });
173
+ export default SkeletonPlaceholder;
package/dist/esm/components/SkeletonPlaceholder.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
- interface SkeletonPlaceholderProps {
2
+ export interface SkeletonPlaceholderProps {
3
3
  cardCount?: number;
4
4
  }
5
- declare const SkeletonPlaceholder: React.NamedExoticComponent<SkeletonPlaceholderProps>;
5
+ export declare const SkeletonPlaceholder: React.NamedExoticComponent<SkeletonPlaceholderProps>;
6
6
  export default SkeletonPlaceholder;
package/dist/esm/components/SkeletonPlaceholder.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import React, { useEffect, useRef } from 'react';
2
2
  import { Animated, StyleSheet, View } from 'react-native';
3
3
  import { AppColors } from '../styles/AppColors';
4
- const SkeletonPlaceholder = React.memo(function SkeletonPlaceholder({ cardCount = 4, }) {
4
+ export const SkeletonPlaceholder = React.memo(function SkeletonPlaceholder({ cardCount = 4, }) {
5
5
  const shimmerAnim = useRef(new Animated.Value(0.35)).current;
6
6
  useEffect(() => {
7
7
  const animation = Animated.loop(Animated.sequence([
package/dist/esm/constants/version.d.ts CHANGED
@@ -1 +1 @@
1
- export declare const LIB_VERSION = "2.3.2";
1
+ export declare const LIB_VERSION = "2.3.4";
package/dist/esm/constants/version.js CHANGED
@@ -1,3 +1,3 @@
1
1
  // AUTO-GENERATED FILE — do not edit by hand.
2
2
  // Regenerated from package.json on every build by scripts/gen-version.js.
3
- export const LIB_VERSION = '2.3.2';
3
+ export const LIB_VERSION = '2.3.4';
package/dist/esm/index.d.ts CHANGED
@@ -8,6 +8,7 @@ export { setupAnalyticsLogger, logAnalyticsEvent, subscribeAnalyticsEvents, clea
8
8
  export { setupGlobalCrashHandler, subscribeCrashEvents, emitCrashEvent, getCrashRecords, clearCrashRecords, simulateTestCrash, exportCrashReport, parseCrashStackTrace, recordCustomCrash, addCrashBreadcrumb, recordNavigationBreadcrumb, recordNetworkBreadcrumb, recordReduxBreadcrumb, recordUserActionBreadcrumb, computeCrashFingerprint, type CrashEventPayload, } from './customHooks/crashHandler';
9
9
  export { default as CrashTab } from './components/Inspector/CrashTab';
10
10
  export { default as ErrorBoundary } from './components/ErrorBoundary';
11
+ export { default as SkeletonPlaceholder } from './components/SkeletonPlaceholder';
11
12
  export { connectReduxStore, inspectorReduxMiddleware, getReduxState, subscribeReduxState, getActionHistory, clearActionHistory, getLastActionForReducer, } from './customHooks/reduxLogger';
12
13
  export { getEventCategory, registerGAPlugin, type GAPlugin, } from './helpers/gaAnalyticsRegistry';
13
14
  export { usePerformanceTracker, useComponentProfiler, useNavigationProfiler, trackComponentRender, trackNavigationTransition, trackHeavyTask, measureAsync, getHermesMemoryStats, registerComponentProfile, subscribeRenderProfiles, getRenderProfiles, logPerformanceEvent, clearPerformanceEvents, subscribePerformanceEvents, getPerformanceEvents, getInitialRenderProfiles, getInitialPerformanceEvents, generateFixSnippet, } from './customHooks/performanceTracker';
package/dist/esm/index.js CHANGED
@@ -1866,6 +1866,7 @@ export { setupAnalyticsLogger, logAnalyticsEvent, subscribeAnalyticsEvents, clea
1866
1866
  export { setupGlobalCrashHandler, subscribeCrashEvents, emitCrashEvent, getCrashRecords, clearCrashRecords, simulateTestCrash, exportCrashReport, parseCrashStackTrace, recordCustomCrash, addCrashBreadcrumb, recordNavigationBreadcrumb, recordNetworkBreadcrumb, recordReduxBreadcrumb, recordUserActionBreadcrumb, computeCrashFingerprint, } from './customHooks/crashHandler';
1867
1867
  export { default as CrashTab } from './components/Inspector/CrashTab';
1868
1868
  export { default as ErrorBoundary } from './components/ErrorBoundary';
1869
+ export { default as SkeletonPlaceholder } from './components/SkeletonPlaceholder';
1869
1870
  export { connectReduxStore, inspectorReduxMiddleware, getReduxState, subscribeReduxState, getActionHistory, clearActionHistory, getLastActionForReducer, } from './customHooks/reduxLogger';
1870
1871
  export { getEventCategory, registerGAPlugin, } from './helpers/gaAnalyticsRegistry';
1871
1872
  export { usePerformanceTracker, useComponentProfiler, useNavigationProfiler, trackComponentRender, trackNavigationTransition, trackHeavyTask, measureAsync, getHermesMemoryStats, registerComponentProfile, subscribeRenderProfiles, getRenderProfiles, logPerformanceEvent, clearPerformanceEvents, subscribePerformanceEvents, getPerformanceEvents, getInitialRenderProfiles, getInitialPerformanceEvents, generateFixSnippet, } from './customHooks/performanceTracker';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-native-inapp-inspector",
3
- "version": "2.3.2",
3
+ "version": "2.3.4",
4
4
  "description": "The zero-config, all-in-one in-app debugger for React Native & Expo. Inspect Network (fetch/axios), Console logs, Stack Traces, Redux State, Firebase Analytics, and JS Bundle size directly on device.",
5
5
  "repository": {
6
6
  "type": "git",
package/src/components/Inspector/MainScreen.tsx CHANGED
@@ -21,7 +21,7 @@ import LogDetail from './LogDetail';
21
21
  import ConsoleTab from './ConsoleTab';
22
22
  import AnalyticsTab from './AnalyticsTab';
23
23
  import AnalyticsDetail from '../AnalyticsDetail';
24
- import SkeletonPlaceholder from '../SkeletonPlaceholder';
24
+ import SkeletonPlaceholder from './SkeletonPlaceholder';
25
25
  import ReduxTab from './ReduxTab';
26
26
  import ReduxDetail from './ReduxDetail';
27
27
  import BundleTab from './BundleTab';
package/src/components/Inspector/SkeletonPlaceholder.tsx ADDED
@@ -0,0 +1,206 @@
1
+ import React, {useEffect, useRef} from 'react';
2
+ import {Animated, StyleSheet, View} from 'react-native';
3
+ import {AppColors} from '../../styles/AppColors';
4
+
5
+ export interface SkeletonPlaceholderProps {
6
+ cardCount?: number;
7
+ }
8
+
9
+ export const SkeletonPlaceholder = React.memo(function SkeletonPlaceholder({
10
+ cardCount = 4,
11
+ }: SkeletonPlaceholderProps) {
12
+ const shimmerAnim = useRef(new Animated.Value(0.35)).current;
13
+
14
+ useEffect(() => {
15
+ const animation = Animated.loop(
16
+ Animated.sequence([
17
+ Animated.timing(shimmerAnim, {
18
+ toValue: 0.85,
19
+ duration: 750,
20
+ useNativeDriver: true,
21
+ }),
22
+ Animated.timing(shimmerAnim, {
23
+ toValue: 0.35,
24
+ duration: 750,
25
+ useNativeDriver: true,
26
+ }),
27
+ ]),
28
+ );
29
+ animation.start();
30
+ return () => animation.stop();
31
+ }, [shimmerAnim]);
32
+
33
+ return (
34
+ <View style={skeletonStyles.container}>
35
+ {/* ─── Search & Scope Toolbar Skeleton ─── */}
36
+ <View style={skeletonStyles.toolbarSkeleton}>
37
+ <Animated.View
38
+ style={[
39
+ skeletonStyles.searchBarSkeleton,
40
+ {opacity: shimmerAnim},
41
+ ]}
42
+ />
43
+ <View style={skeletonStyles.actionButtonsRow}>
44
+ <Animated.View
45
+ style={[skeletonStyles.iconButtonSkeleton, {opacity: shimmerAnim}]}
46
+ />
47
+ <Animated.View
48
+ style={[skeletonStyles.iconButtonSkeleton, {opacity: shimmerAnim}]}
49
+ />
50
+ </View>
51
+ </View>
52
+
53
+ {/* ─── Quick Filter Chips Skeleton Strip ─── */}
54
+ <View style={skeletonStyles.chipStripSkeleton}>
55
+ <Animated.View
56
+ style={[skeletonStyles.chipSkeleton, {width: 48, opacity: shimmerAnim}]}
57
+ />
58
+ <Animated.View
59
+ style={[skeletonStyles.chipSkeleton, {width: 68, opacity: shimmerAnim}]}
60
+ />
61
+ <Animated.View
62
+ style={[skeletonStyles.chipSkeleton, {width: 76, opacity: shimmerAnim}]}
63
+ />
64
+ <Animated.View
65
+ style={[skeletonStyles.chipSkeleton, {width: 58, opacity: shimmerAnim}]}
66
+ />
67
+ </View>
68
+
69
+ {/* ─── List Cards Skeleton ─── */}
70
+ {Array.from({length: cardCount}).map((_, i) => (
71
+ <Animated.View
72
+ key={`skeleton_card_${i}`}
73
+ style={[skeletonStyles.cardSkeleton, {opacity: shimmerAnim}]}>
74
+ {/* Top row: Status pill + Method + Time */}
75
+ <View style={skeletonStyles.cardTopRow}>
76
+ <View style={skeletonStyles.badgeGroup}>
77
+ <View style={skeletonStyles.statusBadgeSkeleton} />
78
+ <View style={skeletonStyles.methodBadgeSkeleton} />
79
+ </View>
80
+ <View style={skeletonStyles.timeSkeleton} />
81
+ </View>
82
+
83
+ {/* Middle row: URL lines */}
84
+ <View style={skeletonStyles.urlLineLong} />
85
+ <View style={skeletonStyles.urlLineShort} />
86
+
87
+ {/* Bottom row: Latency & Size */}
88
+ <View style={skeletonStyles.cardBottomRow}>
89
+ <View style={skeletonStyles.metaPillSkeleton} />
90
+ <View style={skeletonStyles.metaPillSkeleton} />
91
+ </View>
92
+ </Animated.View>
93
+ ))}
94
+ </View>
95
+ );
96
+ });
97
+
98
+ const skeletonStyles = StyleSheet.create({
99
+ container: {
100
+ flex: 1,
101
+ paddingHorizontal: 12,
102
+ paddingTop: 8,
103
+ },
104
+ toolbarSkeleton: {
105
+ flexDirection: 'row',
106
+ alignItems: 'center',
107
+ gap: 8,
108
+ marginBottom: 8,
109
+ },
110
+ searchBarSkeleton: {
111
+ flex: 1,
112
+ height: 36,
113
+ borderRadius: 8,
114
+ backgroundColor: AppColors.graySurface,
115
+ borderWidth: 1,
116
+ borderColor: AppColors.dividerColor,
117
+ },
118
+ actionButtonsRow: {
119
+ flexDirection: 'row',
120
+ gap: 6,
121
+ },
122
+ iconButtonSkeleton: {
123
+ width: 36,
124
+ height: 36,
125
+ borderRadius: 8,
126
+ backgroundColor: AppColors.graySurface,
127
+ borderWidth: 1,
128
+ borderColor: AppColors.dividerColor,
129
+ },
130
+ chipStripSkeleton: {
131
+ flexDirection: 'row',
132
+ gap: 6,
133
+ marginBottom: 10,
134
+ },
135
+ chipSkeleton: {
136
+ height: 24,
137
+ borderRadius: 6,
138
+ backgroundColor: AppColors.graySurface,
139
+ borderWidth: 1,
140
+ borderColor: AppColors.dividerColor,
141
+ },
142
+ cardSkeleton: {
143
+ backgroundColor: AppColors.primaryLight,
144
+ borderRadius: 10,
145
+ padding: 12,
146
+ marginBottom: 8,
147
+ borderWidth: 1,
148
+ borderColor: AppColors.dividerColor,
149
+ },
150
+ cardTopRow: {
151
+ flexDirection: 'row',
152
+ justifyContent: 'space-between',
153
+ alignItems: 'center',
154
+ marginBottom: 8,
155
+ },
156
+ badgeGroup: {
157
+ flexDirection: 'row',
158
+ alignItems: 'center',
159
+ gap: 6,
160
+ },
161
+ statusBadgeSkeleton: {
162
+ width: 38,
163
+ height: 18,
164
+ borderRadius: 4,
165
+ backgroundColor: AppColors.graySurface,
166
+ },
167
+ methodBadgeSkeleton: {
168
+ width: 44,
169
+ height: 18,
170
+ borderRadius: 4,
171
+ backgroundColor: AppColors.graySurface,
172
+ },
173
+ timeSkeleton: {
174
+ width: 48,
175
+ height: 12,
176
+ borderRadius: 4,
177
+ backgroundColor: AppColors.graySurface,
178
+ },
179
+ urlLineLong: {
180
+ height: 13,
181
+ borderRadius: 4,
182
+ backgroundColor: AppColors.graySurface,
183
+ marginBottom: 5,
184
+ width: '90%',
185
+ },
186
+ urlLineShort: {
187
+ height: 11,
188
+ borderRadius: 4,
189
+ backgroundColor: AppColors.graySurface,
190
+ marginBottom: 8,
191
+ width: '55%',
192
+ },
193
+ cardBottomRow: {
194
+ flexDirection: 'row',
195
+ gap: 8,
196
+ marginTop: 2,
197
+ },
198
+ metaPillSkeleton: {
199
+ width: 52,
200
+ height: 14,
201
+ borderRadius: 4,
202
+ backgroundColor: AppColors.graySurface,
203
+ },
204
+ });
205
+
206
+ export default SkeletonPlaceholder;
package/src/components/SkeletonPlaceholder.tsx CHANGED
@@ -2,11 +2,11 @@ import React, {useEffect, useRef} from 'react';
2
2
  import {Animated, StyleSheet, View} from 'react-native';
3
3
  import {AppColors} from '../styles/AppColors';
4
4
 
5
- interface SkeletonPlaceholderProps {
5
+ export interface SkeletonPlaceholderProps {
6
6
  cardCount?: number;
7
7
  }
8
8
 
9
- const SkeletonPlaceholder = React.memo(function SkeletonPlaceholder({
9
+ export const SkeletonPlaceholder = React.memo(function SkeletonPlaceholder({
10
10
  cardCount = 4,
11
11
  }: SkeletonPlaceholderProps) {
12
12
  const shimmerAnim = useRef(new Animated.Value(0.35)).current;
package/src/constants/version.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  // AUTO-GENERATED FILE — do not edit by hand.
2
2
  // Regenerated from package.json on every build by scripts/gen-version.js.
3
- export const LIB_VERSION = '2.3.2';
3
+ export const LIB_VERSION = '2.3.4';
package/src/index.tsx CHANGED
@@ -2245,6 +2245,7 @@ export {
2245
2245
 
2246
2246
  export {default as CrashTab} from './components/Inspector/CrashTab';
2247
2247
  export {default as ErrorBoundary} from './components/ErrorBoundary';
2248
+ export {default as SkeletonPlaceholder} from './components/SkeletonPlaceholder';
2248
2249
 
2249
2250
  export {
2250
2251
  connectReduxStore,