react-native-inapp-inspector 2.0.4 → 2.0.5

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 (46) hide show
  1. package/android/.gradle/8.9/checksums/checksums.lock +0 -0
  2. package/android/.gradle/8.9/checksums/md5-checksums.bin +0 -0
  3. package/android/.gradle/8.9/checksums/sha1-checksums.bin +0 -0
  4. package/android/.gradle/8.9/dependencies-accessors/gc.properties +0 -0
  5. package/android/.gradle/8.9/executionHistory/executionHistory.lock +0 -0
  6. package/android/.gradle/8.9/fileChanges/last-build.bin +0 -0
  7. package/android/.gradle/8.9/fileHashes/fileHashes.lock +0 -0
  8. package/android/.gradle/8.9/gc.properties +0 -0
  9. package/android/.gradle/9.2.0/checksums/checksums.lock +0 -0
  10. package/android/.gradle/9.2.0/fileChanges/last-build.bin +0 -0
  11. package/android/.gradle/9.2.0/fileHashes/fileHashes.bin +0 -0
  12. package/android/.gradle/9.2.0/fileHashes/fileHashes.lock +0 -0
  13. package/android/.gradle/9.2.0/gc.properties +0 -0
  14. package/android/.gradle/buildOutputCleanup/buildOutputCleanup.lock +0 -0
  15. package/android/.gradle/buildOutputCleanup/cache.properties +2 -0
  16. package/android/.gradle/vcs-1/gc.properties +0 -0
  17. package/android/build/reports/problems/problems-report.html +659 -0
  18. package/dist/commonjs/components/Inspector/InspectorHeader.js +87 -50
  19. package/dist/commonjs/components/Inspector/MainScreen.js +1 -0
  20. package/dist/commonjs/components/Inspector/NetworkTab.js +317 -12
  21. package/dist/commonjs/components/Inspector/NpmUpdateToast.js +88 -39
  22. package/dist/commonjs/components/Inspector/SettingsPanel.js +525 -359
  23. package/dist/commonjs/components/Inspector/UpdateAvailableModal.d.ts +8 -0
  24. package/dist/commonjs/components/Inspector/UpdateAvailableModal.js +469 -0
  25. package/dist/commonjs/constants/version.d.ts +1 -1
  26. package/dist/commonjs/constants/version.js +1 -1
  27. package/dist/commonjs/helpers/searchQueryParser.d.ts +8 -3
  28. package/dist/commonjs/helpers/searchQueryParser.js +85 -31
  29. package/dist/commonjs/helpers/telemetry.js +4 -4
  30. package/dist/commonjs/index.js +58 -7
  31. package/dist/commonjs/types/interfaces.d.ts +9 -0
  32. package/dist/esm/components/Inspector/InspectorHeader.js +87 -50
  33. package/dist/esm/components/Inspector/MainScreen.js +1 -0
  34. package/dist/esm/components/Inspector/NetworkTab.js +317 -12
  35. package/dist/esm/components/Inspector/NpmUpdateToast.js +88 -39
  36. package/dist/esm/components/Inspector/SettingsPanel.js +526 -360
  37. package/dist/esm/components/Inspector/UpdateAvailableModal.d.ts +8 -0
  38. package/dist/esm/components/Inspector/UpdateAvailableModal.js +432 -0
  39. package/dist/esm/constants/version.d.ts +1 -1
  40. package/dist/esm/constants/version.js +1 -1
  41. package/dist/esm/helpers/searchQueryParser.d.ts +8 -3
  42. package/dist/esm/helpers/searchQueryParser.js +85 -31
  43. package/dist/esm/helpers/telemetry.js +4 -4
  44. package/dist/esm/index.js +58 -7
  45. package/dist/esm/types/interfaces.d.ts +9 -0
  46. package/package.json +1 -1
package/dist/commonjs/components/Inspector/SettingsPanel.js CHANGED
@@ -57,9 +57,12 @@ const analyticsLogger_2 = require("../../customHooks/analyticsLogger");
57
57
  const i18n_1 = require("../../i18n");
58
58
  const telemetry_1 = require("../../helpers/telemetry");
59
59
  const NetworkIcons_1 = require("../NetworkIcons");
60
+ const constants_1 = require("../../constants");
61
+ const helpers_1 = require("../../helpers");
62
+ const toast_1 = require("../../helpers/toast");
60
63
  const SettingsPanel = () => {
61
64
  const { t } = (0, i18n_1.useTranslation)();
62
- const { settingsPage, setSettingsPage, settingsActiveSubTab, setSettingsActiveSubTab, tabVisibility, toggleTabVisibility, defaultTab, setDefaultTab, isDark, setIsDark, modalHeightPercent, setModalHeightPercent, modalAnimationType, setModalAnimationType, showDuplicateLogs, setShowDuplicateLogs, showUpdateToast, setShowUpdateToast, showConsoleLevels, setShowConsoleLevels, resetToDefaults, storage, logs, consoleLogs, analyticsEvents, reduxState, maxNetworkLogs, setMaxNetworkLogs, maxConsoleLogs, setMaxConsoleLogs, maxAnalyticsEventsLimit, setMaxAnalyticsEventsLimit, isAutoRamLimitEnabled, setIsAutoRamLimitEnabled, deviceFreeRamMb, reduxAutoRefresh, setReduxAutoRefreshState, reduxExpandDepth, setReduxExpandDepth, switchActiveTab, setSelected, setSelectedEvent, setReduxState, crashRecords, maxCrashLogs, setMaxCrashLogs, } = (0, InspectorContext_1.useInspector)();
65
+ const { settingsPage, setSettingsPage, settingsActiveSubTab, setSettingsActiveSubTab, tabVisibility, toggleTabVisibility, defaultTab, setDefaultTab, isDark, setIsDark, modalHeightPercent, setModalHeightPercent, modalAnimationType, setModalAnimationType, showDuplicateLogs, setShowDuplicateLogs, showUpdateToast, setShowUpdateToast, showConsoleLevels, setShowConsoleLevels, resetToDefaults, storage, logs, consoleLogs, analyticsEvents, reduxState, maxNetworkLogs, setMaxNetworkLogs, maxConsoleLogs, setMaxConsoleLogs, maxAnalyticsEventsLimit, setMaxAnalyticsEventsLimit, isAutoRamLimitEnabled, setIsAutoRamLimitEnabled, deviceFreeRamMb, reduxAutoRefresh, setReduxAutoRefreshState, reduxExpandDepth, setReduxExpandDepth, switchActiveTab, setSelected, setSelectedEvent, setReduxState, crashRecords, maxCrashLogs, setMaxCrashLogs, updateAvailable, latestNpmVersion, } = (0, InspectorContext_1.useInspector)();
63
66
  const [stagedHeight, setStagedHeight] = (0, react_1.useState)(modalHeightPercent);
64
67
  const [telemetryConsent, setTelemetryConsentState] = (0, react_1.useState)(true);
65
68
  (0, react_1.useEffect)(() => {
@@ -258,13 +261,15 @@ const SettingsPanel = () => {
258
261
  MAX
259
262
  </react_native_1.Text>
260
263
  </react_native_1.View>
261
- {opts.numericInput.min !== undefined || opts.numericInput.max !== undefined ? (<react_native_1.Text style={{
264
+ {opts.numericInput.min !== undefined ||
265
+ opts.numericInput.max !== undefined ? (<react_native_1.Text style={{
262
266
  fontFamily: AppFonts_1.AppFonts.interRegular,
263
267
  fontSize: 10,
264
268
  lineHeight: 13,
265
269
  color: AppColors_1.AppColors.grayTextWeak,
266
270
  }}>
267
- Range: {opts.numericInput.min ?? 1} - {opts.numericInput.max ?? '∞'}
271
+ Range: {opts.numericInput.min ?? 1} -{' '}
272
+ {opts.numericInput.max ?? '∞'}
268
273
  </react_native_1.Text>) : null}
269
274
  </react_native_1.View>)}
270
275
  {opts.picker && (<react_native_1.View style={{
@@ -307,8 +312,8 @@ const SettingsPanel = () => {
307
312
  backgroundColor: AppColors_1.AppColors.grayBackground,
308
313
  }}>
309
314
  <react_native_1.ScrollView style={{ flex: 1 }} contentContainerStyle={{ padding: 16, paddingBottom: 100, gap: 14 }} showsVerticalScrollIndicator={false}>
310
- {/* Segmented Top Navigation Sub-Tabs */}
311
- <react_native_1.View style={{
315
+ {/* Segmented Top Navigation Sub-Tabs */}
316
+ <react_native_1.View style={{
312
317
  flexDirection: 'row',
313
318
  backgroundColor: AppColors_1.AppColors.primaryLight,
314
319
  borderRadius: 12,
@@ -320,7 +325,7 @@ const SettingsPanel = () => {
320
325
  shadowRadius: 4,
321
326
  shadowOffset: { width: 0, height: 2 },
322
327
  }}>
323
- <TouchableScale_1.default accessible={true} accessibilityRole="tab" accessibilityLabel={t('settings.modulesAndTools')} accessibilityState={{ selected: settingsActiveSubTab === 'module' }} onPress={() => {
328
+ <TouchableScale_1.default accessible={true} accessibilityRole="tab" accessibilityLabel={t('settings.modulesAndTools')} accessibilityState={{ selected: settingsActiveSubTab === 'module' }} onPress={() => {
324
329
  (0, InspectorContext_1.animateNextLayout)();
325
330
  setSettingsActiveSubTab('module');
326
331
  }} style={{
@@ -335,10 +340,10 @@ const SettingsPanel = () => {
335
340
  ? AppColors_1.AppColors.purple
336
341
  : 'transparent',
337
342
  }}>
338
- <NetworkIcons_1.LayersIcon color={settingsActiveSubTab === 'module'
343
+ <NetworkIcons_1.LayersIcon color={settingsActiveSubTab === 'module'
339
344
  ? AppColors_1.AppColors.white
340
345
  : AppColors_1.AppColors.grayText} size={13}/>
341
- <react_native_1.Text style={{
346
+ <react_native_1.Text style={{
342
347
  fontFamily: AppFonts_1.AppFonts.interBold,
343
348
  fontSize: 12.5,
344
349
  lineHeight: 16,
@@ -346,11 +351,11 @@ const SettingsPanel = () => {
346
351
  ? AppColors_1.AppColors.white
347
352
  : AppColors_1.AppColors.grayText,
348
353
  }}>
349
- {t('settings.modulesAndTools')}
350
- </react_native_1.Text>
351
- </TouchableScale_1.default>
354
+ {t('settings.modulesAndTools')}
355
+ </react_native_1.Text>
356
+ </TouchableScale_1.default>
352
357
 
353
- <TouchableScale_1.default accessible={true} accessibilityRole="tab" accessibilityLabel={t('settings.uiPreferences')} accessibilityState={{ selected: settingsActiveSubTab === 'ui' }} onPress={() => {
358
+ <TouchableScale_1.default accessible={true} accessibilityRole="tab" accessibilityLabel={t('settings.uiPreferences')} accessibilityState={{ selected: settingsActiveSubTab === 'ui' }} onPress={() => {
354
359
  (0, InspectorContext_1.animateNextLayout)();
355
360
  setSettingsActiveSubTab('ui');
356
361
  }} style={{
@@ -365,10 +370,10 @@ const SettingsPanel = () => {
365
370
  ? AppColors_1.AppColors.purple
366
371
  : 'transparent',
367
372
  }}>
368
- <NetworkIcons_1.ScreenIcon color={settingsActiveSubTab === 'ui'
373
+ <NetworkIcons_1.ScreenIcon color={settingsActiveSubTab === 'ui'
369
374
  ? AppColors_1.AppColors.white
370
375
  : AppColors_1.AppColors.grayText} size={13}/>
371
- <react_native_1.Text style={{
376
+ <react_native_1.Text style={{
372
377
  fontFamily: AppFonts_1.AppFonts.interBold,
373
378
  fontSize: 12.5,
374
379
  lineHeight: 16,
@@ -376,15 +381,15 @@ const SettingsPanel = () => {
376
381
  ? AppColors_1.AppColors.white
377
382
  : AppColors_1.AppColors.grayText,
378
383
  }}>
379
- {t('settings.uiPreferences')}
380
- </react_native_1.Text>
381
- </TouchableScale_1.default>
382
- </react_native_1.View>
384
+ {t('settings.uiPreferences')}
385
+ </react_native_1.Text>
386
+ </TouchableScale_1.default>
387
+ </react_native_1.View>
383
388
 
384
- {settingsActiveSubTab === 'module' ? (<react_native_1.View style={{ gap: 12 }}>
385
- {/* Individual Module Cards with Left Checkboxes */}
386
- <react_native_1.View style={{ gap: 10 }}>
387
- {allModules.map(moduleItem => {
389
+ {settingsActiveSubTab === 'module' ? (<react_native_1.View style={{ gap: 12 }}>
390
+ {/* Individual Module Cards with Left Checkboxes */}
391
+ <react_native_1.View style={{ gap: 10 }}>
392
+ {allModules.map(moduleItem => {
388
393
  const isReduxAvail = (0, reduxLogger_1.isReduxConnected)();
389
394
  const isAnalyticsAvail = (0, analyticsLogger_2.isAnalyticsConnected)();
390
395
  const isUnavailable = (moduleItem.key === 'redux' && !isReduxAvail) ||
@@ -422,14 +427,14 @@ const SettingsPanel = () => {
422
427
  shadowRadius: 5,
423
428
  shadowOffset: { width: 0, height: 2 },
424
429
  }}>
425
- {/* Top Row: [Checkbox] -> [Icon Tile] -> [Title & Subtitle] */}
426
- <react_native_1.View style={{
430
+ {/* Top Row: [Checkbox] -> [Icon Tile] -> [Title & Subtitle] */}
431
+ <react_native_1.View style={{
427
432
  flexDirection: 'row',
428
433
  alignItems: 'flex-start',
429
434
  gap: 10,
430
435
  }}>
431
- {/* 1. Checkbox on the Left */}
432
- <TouchableScale_1.default accessible={true} accessibilityRole="checkbox" accessibilityLabel={`Select ${moduleItem.label}`} accessibilityState={{
436
+ {/* 1. Checkbox on the Left */}
437
+ <TouchableScale_1.default accessible={true} accessibilityRole="checkbox" accessibilityLabel={`Select ${moduleItem.label}`} accessibilityState={{
433
438
  checked: isChecked,
434
439
  disabled: isLocked,
435
440
  }} disabled={isLocked} onPress={() => {
@@ -462,14 +467,14 @@ const SettingsPanel = () => {
462
467
  shadowRadius: 2,
463
468
  elevation: isChecked ? 2 : 0,
464
469
  }}>
465
- {moduleItem.key === 'apis' ? (<NetworkIcons_1.CheckIcon size={12} color={AppColors_1.AppColors.blue500}/>) : isChecked ? (<NetworkIcons_1.CheckIcon size={12} color={AppColors_1.AppColors.white}/>) : isLocked ? (<react_native_svg_1.default width={10} height={10} viewBox="0 0 24 24" fill="none">
466
- <react_native_svg_1.Path d="M7 10V7a5 5 0 0 1 10 0v3" stroke={AppColors_1.AppColors.grayText} strokeWidth="2.2" strokeLinecap="round"/>
467
- <react_native_svg_1.Path d="M5 10h14v9a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1z" fill={AppColors_1.AppColors.grayText}/>
468
- </react_native_svg_1.default>) : null}
469
- </TouchableScale_1.default>
470
+ {moduleItem.key === 'apis' ? (<NetworkIcons_1.CheckIcon size={12} color={AppColors_1.AppColors.blue500}/>) : isChecked ? (<NetworkIcons_1.CheckIcon size={12} color={AppColors_1.AppColors.white}/>) : isLocked ? (<react_native_svg_1.default width={10} height={10} viewBox="0 0 24 24" fill="none">
471
+ <react_native_svg_1.Path d="M7 10V7a5 5 0 0 1 10 0v3" stroke={AppColors_1.AppColors.grayText} strokeWidth="2.2" strokeLinecap="round"/>
472
+ <react_native_svg_1.Path d="M5 10h14v9a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1z" fill={AppColors_1.AppColors.grayText}/>
473
+ </react_native_svg_1.default>) : null}
474
+ </TouchableScale_1.default>
470
475
 
471
- {/* 2. Middle Tap Zone: Icon + Title & Desc */}
472
- <TouchableScale_1.default accessible={true} accessibilityRole="button" accessibilityLabel={`${moduleItem.label} settings`} disabled={isUnavailable} onPress={() => {
476
+ {/* 2. Middle Tap Zone: Icon + Title & Desc */}
477
+ <TouchableScale_1.default accessible={true} accessibilityRole="button" accessibilityLabel={`${moduleItem.label} settings`} disabled={isUnavailable} onPress={() => {
473
478
  (0, InspectorContext_1.animateNextLayout)();
474
479
  setSettingsPage(moduleItem.key);
475
480
  }} style={{
@@ -478,8 +483,8 @@ const SettingsPanel = () => {
478
483
  alignItems: 'flex-start',
479
484
  gap: 10,
480
485
  }}>
481
- {/* Icon Tile */}
482
- <react_native_1.View style={{
486
+ {/* Icon Tile */}
487
+ <react_native_1.View style={{
483
488
  width: 36,
484
489
  height: 36,
485
490
  borderRadius: 10,
@@ -498,38 +503,38 @@ const SettingsPanel = () => {
498
503
  justifyContent: 'center',
499
504
  marginTop: 1,
500
505
  }}>
501
- {moduleItem.icon === 'apis' && (<NetworkIcons_1.SignalIcon color={isChecked
506
+ {moduleItem.icon === 'apis' && (<NetworkIcons_1.SignalIcon color={isChecked
502
507
  ? AppColors_1.AppColors.purple
503
508
  : AppColors_1.AppColors.grayTextWeak} size={16}/>)}
504
- {moduleItem.icon === 'logs' && (<NetworkIcons_1.TerminalIcon color={isChecked
509
+ {moduleItem.icon === 'logs' && (<NetworkIcons_1.TerminalIcon color={isChecked
505
510
  ? AppColors_1.AppColors.purple
506
511
  : AppColors_1.AppColors.grayTextWeak} size={16}/>)}
507
- {moduleItem.icon === 'performance' && (<NetworkIcons_1.PerformanceIcon color={isChecked
512
+ {moduleItem.icon === 'performance' && (<NetworkIcons_1.PerformanceIcon color={isChecked
508
513
  ? AppColors_1.AppColors.purple
509
514
  : AppColors_1.AppColors.grayTextWeak} size={16}/>)}
510
- {moduleItem.icon === 'bundle' && (<NetworkIcons_1.PackageIcon color={isChecked
515
+ {moduleItem.icon === 'bundle' && (<NetworkIcons_1.PackageIcon color={isChecked
511
516
  ? AppColors_1.AppColors.purple
512
517
  : AppColors_1.AppColors.grayTextWeak} size={16}/>)}
513
- {moduleItem.icon === 'crash' && (<NetworkIcons_1.CrashIcon color={isChecked
518
+ {moduleItem.icon === 'crash' && (<NetworkIcons_1.CrashIcon color={isChecked
514
519
  ? AppColors_1.AppColors.purple
515
520
  : AppColors_1.AppColors.grayTextWeak} size={16}/>)}
516
- {moduleItem.icon === 'analytics' && (<NetworkIcons_1.AnalyticsIcon color={isChecked
521
+ {moduleItem.icon === 'analytics' && (<NetworkIcons_1.AnalyticsIcon color={isChecked
517
522
  ? AppColors_1.AppColors.purple
518
523
  : AppColors_1.AppColors.grayTextWeak} size={16}/>)}
519
- {moduleItem.icon === 'redux' && (<NetworkIcons_1.ReduxIcon color={isChecked
524
+ {moduleItem.icon === 'redux' && (<NetworkIcons_1.ReduxIcon color={isChecked
520
525
  ? AppColors_1.AppColors.purple
521
526
  : AppColors_1.AppColors.grayTextWeak} size={16}/>)}
522
- </react_native_1.View>
527
+ </react_native_1.View>
523
528
 
524
- {/* Titles & Status Pill */}
525
- <react_native_1.View style={{ flex: 1, gap: 2 }}>
526
- <react_native_1.View style={{
529
+ {/* Titles & Status Pill */}
530
+ <react_native_1.View style={{ flex: 1, gap: 2 }}>
531
+ <react_native_1.View style={{
527
532
  flexDirection: 'row',
528
533
  alignItems: 'center',
529
534
  gap: 6,
530
535
  flexWrap: 'wrap',
531
536
  }}>
532
- <react_native_1.Text style={{
537
+ <react_native_1.Text style={{
533
538
  fontFamily: AppFonts_1.AppFonts.interBold,
534
539
  fontSize: 14,
535
540
  lineHeight: 18,
@@ -537,11 +542,11 @@ const SettingsPanel = () => {
537
542
  ? AppColors_1.AppColors.grayText
538
543
  : AppColors_1.AppColors.primaryBlack,
539
544
  }}>
540
- {moduleItem.label}
541
- </react_native_1.Text>
545
+ {moduleItem.label}
546
+ </react_native_1.Text>
542
547
 
543
- {/* Default Startup Tab Badge */}
544
- {moduleItem.key === defaultTab &&
548
+ {/* Default Startup Tab Badge */}
549
+ {moduleItem.key === defaultTab &&
545
550
  !isUnavailable && (<react_native_1.View style={{
546
551
  flexDirection: 'row',
547
552
  alignItems: 'center',
@@ -553,25 +558,25 @@ const SettingsPanel = () => {
553
558
  borderColor: `${AppColors_1.AppColors.purple}2E`,
554
559
  gap: 3,
555
560
  }}>
556
- <react_native_1.View style={{
561
+ <react_native_1.View style={{
557
562
  width: 4,
558
563
  height: 4,
559
564
  borderRadius: 2,
560
565
  backgroundColor: AppColors_1.AppColors.purple,
561
566
  }}/>
562
- <react_native_1.Text style={{
567
+ <react_native_1.Text style={{
563
568
  fontFamily: AppFonts_1.AppFonts.interBold,
564
569
  fontSize: 8,
565
570
  lineHeight: 11,
566
571
  color: AppColors_1.AppColors.purple,
567
572
  letterSpacing: 0.4,
568
573
  }}>
569
- {t('settings.defaultBadge')}
570
- </react_native_1.Text>
571
- </react_native_1.View>)}
574
+ {t('settings.defaultBadge')}
575
+ </react_native_1.Text>
576
+ </react_native_1.View>)}
572
577
 
573
- {/* Status Pill */}
574
- {moduleItem.key === 'apis' ? (<react_native_1.View style={{
578
+ {/* Status Pill */}
579
+ {moduleItem.key === 'apis' ? (<react_native_1.View style={{
575
580
  backgroundColor: `${AppColors_1.AppColors.blue500}14`,
576
581
  borderRadius: 4,
577
582
  paddingHorizontal: 5,
@@ -579,16 +584,16 @@ const SettingsPanel = () => {
579
584
  borderWidth: 1,
580
585
  borderColor: `${AppColors_1.AppColors.blue500}33`,
581
586
  }}>
582
- <react_native_1.Text style={{
587
+ <react_native_1.Text style={{
583
588
  fontFamily: AppFonts_1.AppFonts.interBold,
584
589
  fontSize: 8,
585
590
  lineHeight: 11,
586
591
  color: AppColors_1.AppColors.blue500,
587
592
  letterSpacing: 0.3,
588
593
  }}>
589
- {t('settings.coreBadge')}
590
- </react_native_1.Text>
591
- </react_native_1.View>) : isUnavailable ? (<react_native_1.View style={{
594
+ {t('settings.coreBadge')}
595
+ </react_native_1.Text>
596
+ </react_native_1.View>) : isUnavailable ? (<react_native_1.View style={{
592
597
  backgroundColor: `${AppColors_1.AppColors.amber500}18`,
593
598
  borderRadius: 4,
594
599
  paddingHorizontal: 5,
@@ -596,18 +601,18 @@ const SettingsPanel = () => {
596
601
  borderWidth: 1,
597
602
  borderColor: `${AppColors_1.AppColors.amber500}35`,
598
603
  }}>
599
- <react_native_1.Text style={{
604
+ <react_native_1.Text style={{
600
605
  fontFamily: AppFonts_1.AppFonts.interBold,
601
606
  fontSize: 8,
602
607
  lineHeight: 11,
603
608
  color: AppColors_1.AppColors.amber700,
604
609
  letterSpacing: 0.3,
605
610
  }}>
606
- {moduleItem.key === 'redux'
611
+ {moduleItem.key === 'redux'
607
612
  ? t('settings.notConnectedBadge')
608
613
  : t('settings.notDetectedBadge')}
609
- </react_native_1.Text>
610
- </react_native_1.View>) : isChecked ? (<react_native_1.View style={{
614
+ </react_native_1.Text>
615
+ </react_native_1.View>) : isChecked ? (<react_native_1.View style={{
611
616
  backgroundColor: `${AppColors_1.AppColors.liveGreen}18`,
612
617
  borderRadius: 4,
613
618
  paddingHorizontal: 5,
@@ -615,16 +620,16 @@ const SettingsPanel = () => {
615
620
  borderWidth: 1,
616
621
  borderColor: `${AppColors_1.AppColors.liveGreen}38`,
617
622
  }}>
618
- <react_native_1.Text style={{
623
+ <react_native_1.Text style={{
619
624
  fontFamily: AppFonts_1.AppFonts.interBold,
620
625
  fontSize: 8,
621
626
  lineHeight: 11,
622
627
  color: AppColors_1.AppColors.green700,
623
628
  letterSpacing: 0.3,
624
629
  }}>
625
- {t('settings.activeBadge')}
626
- </react_native_1.Text>
627
- </react_native_1.View>) : (<react_native_1.View style={{
630
+ {t('settings.activeBadge')}
631
+ </react_native_1.Text>
632
+ </react_native_1.View>) : (<react_native_1.View style={{
628
633
  backgroundColor: `${AppColors_1.AppColors.grayTextWeak}18`,
629
634
  borderRadius: 4,
630
635
  paddingHorizontal: 5,
@@ -632,33 +637,33 @@ const SettingsPanel = () => {
632
637
  borderWidth: 1,
633
638
  borderColor: `${AppColors_1.AppColors.grayTextWeak}2E`,
634
639
  }}>
635
- <react_native_1.Text style={{
640
+ <react_native_1.Text style={{
636
641
  fontFamily: AppFonts_1.AppFonts.interBold,
637
642
  fontSize: 8,
638
643
  lineHeight: 11,
639
644
  color: AppColors_1.AppColors.grayTextWeak,
640
645
  letterSpacing: 0.3,
641
646
  }}>
642
- {t('settings.dormantBadge')}
643
- </react_native_1.Text>
644
- </react_native_1.View>)}
645
- </react_native_1.View>
647
+ {t('settings.dormantBadge')}
648
+ </react_native_1.Text>
649
+ </react_native_1.View>)}
650
+ </react_native_1.View>
646
651
 
647
- <react_native_1.Text style={{
652
+ <react_native_1.Text style={{
648
653
  fontFamily: AppFonts_1.AppFonts.interRegular,
649
654
  fontSize: 11,
650
655
  color: AppColors_1.AppColors.grayText,
651
656
  lineHeight: 15,
652
657
  marginTop: 1,
653
658
  }}>
654
- {moduleItem.desc}
655
- </react_native_1.Text>
656
- </react_native_1.View>
657
- </TouchableScale_1.default>
658
- </react_native_1.View>
659
+ {moduleItem.desc}
660
+ </react_native_1.Text>
661
+ </react_native_1.View>
662
+ </TouchableScale_1.default>
663
+ </react_native_1.View>
659
664
 
660
- {/* Card Footer: Live Stats + Configure Button */}
661
- {!isUnavailable && (<react_native_1.View style={{
665
+ {/* Card Footer: Live Stats + Configure Button */}
666
+ {!isUnavailable && (<react_native_1.View style={{
662
667
  flexDirection: 'row',
663
668
  alignItems: 'center',
664
669
  justifyContent: 'space-between',
@@ -666,14 +671,14 @@ const SettingsPanel = () => {
666
671
  borderTopWidth: 1,
667
672
  borderTopColor: AppColors_1.AppColors.dividerColor,
668
673
  }}>
669
- {/* Live Info Pill */}
670
- <react_native_1.View style={{
674
+ {/* Live Info Pill */}
675
+ <react_native_1.View style={{
671
676
  flexDirection: 'row',
672
677
  alignItems: 'center',
673
678
  gap: 6,
674
679
  flex: 1,
675
680
  }}>
676
- <react_native_1.View style={{
681
+ <react_native_1.View style={{
677
682
  width: 6,
678
683
  height: 6,
679
684
  borderRadius: 3,
@@ -681,18 +686,18 @@ const SettingsPanel = () => {
681
686
  ? AppColors_1.AppColors.liveGreen
682
687
  : AppColors_1.AppColors.grayTextWeak,
683
688
  }}/>
684
- <react_native_1.Text style={{
689
+ <react_native_1.Text style={{
685
690
  fontFamily: AppFonts_1.AppFonts.interMedium,
686
691
  fontSize: 11,
687
692
  color: AppColors_1.AppColors.grayText,
688
693
  lineHeight: 14,
689
694
  }}>
690
- {liveStats}
691
- </react_native_1.Text>
692
- </react_native_1.View>
695
+ {liveStats}
696
+ </react_native_1.Text>
697
+ </react_native_1.View>
693
698
 
694
- {/* Sleek Configure Button */}
695
- <TouchableScale_1.default accessible={true} accessibilityRole="button" accessibilityLabel={`Configure ${moduleItem.label} settings`} onPress={() => {
699
+ {/* Sleek Configure Button */}
700
+ <TouchableScale_1.default accessible={true} accessibilityRole="button" accessibilityLabel={`Configure ${moduleItem.label} settings`} onPress={() => {
696
701
  (0, InspectorContext_1.animateNextLayout)();
697
702
  setSettingsPage(moduleItem.key);
698
703
  }} style={{
@@ -706,24 +711,24 @@ const SettingsPanel = () => {
706
711
  borderWidth: 1,
707
712
  borderColor: `${AppColors_1.AppColors.purple}26`,
708
713
  }}>
709
- <NetworkIcons_1.SettingsIcon color={AppColors_1.AppColors.purple} size={11}/>
710
- <react_native_1.Text style={{
714
+ <NetworkIcons_1.SettingsIcon color={AppColors_1.AppColors.purple} size={11}/>
715
+ <react_native_1.Text style={{
711
716
  fontFamily: AppFonts_1.AppFonts.interBold,
712
717
  fontSize: 11,
713
718
  lineHeight: 14,
714
719
  color: AppColors_1.AppColors.purple,
715
720
  }}>
716
- {t('settings.configure')}
717
- </react_native_1.Text>
718
- <NetworkIcons_1.ForwardChevronIcon color={AppColors_1.AppColors.purple} size={9}/>
719
- </TouchableScale_1.default>
720
- </react_native_1.View>)}
721
- </react_native_1.View>);
721
+ {t('settings.configure')}
722
+ </react_native_1.Text>
723
+ <NetworkIcons_1.ForwardChevronIcon color={AppColors_1.AppColors.purple} size={9}/>
724
+ </TouchableScale_1.default>
725
+ </react_native_1.View>)}
726
+ </react_native_1.View>);
722
727
  })}
723
- </react_native_1.View>
728
+ </react_native_1.View>
724
729
 
725
- {/* Section 3.5: RAM-Based Auto Limits */}
726
- <react_native_1.View style={{
730
+ {/* Section 3.5: RAM-Based Auto Limits */}
731
+ <react_native_1.View style={{
727
732
  backgroundColor: AppColors_1.AppColors.primaryLight,
728
733
  borderRadius: 14,
729
734
  borderWidth: 1,
@@ -732,29 +737,29 @@ const SettingsPanel = () => {
732
737
  padding: 14,
733
738
  gap: 12,
734
739
  }}>
735
- <react_native_1.Text style={{
740
+ <react_native_1.Text style={{
736
741
  fontFamily: AppFonts_1.AppFonts.interBold,
737
742
  fontSize: 11,
738
743
  lineHeight: 14,
739
744
  color: AppColors_1.AppColors.grayTextWeak,
740
745
  letterSpacing: 0.8,
741
746
  }}>
742
- RAM-Based Auto Limits
743
- </react_native_1.Text>
747
+ RAM-Based Auto Limits
748
+ </react_native_1.Text>
744
749
 
745
- {/* Auto RAM Limit Toggle */}
746
- <react_native_1.View style={{
750
+ {/* Auto RAM Limit Toggle */}
751
+ <react_native_1.View style={{
747
752
  flexDirection: 'row',
748
753
  alignItems: 'center',
749
754
  justifyContent: 'space-between',
750
755
  }}>
751
- <react_native_1.View style={{
756
+ <react_native_1.View style={{
752
757
  flexDirection: 'row',
753
758
  alignItems: 'center',
754
759
  gap: 10,
755
760
  flex: 1,
756
761
  }}>
757
- <react_native_1.View style={{
762
+ <react_native_1.View style={{
758
763
  width: 32,
759
764
  height: 32,
760
765
  borderRadius: 8,
@@ -762,30 +767,31 @@ const SettingsPanel = () => {
762
767
  alignItems: 'center',
763
768
  justifyContent: 'center',
764
769
  }}>
765
- <NetworkIcons_1.PerformanceIcon color={AppColors_1.AppColors.purple} size={15}/>
766
- </react_native_1.View>
767
- <react_native_1.View style={{ flex: 1 }}>
768
- <react_native_1.Text style={{
770
+ <NetworkIcons_1.PerformanceIcon color={AppColors_1.AppColors.purple} size={15}/>
771
+ </react_native_1.View>
772
+ <react_native_1.View style={{ flex: 1 }}>
773
+ <react_native_1.Text style={{
769
774
  fontFamily: AppFonts_1.AppFonts.interBold,
770
775
  fontSize: 13.5,
771
776
  lineHeight: 18,
772
777
  color: AppColors_1.AppColors.primaryBlack,
773
778
  }}>
774
- Auto-Calculate Limits from Device RAM
775
- </react_native_1.Text>
776
- <react_native_1.Text style={{
779
+ Auto-Calculate Limits from Device RAM
780
+ </react_native_1.Text>
781
+ <react_native_1.Text style={{
777
782
  fontFamily: AppFonts_1.AppFonts.interRegular,
778
783
  fontSize: 11,
779
784
  lineHeight: 15,
780
785
  color: AppColors_1.AppColors.grayText,
781
786
  marginTop: 1,
782
787
  }}>
783
- Automatically set API, Logs, Analytics & Crash limits based on available memory
784
- </react_native_1.Text>
785
- </react_native_1.View>
788
+ Automatically set API, Logs, Analytics & Crash limits
789
+ based on available memory
790
+ </react_native_1.Text>
786
791
  </react_native_1.View>
792
+ </react_native_1.View>
787
793
 
788
- <TouchableScale_1.default accessible={true} accessibilityRole="switch" accessibilityLabel="Toggle auto RAM limit calculation" accessibilityState={{ checked: isAutoRamLimitEnabled }} onPress={() => setIsAutoRamLimitEnabled(prev => !prev)} style={{
794
+ <TouchableScale_1.default accessible={true} accessibilityRole="switch" accessibilityLabel="Toggle auto RAM limit calculation" accessibilityState={{ checked: isAutoRamLimitEnabled }} onPress={() => setIsAutoRamLimitEnabled(prev => !prev)} style={{
789
795
  width: 42,
790
796
  height: 24,
791
797
  borderRadius: 12,
@@ -794,9 +800,11 @@ const SettingsPanel = () => {
794
800
  : AppColors_1.AppColors.grayBorderSecondary,
795
801
  padding: 2,
796
802
  justifyContent: 'center',
797
- alignItems: isAutoRamLimitEnabled ? 'flex-end' : 'flex-start',
803
+ alignItems: isAutoRamLimitEnabled
804
+ ? 'flex-end'
805
+ : 'flex-start',
798
806
  }}>
799
- <react_native_1.View style={{
807
+ <react_native_1.View style={{
800
808
  width: 20,
801
809
  height: 20,
802
810
  borderRadius: 10,
@@ -806,14 +814,14 @@ const SettingsPanel = () => {
806
814
  shadowRadius: 2,
807
815
  shadowOffset: { width: 0, height: 1 },
808
816
  }}/>
809
- </TouchableScale_1.default>
810
- </react_native_1.View>
817
+ </TouchableScale_1.default>
818
+ </react_native_1.View>
811
819
 
812
- <react_native_1.View style={{ height: 1, backgroundColor: AppColors_1.AppColors.dividerColor }}/>
820
+ <react_native_1.View style={{ height: 1, backgroundColor: AppColors_1.AppColors.dividerColor }}/>
813
821
 
814
- {/* Device Free RAM Display */}
815
- <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 10 }}>
816
- <react_native_1.View style={{
822
+ {/* Device Free RAM Display */}
823
+ <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 10 }}>
824
+ <react_native_1.View style={{
817
825
  width: 32,
818
826
  height: 32,
819
827
  borderRadius: 8,
@@ -823,10 +831,12 @@ const SettingsPanel = () => {
823
831
  alignItems: 'center',
824
832
  justifyContent: 'center',
825
833
  }}>
826
- <NetworkIcons_1.SignalIcon color={isAutoRamLimitEnabled ? AppColors_1.AppColors.purple : AppColors_1.AppColors.grayTextWeak} size={15}/>
827
- </react_native_1.View>
828
- <react_native_1.View style={{ flex: 1 }}>
829
- <react_native_1.Text style={{
834
+ <NetworkIcons_1.SignalIcon color={isAutoRamLimitEnabled
835
+ ? AppColors_1.AppColors.purple
836
+ : AppColors_1.AppColors.grayTextWeak} size={15}/>
837
+ </react_native_1.View>
838
+ <react_native_1.View style={{ flex: 1 }}>
839
+ <react_native_1.Text style={{
830
840
  fontFamily: AppFonts_1.AppFonts.interBold,
831
841
  fontSize: 13.5,
832
842
  lineHeight: 18,
@@ -834,19 +844,19 @@ const SettingsPanel = () => {
834
844
  ? AppColors_1.AppColors.primaryBlack
835
845
  : AppColors_1.AppColors.grayText,
836
846
  }}>
837
- Detected Free RAM
838
- </react_native_1.Text>
839
- <react_native_1.Text style={{
847
+ Detected Free RAM
848
+ </react_native_1.Text>
849
+ <react_native_1.Text style={{
840
850
  fontFamily: AppFonts_1.AppFonts.interRegular,
841
851
  fontSize: 11,
842
852
  lineHeight: 15,
843
853
  color: AppColors_1.AppColors.grayText,
844
854
  marginTop: 1,
845
855
  }}>
846
- {deviceFreeRamMb} MB available
847
- </react_native_1.Text>
848
- </react_native_1.View>
849
- <react_native_1.View style={{
856
+ {deviceFreeRamMb} MB available
857
+ </react_native_1.Text>
858
+ </react_native_1.View>
859
+ <react_native_1.View style={{
850
860
  paddingHorizontal: 10,
851
861
  paddingVertical: 5,
852
862
  borderRadius: 8,
@@ -858,7 +868,7 @@ const SettingsPanel = () => {
858
868
  ? `${AppColors_1.AppColors.purple}26`
859
869
  : AppColors_1.AppColors.dividerColor,
860
870
  }}>
861
- <react_native_1.Text style={{
871
+ <react_native_1.Text style={{
862
872
  fontFamily: AppFonts_1.AppFonts.interBold,
863
873
  fontSize: 12,
864
874
  lineHeight: 15,
@@ -866,27 +876,49 @@ const SettingsPanel = () => {
866
876
  ? AppColors_1.AppColors.purple
867
877
  : AppColors_1.AppColors.grayText,
868
878
  }}>
869
- {deviceFreeRamMb} MB
870
- </react_native_1.Text>
871
- </react_native_1.View>
879
+ {deviceFreeRamMb} MB
880
+ </react_native_1.Text>
872
881
  </react_native_1.View>
882
+ </react_native_1.View>
873
883
 
874
- {/* Current Auto-Calculated Limits Preview */}
875
- {isAutoRamLimitEnabled && (<react_native_1.View style={{ marginTop: 8, paddingTop: 8, borderTopWidth: 1, borderTopColor: AppColors_1.AppColors.dividerColor, gap: 6 }}>
876
- <react_native_1.Text style={{
884
+ {/* Current Auto-Calculated Limits Preview */}
885
+ {isAutoRamLimitEnabled && (<react_native_1.View style={{
886
+ marginTop: 8,
887
+ paddingTop: 8,
888
+ borderTopWidth: 1,
889
+ borderTopColor: AppColors_1.AppColors.dividerColor,
890
+ gap: 6,
891
+ }}>
892
+ <react_native_1.Text style={{
877
893
  fontFamily: AppFonts_1.AppFonts.interBold,
878
894
  fontSize: 11.5,
879
895
  lineHeight: 15,
880
896
  color: AppColors_1.AppColors.purple,
881
897
  }}>
882
- Auto Profile: {autoRamProfile.profileName}
883
- </react_native_1.Text>
884
- <react_native_1.View style={{ flexDirection: 'row', flexWrap: 'wrap', gap: 8 }}>
885
- {[
886
- { label: 'APIs', value: autoRamProfile.maxNetworkLogs, color: AppColors_1.AppColors.blue500 },
887
- { label: 'Logs', value: autoRamProfile.maxConsoleLogs, color: AppColors_1.AppColors.sky500 },
888
- { label: 'Analytics', value: autoRamProfile.maxAnalyticsEvents, color: AppColors_1.AppColors.purple },
889
- { label: 'Crash', value: autoRamProfile.maxCrashRecords, color: AppColors_1.AppColors.errorColor },
898
+ Auto Profile: {autoRamProfile.profileName}
899
+ </react_native_1.Text>
900
+ <react_native_1.View style={{ flexDirection: 'row', flexWrap: 'wrap', gap: 8 }}>
901
+ {[
902
+ {
903
+ label: 'APIs',
904
+ value: autoRamProfile.maxNetworkLogs,
905
+ color: AppColors_1.AppColors.blue500,
906
+ },
907
+ {
908
+ label: 'Logs',
909
+ value: autoRamProfile.maxConsoleLogs,
910
+ color: AppColors_1.AppColors.sky500,
911
+ },
912
+ {
913
+ label: 'Analytics',
914
+ value: autoRamProfile.maxAnalyticsEvents,
915
+ color: AppColors_1.AppColors.purple,
916
+ },
917
+ {
918
+ label: 'Crash',
919
+ value: autoRamProfile.maxCrashRecords,
920
+ color: AppColors_1.AppColors.errorColor,
921
+ },
890
922
  ].map(item => (<react_native_1.View key={item.label} style={{
891
923
  flexDirection: 'row',
892
924
  alignItems: 'center',
@@ -898,29 +930,29 @@ const SettingsPanel = () => {
898
930
  borderWidth: 1,
899
931
  borderColor: `${item.color}33`,
900
932
  }}>
901
- <react_native_1.Text style={{
933
+ <react_native_1.Text style={{
902
934
  fontFamily: AppFonts_1.AppFonts.interBold,
903
935
  fontSize: 10.5,
904
936
  lineHeight: 14,
905
937
  color: item.color,
906
938
  }}>
907
- {item.label}
908
- </react_native_1.Text>
909
- <react_native_1.Text style={{
939
+ {item.label}
940
+ </react_native_1.Text>
941
+ <react_native_1.Text style={{
910
942
  fontFamily: AppFonts_1.AppFonts.interBold,
911
943
  fontSize: 10.5,
912
944
  lineHeight: 14,
913
945
  color: item.color,
914
946
  }}>
915
- {item.value}
916
- </react_native_1.Text>
917
- </react_native_1.View>))}
918
- </react_native_1.View>
919
- </react_native_1.View>)}
920
- </react_native_1.View>
921
- </react_native_1.View>) : (<react_native_1.View style={{ gap: 14 }}>
922
- {/* Section 1: Appearance */}
923
- <react_native_1.View style={{
947
+ {item.value}
948
+ </react_native_1.Text>
949
+ </react_native_1.View>))}
950
+ </react_native_1.View>
951
+ </react_native_1.View>)}
952
+ </react_native_1.View>
953
+ </react_native_1.View>) : (<react_native_1.View style={{ gap: 14 }}>
954
+ {/* Section 1: Appearance */}
955
+ <react_native_1.View style={{
924
956
  backgroundColor: AppColors_1.AppColors.primaryLight,
925
957
  borderRadius: 14,
926
958
  borderWidth: 1,
@@ -929,28 +961,28 @@ const SettingsPanel = () => {
929
961
  padding: 14,
930
962
  gap: 12,
931
963
  }}>
932
- <react_native_1.Text style={{
964
+ <react_native_1.Text style={{
933
965
  fontFamily: AppFonts_1.AppFonts.interBold,
934
966
  fontSize: 11,
935
967
  lineHeight: 14,
936
968
  color: AppColors_1.AppColors.grayTextWeak,
937
969
  letterSpacing: 0.8,
938
970
  }}>
939
- {t('settings.appearanceTheme')}
940
- </react_native_1.Text>
971
+ {t('settings.appearanceTheme')}
972
+ </react_native_1.Text>
941
973
 
942
- <react_native_1.View style={{
974
+ <react_native_1.View style={{
943
975
  flexDirection: 'row',
944
976
  alignItems: 'center',
945
977
  justifyContent: 'space-between',
946
978
  }}>
947
- <react_native_1.View style={{
979
+ <react_native_1.View style={{
948
980
  flexDirection: 'row',
949
981
  alignItems: 'center',
950
982
  gap: 10,
951
983
  flex: 1,
952
984
  }}>
953
- <react_native_1.View style={{
985
+ <react_native_1.View style={{
954
986
  width: 32,
955
987
  height: 32,
956
988
  borderRadius: 8,
@@ -958,30 +990,30 @@ const SettingsPanel = () => {
958
990
  alignItems: 'center',
959
991
  justifyContent: 'center',
960
992
  }}>
961
- {isDark ? (<NetworkIcons_1.SunIcon color={AppColors_1.AppColors.purple} size={15}/>) : (<NetworkIcons_1.MoonIcon color={AppColors_1.AppColors.purple} size={15}/>)}
962
- </react_native_1.View>
963
- <react_native_1.View style={{ flex: 1 }}>
964
- <react_native_1.Text style={{
993
+ {isDark ? (<NetworkIcons_1.SunIcon color={AppColors_1.AppColors.purple} size={15}/>) : (<NetworkIcons_1.MoonIcon color={AppColors_1.AppColors.purple} size={15}/>)}
994
+ </react_native_1.View>
995
+ <react_native_1.View style={{ flex: 1 }}>
996
+ <react_native_1.Text style={{
965
997
  fontFamily: AppFonts_1.AppFonts.interBold,
966
998
  fontSize: 13.5,
967
999
  lineHeight: 18,
968
1000
  color: AppColors_1.AppColors.primaryBlack,
969
1001
  }}>
970
- {t('settings.general.darkMode')}
971
- </react_native_1.Text>
972
- <react_native_1.Text style={{
1002
+ {t('settings.general.darkMode')}
1003
+ </react_native_1.Text>
1004
+ <react_native_1.Text style={{
973
1005
  fontFamily: AppFonts_1.AppFonts.interRegular,
974
1006
  fontSize: 11,
975
1007
  lineHeight: 15,
976
1008
  color: AppColors_1.AppColors.grayText,
977
1009
  marginTop: 1,
978
1010
  }}>
979
- {t('settings.general.darkModeDescription')}
980
- </react_native_1.Text>
981
- </react_native_1.View>
1011
+ {t('settings.general.darkModeDescription')}
1012
+ </react_native_1.Text>
982
1013
  </react_native_1.View>
1014
+ </react_native_1.View>
983
1015
 
984
- <TouchableScale_1.default accessible={true} accessibilityRole="switch" accessibilityLabel="Toggle Dark Theme" accessibilityState={{ checked: isDark }} onPress={() => {
1016
+ <TouchableScale_1.default accessible={true} accessibilityRole="switch" accessibilityLabel="Toggle Dark Theme" accessibilityState={{ checked: isDark }} onPress={() => {
985
1017
  const newTheme = !isDark;
986
1018
  setIsDark(newTheme);
987
1019
  (0, styles_1.toggleGlobalTheme)(newTheme);
@@ -996,7 +1028,7 @@ const SettingsPanel = () => {
996
1028
  justifyContent: 'center',
997
1029
  alignItems: isDark ? 'flex-end' : 'flex-start',
998
1030
  }}>
999
- <react_native_1.View style={{
1031
+ <react_native_1.View style={{
1000
1032
  width: 20,
1001
1033
  height: 20,
1002
1034
  borderRadius: 10,
@@ -1006,12 +1038,12 @@ const SettingsPanel = () => {
1006
1038
  shadowRadius: 2,
1007
1039
  shadowOffset: { width: 0, height: 1 },
1008
1040
  }}/>
1009
- </TouchableScale_1.default>
1010
- </react_native_1.View>
1041
+ </TouchableScale_1.default>
1011
1042
  </react_native_1.View>
1043
+ </react_native_1.View>
1012
1044
 
1013
- {/* Section 2: Window & Layout */}
1014
- <react_native_1.View style={{
1045
+ {/* Section 2: Window & Layout */}
1046
+ <react_native_1.View style={{
1015
1047
  backgroundColor: AppColors_1.AppColors.primaryLight,
1016
1048
  borderRadius: 14,
1017
1049
  borderWidth: 1,
@@ -1020,31 +1052,31 @@ const SettingsPanel = () => {
1020
1052
  padding: 14,
1021
1053
  gap: 14,
1022
1054
  }}>
1023
- <react_native_1.Text style={{
1055
+ <react_native_1.Text style={{
1024
1056
  fontFamily: AppFonts_1.AppFonts.interBold,
1025
1057
  fontSize: 11,
1026
1058
  lineHeight: 14,
1027
1059
  color: AppColors_1.AppColors.grayTextWeak,
1028
1060
  letterSpacing: 0.8,
1029
1061
  }}>
1030
- {t('settings.windowLayout')}
1031
- </react_native_1.Text>
1062
+ {t('settings.windowLayout')}
1063
+ </react_native_1.Text>
1032
1064
 
1033
- {/* Modal Height */}
1034
- <react_native_1.View style={{ gap: 8 }}>
1035
- <react_native_1.View style={{
1065
+ {/* Modal Height */}
1066
+ <react_native_1.View style={{ gap: 8 }}>
1067
+ <react_native_1.View style={{
1036
1068
  flexDirection: 'row',
1037
1069
  alignItems: 'center',
1038
1070
  justifyContent: 'space-between',
1039
1071
  gap: 10,
1040
1072
  }}>
1041
- <react_native_1.View style={{
1073
+ <react_native_1.View style={{
1042
1074
  flexDirection: 'row',
1043
1075
  alignItems: 'center',
1044
1076
  gap: 10,
1045
1077
  flex: 1,
1046
1078
  }}>
1047
- <react_native_1.View style={{
1079
+ <react_native_1.View style={{
1048
1080
  width: 32,
1049
1081
  height: 32,
1050
1082
  borderRadius: 8,
@@ -1052,30 +1084,30 @@ const SettingsPanel = () => {
1052
1084
  alignItems: 'center',
1053
1085
  justifyContent: 'center',
1054
1086
  }}>
1055
- <NetworkIcons_1.ScreenIcon color={AppColors_1.AppColors.purple} size={15}/>
1056
- </react_native_1.View>
1057
- <react_native_1.View style={{ flex: 1 }}>
1058
- <react_native_1.Text style={{
1087
+ <NetworkIcons_1.ScreenIcon color={AppColors_1.AppColors.purple} size={15}/>
1088
+ </react_native_1.View>
1089
+ <react_native_1.View style={{ flex: 1 }}>
1090
+ <react_native_1.Text style={{
1059
1091
  fontFamily: AppFonts_1.AppFonts.interBold,
1060
1092
  fontSize: 13.5,
1061
1093
  lineHeight: 18,
1062
1094
  color: AppColors_1.AppColors.primaryBlack,
1063
1095
  }}>
1064
- {t('settings.general.modalHeight')}
1065
- </react_native_1.Text>
1066
- <react_native_1.Text style={{
1096
+ {t('settings.general.modalHeight')}
1097
+ </react_native_1.Text>
1098
+ <react_native_1.Text style={{
1067
1099
  fontFamily: AppFonts_1.AppFonts.interRegular,
1068
1100
  fontSize: 11,
1069
1101
  lineHeight: 15,
1070
1102
  color: AppColors_1.AppColors.grayText,
1071
1103
  marginTop: 1,
1072
1104
  }}>
1073
- {t('settings.general.modalHeightDescription')}
1074
- </react_native_1.Text>
1075
- </react_native_1.View>
1105
+ {t('settings.general.modalHeightDescription')}
1106
+ </react_native_1.Text>
1076
1107
  </react_native_1.View>
1108
+ </react_native_1.View>
1077
1109
 
1078
- {stagedHeight !== modalHeightPercent && (<TouchableScale_1.default onPress={() => {
1110
+ {stagedHeight !== modalHeightPercent && (<TouchableScale_1.default onPress={() => {
1079
1111
  setModalHeightPercent(stagedHeight);
1080
1112
  }} style={{
1081
1113
  flexDirection: 'row',
@@ -1091,32 +1123,32 @@ const SettingsPanel = () => {
1091
1123
  shadowRadius: 2,
1092
1124
  elevation: 2,
1093
1125
  }}>
1094
- <NetworkIcons_1.CheckIcon size={11} color={AppColors_1.AppColors.white}/>
1095
- <react_native_1.Text style={{
1126
+ <NetworkIcons_1.CheckIcon size={11} color={AppColors_1.AppColors.white}/>
1127
+ <react_native_1.Text style={{
1096
1128
  fontFamily: AppFonts_1.AppFonts.interBold,
1097
1129
  fontSize: 11,
1098
1130
  color: AppColors_1.AppColors.white,
1099
1131
  }}>
1100
- Save ({stagedHeight}%)
1101
- </react_native_1.Text>
1102
- </TouchableScale_1.default>)}
1103
- </react_native_1.View>
1132
+ Save ({stagedHeight}%)
1133
+ </react_native_1.Text>
1134
+ </TouchableScale_1.default>)}
1135
+ </react_native_1.View>
1104
1136
 
1105
- <react_native_1.View style={{ marginTop: 6 }}>
1106
- <Slider_1.default value={stagedHeight} onValueChange={setStagedHeight} min={50} max={90} step={5} quickPresets={[50, 60, 70, 80, 90]} formatLabel={val => `${Math.round(val)}%`}/>
1107
- </react_native_1.View>
1137
+ <react_native_1.View style={{ marginTop: 6 }}>
1138
+ <Slider_1.default value={stagedHeight} onValueChange={setStagedHeight} min={50} max={90} step={5} quickPresets={[50, 60, 70, 80, 90]} formatLabel={val => `${Math.round(val)}%`}/>
1108
1139
  </react_native_1.View>
1140
+ </react_native_1.View>
1109
1141
 
1110
- <react_native_1.View style={{ height: 1, backgroundColor: AppColors_1.AppColors.dividerColor }}/>
1142
+ <react_native_1.View style={{ height: 1, backgroundColor: AppColors_1.AppColors.dividerColor }}/>
1111
1143
 
1112
- {/* Modal Animation */}
1113
- <react_native_1.View style={{ gap: 8 }}>
1114
- <react_native_1.View style={{
1144
+ {/* Modal Animation */}
1145
+ <react_native_1.View style={{ gap: 8 }}>
1146
+ <react_native_1.View style={{
1115
1147
  flexDirection: 'row',
1116
1148
  alignItems: 'center',
1117
1149
  gap: 10,
1118
1150
  }}>
1119
- <react_native_1.View style={{
1151
+ <react_native_1.View style={{
1120
1152
  width: 32,
1121
1153
  height: 32,
1122
1154
  borderRadius: 8,
@@ -1124,30 +1156,30 @@ const SettingsPanel = () => {
1124
1156
  alignItems: 'center',
1125
1157
  justifyContent: 'center',
1126
1158
  }}>
1127
- <NetworkIcons_1.MotionIcon color={AppColors_1.AppColors.purple} size={15}/>
1128
- </react_native_1.View>
1129
- <react_native_1.View style={{ flex: 1 }}>
1130
- <react_native_1.Text style={{
1159
+ <NetworkIcons_1.MotionIcon color={AppColors_1.AppColors.purple} size={15}/>
1160
+ </react_native_1.View>
1161
+ <react_native_1.View style={{ flex: 1 }}>
1162
+ <react_native_1.Text style={{
1131
1163
  fontFamily: AppFonts_1.AppFonts.interBold,
1132
1164
  fontSize: 13.5,
1133
1165
  lineHeight: 18,
1134
1166
  color: AppColors_1.AppColors.primaryBlack,
1135
1167
  }}>
1136
- {t('settings.general.modalAnimation')}
1137
- </react_native_1.Text>
1138
- <react_native_1.Text style={{
1168
+ {t('settings.general.modalAnimation')}
1169
+ </react_native_1.Text>
1170
+ <react_native_1.Text style={{
1139
1171
  fontFamily: AppFonts_1.AppFonts.interRegular,
1140
1172
  fontSize: 11,
1141
1173
  lineHeight: 15,
1142
1174
  color: AppColors_1.AppColors.grayText,
1143
1175
  marginTop: 1,
1144
1176
  }}>
1145
- {t('settings.general.modalAnimationDescription')}
1146
- </react_native_1.Text>
1147
- </react_native_1.View>
1177
+ {t('settings.general.modalAnimationDescription')}
1178
+ </react_native_1.Text>
1148
1179
  </react_native_1.View>
1180
+ </react_native_1.View>
1149
1181
 
1150
- <react_native_1.View style={{
1182
+ <react_native_1.View style={{
1151
1183
  flexDirection: 'row',
1152
1184
  backgroundColor: AppColors_1.AppColors.grayBackground,
1153
1185
  borderRadius: 10,
@@ -1155,7 +1187,7 @@ const SettingsPanel = () => {
1155
1187
  borderWidth: 1,
1156
1188
  borderColor: AppColors_1.AppColors.dividerColor,
1157
1189
  }}>
1158
- {[
1190
+ {[
1159
1191
  { key: 'slide', label: 'Slide Up' },
1160
1192
  { key: 'fade', label: 'Fade' },
1161
1193
  { key: 'none', label: 'None' },
@@ -1170,7 +1202,7 @@ const SettingsPanel = () => {
1170
1202
  ? AppColors_1.AppColors.purple
1171
1203
  : 'transparent',
1172
1204
  }}>
1173
- <react_native_1.Text style={{
1205
+ <react_native_1.Text style={{
1174
1206
  fontFamily: AppFonts_1.AppFonts.interBold,
1175
1207
  fontSize: 11.5,
1176
1208
  lineHeight: 15,
@@ -1178,16 +1210,16 @@ const SettingsPanel = () => {
1178
1210
  ? AppColors_1.AppColors.white
1179
1211
  : AppColors_1.AppColors.grayText,
1180
1212
  }}>
1181
- {opt.label}
1182
- </react_native_1.Text>
1183
- </TouchableScale_1.default>);
1213
+ {opt.label}
1214
+ </react_native_1.Text>
1215
+ </TouchableScale_1.default>);
1184
1216
  })}
1185
- </react_native_1.View>
1186
1217
  </react_native_1.View>
1187
1218
  </react_native_1.View>
1219
+ </react_native_1.View>
1188
1220
 
1189
- {/* Section 3: Default Startup Tab */}
1190
- <react_native_1.View style={{
1221
+ {/* Section 3: Default Startup Tab */}
1222
+ <react_native_1.View style={{
1191
1223
  backgroundColor: AppColors_1.AppColors.primaryLight,
1192
1224
  borderRadius: 14,
1193
1225
  borderWidth: 1,
@@ -1196,22 +1228,22 @@ const SettingsPanel = () => {
1196
1228
  padding: 14,
1197
1229
  gap: 12,
1198
1230
  }}>
1199
- <react_native_1.Text style={{
1231
+ <react_native_1.Text style={{
1200
1232
  fontFamily: AppFonts_1.AppFonts.interBold,
1201
1233
  fontSize: 11,
1202
1234
  lineHeight: 14,
1203
1235
  color: AppColors_1.AppColors.grayTextWeak,
1204
1236
  letterSpacing: 0.8,
1205
1237
  }}>
1206
- {t('settings.startupDefault')}
1207
- </react_native_1.Text>
1238
+ {t('settings.startupDefault')}
1239
+ </react_native_1.Text>
1208
1240
 
1209
- <react_native_1.View style={{
1241
+ <react_native_1.View style={{
1210
1242
  flexDirection: 'row',
1211
1243
  alignItems: 'center',
1212
1244
  gap: 10,
1213
1245
  }}>
1214
- <react_native_1.View style={{
1246
+ <react_native_1.View style={{
1215
1247
  width: 32,
1216
1248
  height: 32,
1217
1249
  borderRadius: 8,
@@ -1219,32 +1251,32 @@ const SettingsPanel = () => {
1219
1251
  alignItems: 'center',
1220
1252
  justifyContent: 'center',
1221
1253
  }}>
1222
- <NetworkIcons_1.LayersIcon color={AppColors_1.AppColors.purple} size={15}/>
1223
- </react_native_1.View>
1224
- <react_native_1.View style={{ flex: 1 }}>
1225
- <react_native_1.Text style={{
1254
+ <NetworkIcons_1.LayersIcon color={AppColors_1.AppColors.purple} size={15}/>
1255
+ </react_native_1.View>
1256
+ <react_native_1.View style={{ flex: 1 }}>
1257
+ <react_native_1.Text style={{
1226
1258
  fontFamily: AppFonts_1.AppFonts.interBold,
1227
1259
  fontSize: 13.5,
1228
1260
  lineHeight: 18,
1229
1261
  color: AppColors_1.AppColors.primaryBlack,
1230
1262
  }}>
1231
- {t('settings.general.defaultOpeningTab')}
1232
- </react_native_1.Text>
1233
- <react_native_1.Text style={{
1263
+ {t('settings.general.defaultOpeningTab')}
1264
+ </react_native_1.Text>
1265
+ <react_native_1.Text style={{
1234
1266
  fontFamily: AppFonts_1.AppFonts.interRegular,
1235
1267
  fontSize: 11,
1236
1268
  lineHeight: 15,
1237
1269
  color: AppColors_1.AppColors.grayText,
1238
1270
  marginTop: 1,
1239
1271
  }}>
1240
- {t('settings.general.defaultOpeningTabDesc')}
1241
- </react_native_1.Text>
1242
- </react_native_1.View>
1272
+ {t('settings.general.defaultOpeningTabDesc')}
1273
+ </react_native_1.Text>
1243
1274
  </react_native_1.View>
1275
+ </react_native_1.View>
1244
1276
 
1245
- {/* Sleek Interactive Dropdown Picker */}
1246
- <react_native_1.View style={{ marginTop: 6, gap: 6 }}>
1247
- <TouchableScale_1.default accessible={true} accessibilityRole="button" accessibilityLabel={`Default opening tab: ${allModules.find(m => m.key === defaultTab)?.label || 'APIs'}`} onPress={() => setIsDefaultTabDropdownOpen(prev => !prev)} style={{
1277
+ {/* Sleek Interactive Dropdown Picker */}
1278
+ <react_native_1.View style={{ marginTop: 6, gap: 6 }}>
1279
+ <TouchableScale_1.default accessible={true} accessibilityRole="button" accessibilityLabel={`Default opening tab: ${allModules.find(m => m.key === defaultTab)?.label || 'APIs'}`} onPress={() => setIsDefaultTabDropdownOpen(prev => !prev)} style={{
1248
1280
  flexDirection: 'row',
1249
1281
  alignItems: 'center',
1250
1282
  justifyContent: 'space-between',
@@ -1257,53 +1289,54 @@ const SettingsPanel = () => {
1257
1289
  paddingHorizontal: 14,
1258
1290
  paddingVertical: 11,
1259
1291
  }}>
1260
- <react_native_1.View style={{
1292
+ <react_native_1.View style={{
1261
1293
  flexDirection: 'row',
1262
1294
  alignItems: 'center',
1263
1295
  gap: 10,
1264
1296
  flex: 1,
1265
1297
  }}>
1266
- <react_native_1.View style={{
1298
+ <react_native_1.View style={{
1267
1299
  width: 8,
1268
1300
  height: 8,
1269
1301
  borderRadius: 4,
1270
1302
  backgroundColor: AppColors_1.AppColors.purple,
1271
1303
  }}/>
1272
- <react_native_1.Text style={{
1304
+ <react_native_1.Text style={{
1273
1305
  fontFamily: AppFonts_1.AppFonts.interBold,
1274
1306
  fontSize: 13.5,
1275
1307
  lineHeight: 18,
1276
1308
  color: AppColors_1.AppColors.primaryBlack,
1277
1309
  }}>
1278
- {allModules.find(m => m.key === defaultTab)?.label || 'APIs (Network)'}
1279
- </react_native_1.Text>
1280
- <react_native_1.View style={{
1310
+ {allModules.find(m => m.key === defaultTab)?.label ||
1311
+ 'APIs (Network)'}
1312
+ </react_native_1.Text>
1313
+ <react_native_1.View style={{
1281
1314
  backgroundColor: `${AppColors_1.AppColors.purple}14`,
1282
1315
  paddingHorizontal: 6,
1283
1316
  paddingVertical: 1.5,
1284
1317
  borderRadius: 6,
1285
1318
  }}>
1286
- <react_native_1.Text style={{
1319
+ <react_native_1.Text style={{
1287
1320
  fontFamily: AppFonts_1.AppFonts.interBold,
1288
1321
  fontSize: 8.5,
1289
1322
  color: AppColors_1.AppColors.purple,
1290
1323
  }}>
1291
- DEFAULT
1292
- </react_native_1.Text>
1293
- </react_native_1.View>
1324
+ DEFAULT
1325
+ </react_native_1.Text>
1294
1326
  </react_native_1.View>
1327
+ </react_native_1.View>
1295
1328
 
1296
- <react_native_1.View style={{
1329
+ <react_native_1.View style={{
1297
1330
  transform: [
1298
1331
  { rotate: isDefaultTabDropdownOpen ? '180deg' : '0deg' },
1299
1332
  ],
1300
1333
  }}>
1301
- <NetworkIcons_1.ChevronDownIcon color={AppColors_1.AppColors.grayText} size={15}/>
1302
- </react_native_1.View>
1303
- </TouchableScale_1.default>
1334
+ <NetworkIcons_1.ChevronDownIcon color={AppColors_1.AppColors.grayText} size={15}/>
1335
+ </react_native_1.View>
1336
+ </TouchableScale_1.default>
1304
1337
 
1305
- {/* Dropdown Options List */}
1306
- {isDefaultTabDropdownOpen && (<react_native_1.View style={{
1338
+ {/* Dropdown Options List */}
1339
+ {isDefaultTabDropdownOpen && (<react_native_1.View style={{
1307
1340
  backgroundColor: AppColors_1.AppColors.primaryLight,
1308
1341
  borderRadius: 10,
1309
1342
  borderWidth: 1,
@@ -1315,7 +1348,7 @@ const SettingsPanel = () => {
1315
1348
  shadowOffset: { width: 0, height: 3 },
1316
1349
  elevation: 4,
1317
1350
  }}>
1318
- {allModules
1351
+ {allModules
1319
1352
  .filter(tab => tab.key === 'apis' ||
1320
1353
  stagedTabVisibility?.[tab.key] ||
1321
1354
  tabVisibility?.[tab.key])
@@ -1337,12 +1370,12 @@ const SettingsPanel = () => {
1337
1370
  borderBottomWidth: isLast ? 0 : 1,
1338
1371
  borderBottomColor: AppColors_1.AppColors.dividerColor,
1339
1372
  }}>
1340
- <react_native_1.View style={{
1373
+ <react_native_1.View style={{
1341
1374
  flexDirection: 'row',
1342
1375
  alignItems: 'center',
1343
1376
  gap: 10,
1344
1377
  }}>
1345
- <react_native_1.View style={{
1378
+ <react_native_1.View style={{
1346
1379
  width: 6,
1347
1380
  height: 6,
1348
1381
  borderRadius: 3,
@@ -1350,7 +1383,7 @@ const SettingsPanel = () => {
1350
1383
  ? AppColors_1.AppColors.purple
1351
1384
  : AppColors_1.AppColors.grayTextWeak,
1352
1385
  }}/>
1353
- <react_native_1.Text style={{
1386
+ <react_native_1.Text style={{
1354
1387
  fontFamily: isActive
1355
1388
  ? AppFonts_1.AppFonts.interBold
1356
1389
  : AppFonts_1.AppFonts.interMedium,
@@ -1359,18 +1392,18 @@ const SettingsPanel = () => {
1359
1392
  ? AppColors_1.AppColors.purple
1360
1393
  : AppColors_1.AppColors.primaryBlack,
1361
1394
  }}>
1362
- {tab.label}
1363
- </react_native_1.Text>
1364
- </react_native_1.View>
1365
- {isActive && (<NetworkIcons_1.CheckIcon size={14} color={AppColors_1.AppColors.purple}/>)}
1366
- </TouchableScale_1.default>);
1395
+ {tab.label}
1396
+ </react_native_1.Text>
1397
+ </react_native_1.View>
1398
+ {isActive && (<NetworkIcons_1.CheckIcon size={14} color={AppColors_1.AppColors.purple}/>)}
1399
+ </TouchableScale_1.default>);
1367
1400
  })}
1368
- </react_native_1.View>)}
1369
- </react_native_1.View>
1401
+ </react_native_1.View>)}
1370
1402
  </react_native_1.View>
1403
+ </react_native_1.View>
1371
1404
 
1372
- {/* Section 4: Privacy & Diagnostics */}
1373
- <react_native_1.View style={{
1405
+ {/* Section 4: Privacy & Diagnostics */}
1406
+ <react_native_1.View style={{
1374
1407
  backgroundColor: AppColors_1.AppColors.primaryLight,
1375
1408
  borderRadius: 14,
1376
1409
  borderWidth: 1,
@@ -1379,29 +1412,29 @@ const SettingsPanel = () => {
1379
1412
  padding: 14,
1380
1413
  gap: 12,
1381
1414
  }}>
1382
- <react_native_1.Text style={{
1415
+ <react_native_1.Text style={{
1383
1416
  fontFamily: AppFonts_1.AppFonts.interBold,
1384
1417
  fontSize: 11,
1385
1418
  lineHeight: 14,
1386
1419
  color: AppColors_1.AppColors.grayTextWeak,
1387
1420
  letterSpacing: 0.8,
1388
1421
  }}>
1389
- PRIVACY & ANONYMOUS DIAGNOSTICS
1390
- </react_native_1.Text>
1422
+ PRIVACY & ANONYMOUS DIAGNOSTICS
1423
+ </react_native_1.Text>
1391
1424
 
1392
- <react_native_1.View style={{
1425
+ <react_native_1.View style={{
1393
1426
  flexDirection: 'row',
1394
1427
  alignItems: 'center',
1395
1428
  justifyContent: 'space-between',
1396
1429
  }}>
1397
- <react_native_1.View style={{
1430
+ <react_native_1.View style={{
1398
1431
  flexDirection: 'row',
1399
1432
  alignItems: 'center',
1400
1433
  gap: 10,
1401
1434
  flex: 1,
1402
1435
  marginRight: 10,
1403
1436
  }}>
1404
- <react_native_1.View style={{
1437
+ <react_native_1.View style={{
1405
1438
  width: 32,
1406
1439
  height: 32,
1407
1440
  borderRadius: 8,
@@ -1409,30 +1442,32 @@ const SettingsPanel = () => {
1409
1442
  alignItems: 'center',
1410
1443
  justifyContent: 'center',
1411
1444
  }}>
1412
- <NetworkIcons_1.ShieldAlertIcon color={AppColors_1.AppColors.purple} size={15}/>
1413
- </react_native_1.View>
1414
- <react_native_1.View style={{ flex: 1 }}>
1415
- <react_native_1.Text style={{
1445
+ <NetworkIcons_1.ShieldAlertIcon color={AppColors_1.AppColors.purple} size={15}/>
1446
+ </react_native_1.View>
1447
+ <react_native_1.View style={{ flex: 1 }}>
1448
+ <react_native_1.Text style={{
1416
1449
  fontFamily: AppFonts_1.AppFonts.interBold,
1417
1450
  fontSize: 13.5,
1418
1451
  lineHeight: 18,
1419
1452
  color: AppColors_1.AppColors.primaryBlack,
1420
1453
  }}>
1421
- Help Improve In-App Inspector
1422
- </react_native_1.Text>
1423
- <react_native_1.Text style={{
1454
+ Help Improve In-App Inspector
1455
+ </react_native_1.Text>
1456
+ <react_native_1.Text style={{
1424
1457
  fontFamily: AppFonts_1.AppFonts.interRegular,
1425
1458
  fontSize: 11,
1426
1459
  lineHeight: 15,
1427
1460
  color: AppColors_1.AppColors.grayText,
1428
1461
  marginTop: 1,
1429
1462
  }}>
1430
- Share non-identifiable technical metrics (RN version, JS engine, device model). No user data or network payloads are captured.
1431
- </react_native_1.Text>
1432
- </react_native_1.View>
1463
+ Share non-identifiable technical metrics (RN version, JS
1464
+ engine, device model). No user data or network payloads
1465
+ are captured.
1466
+ </react_native_1.Text>
1433
1467
  </react_native_1.View>
1468
+ </react_native_1.View>
1434
1469
 
1435
- <TouchableScale_1.default accessible={true} accessibilityRole="switch" accessibilityLabel="Toggle Anonymous Telemetry" accessibilityState={{ checked: telemetryConsent }} onPress={handleToggleTelemetry} style={{
1470
+ <TouchableScale_1.default accessible={true} accessibilityRole="switch" accessibilityLabel="Toggle Anonymous Telemetry" accessibilityState={{ checked: telemetryConsent }} onPress={handleToggleTelemetry} style={{
1436
1471
  width: 42,
1437
1472
  height: 24,
1438
1473
  borderRadius: 12,
@@ -1443,7 +1478,7 @@ const SettingsPanel = () => {
1443
1478
  justifyContent: 'center',
1444
1479
  alignItems: telemetryConsent ? 'flex-end' : 'flex-start',
1445
1480
  }}>
1446
- <react_native_1.View style={{
1481
+ <react_native_1.View style={{
1447
1482
  width: 20,
1448
1483
  height: 20,
1449
1484
  borderRadius: 10,
@@ -1453,12 +1488,12 @@ const SettingsPanel = () => {
1453
1488
  shadowRadius: 2,
1454
1489
  shadowOffset: { width: 0, height: 1 },
1455
1490
  }}/>
1456
- </TouchableScale_1.default>
1457
- </react_native_1.View>
1491
+ </TouchableScale_1.default>
1458
1492
  </react_native_1.View>
1493
+ </react_native_1.View>
1459
1494
 
1460
- {/* Section 5: Notifications & Toasts */}
1461
- <react_native_1.View style={{
1495
+ {/* Section 5: Notifications & Toasts */}
1496
+ <react_native_1.View style={{
1462
1497
  backgroundColor: AppColors_1.AppColors.primaryLight,
1463
1498
  borderRadius: 14,
1464
1499
  borderWidth: 1,
@@ -1467,29 +1502,29 @@ const SettingsPanel = () => {
1467
1502
  padding: 14,
1468
1503
  gap: 12,
1469
1504
  }}>
1470
- <react_native_1.Text style={{
1505
+ <react_native_1.Text style={{
1471
1506
  fontFamily: AppFonts_1.AppFonts.interBold,
1472
1507
  fontSize: 11,
1473
1508
  lineHeight: 14,
1474
1509
  color: AppColors_1.AppColors.grayTextWeak,
1475
1510
  letterSpacing: 0.8,
1476
1511
  }}>
1477
- NOTIFICATIONS & TOASTS
1478
- </react_native_1.Text>
1512
+ NOTIFICATIONS & TOASTS
1513
+ </react_native_1.Text>
1479
1514
 
1480
- <react_native_1.View style={{
1515
+ <react_native_1.View style={{
1481
1516
  flexDirection: 'row',
1482
1517
  alignItems: 'center',
1483
1518
  justifyContent: 'space-between',
1484
1519
  }}>
1485
- <react_native_1.View style={{
1520
+ <react_native_1.View style={{
1486
1521
  flexDirection: 'row',
1487
1522
  alignItems: 'center',
1488
1523
  gap: 10,
1489
1524
  flex: 1,
1490
1525
  marginRight: 10,
1491
1526
  }}>
1492
- <react_native_1.View style={{
1527
+ <react_native_1.View style={{
1493
1528
  width: 32,
1494
1529
  height: 32,
1495
1530
  borderRadius: 8,
@@ -1497,30 +1532,31 @@ const SettingsPanel = () => {
1497
1532
  alignItems: 'center',
1498
1533
  justifyContent: 'center',
1499
1534
  }}>
1500
- <NetworkIcons_1.PackageIcon color={AppColors_1.AppColors.purple} size={15}/>
1501
- </react_native_1.View>
1502
- <react_native_1.View style={{ flex: 1 }}>
1503
- <react_native_1.Text style={{
1535
+ <NetworkIcons_1.PackageIcon color={AppColors_1.AppColors.purple} size={15}/>
1536
+ </react_native_1.View>
1537
+ <react_native_1.View style={{ flex: 1 }}>
1538
+ <react_native_1.Text style={{
1504
1539
  fontFamily: AppFonts_1.AppFonts.interBold,
1505
1540
  fontSize: 13.5,
1506
1541
  lineHeight: 18,
1507
1542
  color: AppColors_1.AppColors.primaryBlack,
1508
1543
  }}>
1509
- NPM Update Toast
1510
- </react_native_1.Text>
1511
- <react_native_1.Text style={{
1544
+ NPM Update Toast
1545
+ </react_native_1.Text>
1546
+ <react_native_1.Text style={{
1512
1547
  fontFamily: AppFonts_1.AppFonts.interRegular,
1513
1548
  fontSize: 11,
1514
1549
  lineHeight: 15,
1515
1550
  color: AppColors_1.AppColors.grayText,
1516
1551
  marginTop: 1,
1517
1552
  }}>
1518
- Show a floating toast banner with countdown progress when a newer release is published on npm.
1519
- </react_native_1.Text>
1520
- </react_native_1.View>
1553
+ Show a floating toast banner with countdown progress when
1554
+ a newer release is published on npm.
1555
+ </react_native_1.Text>
1521
1556
  </react_native_1.View>
1557
+ </react_native_1.View>
1522
1558
 
1523
- <TouchableScale_1.default accessible={true} accessibilityRole="switch" accessibilityLabel="Toggle NPM Update Toast" accessibilityState={{ checked: showUpdateToast }} onPress={() => setShowUpdateToast(prev => !prev)} style={{
1559
+ <TouchableScale_1.default accessible={true} accessibilityRole="switch" accessibilityLabel="Toggle NPM Update Toast" accessibilityState={{ checked: showUpdateToast }} onPress={() => setShowUpdateToast(prev => !prev)} style={{
1524
1560
  width: 42,
1525
1561
  height: 24,
1526
1562
  borderRadius: 12,
@@ -1531,7 +1567,7 @@ const SettingsPanel = () => {
1531
1567
  justifyContent: 'center',
1532
1568
  alignItems: showUpdateToast ? 'flex-end' : 'flex-start',
1533
1569
  }}>
1534
- <react_native_1.View style={{
1570
+ <react_native_1.View style={{
1535
1571
  width: 20,
1536
1572
  height: 20,
1537
1573
  borderRadius: 10,
@@ -1541,15 +1577,137 @@ const SettingsPanel = () => {
1541
1577
  shadowRadius: 2,
1542
1578
  shadowOffset: { width: 0, height: 1 },
1543
1579
  }}/>
1544
- </TouchableScale_1.default>
1580
+ </TouchableScale_1.default>
1581
+ </react_native_1.View>
1582
+ </react_native_1.View>
1583
+
1584
+ {/* Section 6: NPM Package & Updates */}
1585
+ <react_native_1.View style={{
1586
+ backgroundColor: AppColors_1.AppColors.primaryLight,
1587
+ borderRadius: 14,
1588
+ borderWidth: 1,
1589
+ borderColor: AppColors_1.AppColors.grayBorderSecondary,
1590
+ overflow: 'hidden',
1591
+ padding: 14,
1592
+ gap: 12,
1593
+ }}>
1594
+ <react_native_1.Text style={{
1595
+ fontFamily: AppFonts_1.AppFonts.interBold,
1596
+ fontSize: 11,
1597
+ lineHeight: 14,
1598
+ color: AppColors_1.AppColors.grayTextWeak,
1599
+ letterSpacing: 0.8,
1600
+ }}>
1601
+ PACKAGE VERSION & UPDATES
1602
+ </react_native_1.Text>
1603
+
1604
+ <react_native_1.View style={{
1605
+ flexDirection: 'row',
1606
+ alignItems: 'center',
1607
+ justifyContent: 'space-between',
1608
+ }}>
1609
+ <react_native_1.View style={{
1610
+ flexDirection: 'row',
1611
+ alignItems: 'center',
1612
+ gap: 10,
1613
+ flex: 1,
1614
+ marginRight: 8,
1615
+ }}>
1616
+ <react_native_1.View style={{
1617
+ width: 32,
1618
+ height: 32,
1619
+ borderRadius: 8,
1620
+ backgroundColor: '#CB383715',
1621
+ alignItems: 'center',
1622
+ justifyContent: 'center',
1623
+ }}>
1624
+ <NetworkIcons_1.NpmIcon color="#CB3837" size={16}/>
1625
+ </react_native_1.View>
1626
+ <react_native_1.View style={{ flex: 1 }}>
1627
+ <react_native_1.View style={{
1628
+ flexDirection: 'row',
1629
+ alignItems: 'center',
1630
+ gap: 6,
1631
+ }}>
1632
+ <react_native_1.Text style={{
1633
+ fontFamily: AppFonts_1.AppFonts.interBold,
1634
+ fontSize: 13.5,
1635
+ lineHeight: 18,
1636
+ color: AppColors_1.AppColors.primaryBlack,
1637
+ }}>
1638
+ v{constants_1.LIB_VERSION}
1639
+ </react_native_1.Text>
1640
+ {updateAvailable ? (<react_native_1.View style={{
1641
+ backgroundColor: '#F59E0B20',
1642
+ paddingHorizontal: 6,
1643
+ paddingVertical: 1.5,
1644
+ borderRadius: 5,
1645
+ borderWidth: 1,
1646
+ borderColor: '#F59E0B60',
1647
+ }}>
1648
+ <react_native_1.Text style={{
1649
+ fontFamily: AppFonts_1.AppFonts.interBold,
1650
+ fontSize: 9.5,
1651
+ color: '#D97706',
1652
+ }}>
1653
+ v{latestNpmVersion} Available ⚡
1654
+ </react_native_1.Text>
1655
+ </react_native_1.View>) : (<react_native_1.View style={{
1656
+ backgroundColor: `${AppColors_1.AppColors.emerald500}20`,
1657
+ paddingHorizontal: 6,
1658
+ paddingVertical: 1.5,
1659
+ borderRadius: 5,
1660
+ borderWidth: 1,
1661
+ borderColor: `${AppColors_1.AppColors.emerald500}50`,
1662
+ }}>
1663
+ <react_native_1.Text style={{
1664
+ fontFamily: AppFonts_1.AppFonts.interBold,
1665
+ fontSize: 9.5,
1666
+ color: AppColors_1.AppColors.emerald600,
1667
+ }}>
1668
+ Up to date
1669
+ </react_native_1.Text>
1670
+ </react_native_1.View>)}
1671
+ </react_native_1.View>
1672
+ <react_native_1.Text style={{
1673
+ fontFamily: AppFonts_1.AppFonts.interRegular,
1674
+ fontSize: 11,
1675
+ lineHeight: 15,
1676
+ color: AppColors_1.AppColors.grayText,
1677
+ marginTop: 1,
1678
+ }}>
1679
+ {updateAvailable
1680
+ ? `A newer version (v${latestNpmVersion}) is available on npm registry.`
1681
+ : 'You are running the latest version from npm registry.'}
1682
+ </react_native_1.Text>
1683
+ </react_native_1.View>
1545
1684
  </react_native_1.View>
1685
+
1686
+ {updateAvailable && (<TouchableScale_1.default onPress={() => {
1687
+ (0, helpers_1.copyToClipboard)('npm install react-native-inapp-inspector@latest', 'Install Command');
1688
+ (0, toast_1.showToast)('Copied npm install command!');
1689
+ }} style={{
1690
+ backgroundColor: AppColors_1.AppColors.purple,
1691
+ paddingVertical: 6,
1692
+ paddingHorizontal: 10,
1693
+ borderRadius: 8,
1694
+ }}>
1695
+ <react_native_1.Text style={{
1696
+ fontFamily: AppFonts_1.AppFonts.interBold,
1697
+ fontSize: 11,
1698
+ color: AppColors_1.AppColors.white,
1699
+ }}>
1700
+ Copy Upgrade
1701
+ </react_native_1.Text>
1702
+ </TouchableScale_1.default>)}
1546
1703
  </react_native_1.View>
1547
- </react_native_1.View>)}
1548
- <react_native_1.View style={{ height: 48 }}/>
1549
- </react_native_1.ScrollView>
1704
+ </react_native_1.View>
1705
+ </react_native_1.View>)}
1706
+ <react_native_1.View style={{ height: 48 }}/>
1707
+ </react_native_1.ScrollView>
1550
1708
 
1551
- {/* Bottom Sticky Action Bar for Save Changes */}
1552
- {settingsActiveSubTab === 'module' && (<react_native_1.View style={{
1709
+ {/* Bottom Sticky Action Bar for Save Changes */}
1710
+ {settingsActiveSubTab === 'module' && (<react_native_1.View style={{
1553
1711
  paddingHorizontal: 16,
1554
1712
  paddingTop: 12,
1555
1713
  paddingBottom: react_native_1.Platform.OS === 'ios' ? 36 : 24,
@@ -1565,16 +1723,16 @@ const SettingsPanel = () => {
1565
1723
  shadowOffset: { width: 0, height: -3 },
1566
1724
  elevation: 8,
1567
1725
  }}>
1568
- <react_native_1.View style={{ flex: 1 }}>
1569
- <react_native_1.Text style={{
1726
+ <react_native_1.View style={{ flex: 1 }}>
1727
+ <react_native_1.Text style={{
1570
1728
  fontFamily: AppFonts_1.AppFonts.interBold,
1571
1729
  fontSize: 13,
1572
1730
  lineHeight: 17,
1573
1731
  color: AppColors_1.AppColors.primaryBlack,
1574
1732
  }}>
1575
- {stagedActiveCount} of {allModules.length} Modules Active
1576
- </react_native_1.Text>
1577
- <react_native_1.Text style={{
1733
+ {stagedActiveCount} of {allModules.length} Modules Active
1734
+ </react_native_1.Text>
1735
+ <react_native_1.Text style={{
1578
1736
  fontFamily: AppFonts_1.AppFonts.interRegular,
1579
1737
  fontSize: 11,
1580
1738
  lineHeight: 15,
@@ -1583,13 +1741,13 @@ const SettingsPanel = () => {
1583
1741
  : AppColors_1.AppColors.grayText,
1584
1742
  marginTop: 1,
1585
1743
  }}>
1586
- {hasUnsavedChanges
1744
+ {hasUnsavedChanges
1587
1745
  ? t('settings.unsavedPending')
1588
1746
  : t('settings.allSynchronized')}
1589
- </react_native_1.Text>
1590
- </react_native_1.View>
1747
+ </react_native_1.Text>
1748
+ </react_native_1.View>
1591
1749
 
1592
- <TouchableScale_1.default accessible={true} accessibilityRole="button" accessibilityLabel="Save Changes" onPress={handleSaveChanges} style={{
1750
+ <TouchableScale_1.default accessible={true} accessibilityRole="button" accessibilityLabel="Save Changes" onPress={handleSaveChanges} style={{
1593
1751
  flexDirection: 'row',
1594
1752
  alignItems: 'center',
1595
1753
  gap: 6,
@@ -1600,18 +1758,18 @@ const SettingsPanel = () => {
1600
1758
  paddingVertical: 10,
1601
1759
  borderRadius: 10,
1602
1760
  }}>
1603
- <NetworkIcons_1.CheckIcon size={14} color={hasUnsavedChanges ? AppColors_1.AppColors.white : AppColors_1.AppColors.purple}/>
1604
- <react_native_1.Text style={{
1761
+ <NetworkIcons_1.CheckIcon size={14} color={hasUnsavedChanges ? AppColors_1.AppColors.white : AppColors_1.AppColors.purple}/>
1762
+ <react_native_1.Text style={{
1605
1763
  fontFamily: AppFonts_1.AppFonts.interBold,
1606
1764
  fontSize: 13,
1607
1765
  lineHeight: 17,
1608
1766
  color: hasUnsavedChanges ? AppColors_1.AppColors.white : AppColors_1.AppColors.purple,
1609
1767
  }}>
1610
- {t('settings.saveChanges')}
1611
- </react_native_1.Text>
1612
- </TouchableScale_1.default>
1613
- </react_native_1.View>)}
1614
- </react_native_1.View>);
1768
+ {t('settings.saveChanges')}
1769
+ </react_native_1.Text>
1770
+ </TouchableScale_1.default>
1771
+ </react_native_1.View>)}
1772
+ </react_native_1.View>);
1615
1773
  let content = null;
1616
1774
  let title = '';
1617
1775
  let icon = null;
@@ -1653,7 +1811,9 @@ const SettingsPanel = () => {
1653
1811
  {renderSettingRow({
1654
1812
  icon: <NetworkIcons_1.TrashIcon color={AppColors_1.AppColors.errorColor} size={16}/>,
1655
1813
  label: t('settings.apis.clearNetworkLogs'),
1656
- description: t('settings.apis.clearNetworkLogsDescription', { count: logs.length }),
1814
+ description: t('settings.apis.clearNetworkLogsDescription', {
1815
+ count: logs.length,
1816
+ }),
1657
1817
  isLast: true,
1658
1818
  onPress: () => {
1659
1819
  (0, networkLogger_1.clearNetworkLogs)();
@@ -1840,9 +2000,7 @@ const SettingsPanel = () => {
1840
2000
  : AppColors_1.AppColors.grayBorderSecondary,
1841
2001
  padding: 2,
1842
2002
  justifyContent: 'center',
1843
- alignItems: showDuplicateLogs
1844
- ? 'flex-end'
1845
- : 'flex-start',
2003
+ alignItems: showDuplicateLogs ? 'flex-end' : 'flex-start',
1846
2004
  }}>
1847
2005
  <react_native_1.View style={{
1848
2006
  width: 20,
@@ -1868,7 +2026,9 @@ const SettingsPanel = () => {
1868
2026
  {renderSettingRow({
1869
2027
  icon: <NetworkIcons_1.TrashIcon color={AppColors_1.AppColors.errorColor} size={16}/>,
1870
2028
  label: t('settings.logs.clearConsoleLogs'),
1871
- description: t('settings.logs.clearConsoleLogsDescription', { count: consoleLogs.length }),
2029
+ description: t('settings.logs.clearConsoleLogsDescription', {
2030
+ count: consoleLogs.length,
2031
+ }),
1872
2032
  isLast: true,
1873
2033
  onPress: () => {
1874
2034
  (0, consoleLogger_1.clearConsoleLogs)();
@@ -1911,7 +2071,9 @@ const SettingsPanel = () => {
1911
2071
  {renderSettingRow({
1912
2072
  icon: <NetworkIcons_1.AnalyticsIcon color={AppColors_1.AppColors.purple} size={16}/>,
1913
2073
  label: t('settings.analytics.maxAnalyticsEvents'),
1914
- description: t('settings.analytics.maxAnalyticsEventsDescription', { count: analyticsEvents.length }),
2074
+ description: t('settings.analytics.maxAnalyticsEventsDescription', {
2075
+ count: analyticsEvents.length,
2076
+ }),
1915
2077
  numericInput: {
1916
2078
  value: maxAnalyticsEventsLimit,
1917
2079
  onChange: setMaxAnalyticsEventsLimit,
@@ -1964,7 +2126,9 @@ const SettingsPanel = () => {
1964
2126
  else if (settingsPage === 'redux') {
1965
2127
  title = t('settings.redux.title');
1966
2128
  icon = <NetworkIcons_1.ReduxIcon color={AppColors_1.AppColors.white} size={16}/>;
1967
- rightInfo = t('settings.redux.reducers', { count: Object.keys(reduxState || {}).length });
2129
+ rightInfo = t('settings.redux.reducers', {
2130
+ count: Object.keys(reduxState || {}).length,
2131
+ });
1968
2132
  content = (<react_native_1.ScrollView style={{ flex: 1 }} contentContainerStyle={{ padding: 16, paddingBottom: 100, gap: 12 }}>
1969
2133
  <react_native_1.View style={{
1970
2134
  backgroundColor: AppColors_1.AppColors.primaryLight,
@@ -2109,7 +2273,9 @@ const SettingsPanel = () => {
2109
2273
  {renderSettingRow({
2110
2274
  icon: <NetworkIcons_1.TrashIcon color={AppColors_1.AppColors.errorColor} size={16}/>,
2111
2275
  label: t('settings.crash.clearHistory'),
2112
- description: t('settings.crash.clearHistoryDesc', { count: crashRecords?.length || 0 }),
2276
+ description: t('settings.crash.clearHistoryDesc', {
2277
+ count: crashRecords?.length || 0,
2278
+ }),
2113
2279
  isLast: true,
2114
2280
  onPress: () => {
2115
2281
  (0, crashHandler_1.clearCrashRecords)();