@buoy-gg/redux 7.0.26 → 7.0.28

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.
@@ -12,7 +12,7 @@
12
12
 
13
13
  import React, { memo, useMemo, useCallback, useState, useEffect } from "react";
14
14
  import { View, Text, StyleSheet, ScrollView, TouchableOpacity } from "react-native";
15
- import { buoyColors, Clock, AlertTriangle, Zap, Hash, Info, Box, AlertCircle, FileText, parseValue, ProUpgradeModal, copyToClipboard } from "@buoy-gg/shared-ui";
15
+ import { buoyColors, night, Clock, AlertTriangle, Zap, Hash, Info, Box, AlertCircle, FileText, parseValue, ProUpgradeModal, copyToClipboard } from "@buoy-gg/shared-ui";
16
16
  import { useIsPro } from "@buoy-gg/license";
17
17
  import { DataViewer } from "@buoy-gg/shared-ui/dataViewer";
18
18
  import { reduxActionStore } from "../utils/reduxActionStore";
@@ -92,7 +92,7 @@ function SectionHeader({
92
92
  style: styles.sectionHeaderLeft,
93
93
  children: [/*#__PURE__*/_jsx(Icon, {
94
94
  size: 14,
95
- color: buoyColors.primary
95
+ color: night.color.accent
96
96
  }), /*#__PURE__*/_jsx(Text, {
97
97
  style: styles.sectionTitle,
98
98
  children: title
@@ -229,7 +229,7 @@ export const ReduxActionInfoView = /*#__PURE__*/memo(function ReduxActionInfoVie
229
229
  style: [styles.durationBadge, action.isSlowAction && styles.durationBadgeSlow],
230
230
  children: [/*#__PURE__*/_jsx(Clock, {
231
231
  size: 10,
232
- color: action.isSlowAction ? buoyColors.error : buoyColors.textSecondary
232
+ color: action.isSlowAction ? buoyColors.error : night.color.textSecondary
233
233
  }), /*#__PURE__*/_jsx(Text, {
234
234
  style: [styles.durationText, action.isSlowAction && styles.durationTextSlow],
235
235
  children: formatDuration(action.duration)
@@ -404,7 +404,7 @@ export const ReduxActionInfoView = /*#__PURE__*/memo(function ReduxActionInfoVie
404
404
  }), action.meta?.condition && /*#__PURE__*/_jsx(InfoRow, {
405
405
  label: "Condition",
406
406
  value: "true",
407
- valueColor: buoyColors.textMuted
407
+ valueColor: night.color.textTertiary
408
408
  })]
409
409
  })]
410
410
  }), hasError && /*#__PURE__*/_jsxs(View, {
@@ -511,12 +511,12 @@ const styles = StyleSheet.create({
511
511
  },
512
512
  // Card styling - matches React Query DevTools
513
513
  card: {
514
- backgroundColor: buoyColors.card,
514
+ backgroundColor: night.color.surface,
515
515
  borderRadius: 6,
516
516
  borderWidth: 1,
517
- borderColor: buoyColors.primary + "4D",
517
+ borderColor: night.color.accent + "4D",
518
518
  overflow: "hidden",
519
- shadowColor: buoyColors.primary,
519
+ shadowColor: night.color.accent,
520
520
  shadowOffset: {
521
521
  width: 0,
522
522
  height: 0
@@ -536,8 +536,8 @@ const styles = StyleSheet.create({
536
536
  paddingHorizontal: 12,
537
537
  paddingVertical: 10,
538
538
  borderBottomWidth: 1,
539
- borderBottomColor: buoyColors.primary + "33",
540
- backgroundColor: buoyColors.primary + "15"
539
+ borderBottomColor: night.color.accent + "33",
540
+ backgroundColor: night.color.accent + "15"
541
541
  },
542
542
  sectionHeaderLeft: {
543
543
  flexDirection: "row",
@@ -548,7 +548,7 @@ const styles = StyleSheet.create({
548
548
  fontSize: 12,
549
549
  fontWeight: "600",
550
550
  letterSpacing: 0.5,
551
- color: buoyColors.primary,
551
+ color: night.color.accent,
552
552
  fontFamily: "monospace"
553
553
  },
554
554
  cardContent: {
@@ -562,12 +562,12 @@ const styles = StyleSheet.create({
562
562
  },
563
563
  infoLabel: {
564
564
  fontSize: 11,
565
- color: buoyColors.textMuted,
565
+ color: night.color.textTertiary,
566
566
  fontWeight: "500"
567
567
  },
568
568
  infoValue: {
569
569
  fontSize: 11,
570
- color: buoyColors.text,
570
+ color: night.color.text,
571
571
  fontWeight: "500",
572
572
  flex: 1,
573
573
  textAlign: "right",
@@ -599,7 +599,7 @@ const styles = StyleSheet.create({
599
599
  paddingHorizontal: 8,
600
600
  paddingVertical: 3,
601
601
  borderRadius: 4,
602
- backgroundColor: buoyColors.input
602
+ backgroundColor: night.color.surfaceElevated
603
603
  },
604
604
  durationBadgeSlow: {
605
605
  backgroundColor: buoyColors.error + "26"
@@ -607,7 +607,7 @@ const styles = StyleSheet.create({
607
607
  durationText: {
608
608
  fontSize: 9,
609
609
  fontWeight: "600",
610
- color: buoyColors.textSecondary,
610
+ color: night.color.textSecondary,
611
611
  fontFamily: "monospace"
612
612
  },
613
613
  durationTextSlow: {
@@ -631,27 +631,27 @@ const styles = StyleSheet.create({
631
631
  paddingHorizontal: 8,
632
632
  paddingVertical: 3,
633
633
  borderRadius: 4,
634
- backgroundColor: buoyColors.input
634
+ backgroundColor: night.color.surfaceElevated
635
635
  },
636
636
  noChangesText: {
637
637
  fontSize: 9,
638
638
  fontWeight: "600",
639
- color: buoyColors.textMuted
639
+ color: night.color.textTertiary
640
640
  },
641
641
  typeBadge: {
642
642
  paddingHorizontal: 6,
643
643
  paddingVertical: 2,
644
644
  borderRadius: 3,
645
- backgroundColor: buoyColors.input
645
+ backgroundColor: night.color.surfaceElevated
646
646
  },
647
647
  typeText: {
648
648
  fontSize: 8,
649
649
  fontWeight: "600",
650
- color: buoyColors.textMuted,
650
+ color: night.color.textTertiary,
651
651
  fontFamily: "monospace"
652
652
  },
653
653
  dataViewerContainer: {
654
- backgroundColor: buoyColors.base,
654
+ backgroundColor: night.color.bg,
655
655
  minHeight: 60
656
656
  },
657
657
  argSection: {
@@ -659,20 +659,20 @@ const styles = StyleSheet.create({
659
659
  },
660
660
  argLabel: {
661
661
  fontSize: 11,
662
- color: buoyColors.textMuted,
662
+ color: night.color.textTertiary,
663
663
  fontWeight: "500",
664
664
  marginBottom: 6
665
665
  },
666
666
  argValueContainer: {
667
- backgroundColor: buoyColors.base,
667
+ backgroundColor: night.color.bg,
668
668
  borderRadius: 6,
669
669
  borderWidth: 1,
670
- borderColor: buoyColors.border,
670
+ borderColor: night.color.border,
671
671
  overflow: "hidden"
672
672
  },
673
673
  argValue: {
674
674
  fontSize: 11,
675
- color: buoyColors.text,
675
+ color: night.color.text,
676
676
  fontFamily: "monospace",
677
677
  padding: 10
678
678
  },
@@ -699,18 +699,18 @@ const styles = StyleSheet.create({
699
699
  paddingHorizontal: 8,
700
700
  paddingVertical: 3,
701
701
  borderRadius: 4,
702
- backgroundColor: buoyColors.primary + "26"
702
+ backgroundColor: night.color.accent + "26"
703
703
  },
704
704
  asyncBadgeText: {
705
705
  fontSize: 9,
706
706
  fontWeight: "700",
707
- color: buoyColors.primary,
707
+ color: night.color.accent,
708
708
  letterSpacing: 0.3
709
709
  },
710
710
  baseActionType: {
711
711
  fontSize: 12,
712
712
  fontWeight: "600",
713
- color: buoyColors.text,
713
+ color: night.color.text,
714
714
  fontFamily: "monospace",
715
715
  marginBottom: 8
716
716
  },
@@ -721,11 +721,11 @@ const styles = StyleSheet.create({
721
721
  marginBottom: 12,
722
722
  paddingBottom: 12,
723
723
  borderBottomWidth: 1,
724
- borderBottomColor: buoyColors.border
724
+ borderBottomColor: night.color.border
725
725
  },
726
726
  totalDurationLabel: {
727
727
  fontSize: 11,
728
- color: buoyColors.textMuted,
728
+ color: night.color.textTertiary,
729
729
  fontWeight: "500"
730
730
  },
731
731
  totalDurationValue: {
@@ -746,7 +746,7 @@ const styles = StyleSheet.create({
746
746
  position: "relative"
747
747
  },
748
748
  timelineItemCurrent: {
749
- backgroundColor: buoyColors.primary + "15"
749
+ backgroundColor: night.color.accentSoft
750
750
  },
751
751
  timelineConnector: {
752
752
  position: "absolute",
@@ -754,7 +754,7 @@ const styles = StyleSheet.create({
754
754
  top: 24,
755
755
  bottom: -8,
756
756
  width: 2,
757
- backgroundColor: buoyColors.border
757
+ backgroundColor: night.color.border
758
758
  },
759
759
  timelineDot: {
760
760
  width: 12,
@@ -786,28 +786,29 @@ const styles = StyleSheet.create({
786
786
  paddingHorizontal: 6,
787
787
  paddingVertical: 2,
788
788
  borderRadius: 4,
789
- backgroundColor: buoyColors.primary
789
+ backgroundColor: night.color.accent
790
790
  },
791
791
  currentBadgeText: {
792
792
  fontSize: 8,
793
793
  fontWeight: "700",
794
- color: "#fff",
794
+ // The night accent takes dark ink.
795
+ color: night.color.onAccent,
795
796
  letterSpacing: 0.3
796
797
  },
797
798
  timelineTime: {
798
799
  fontSize: 10,
799
- color: buoyColors.textMuted,
800
+ color: night.color.textTertiary,
800
801
  fontFamily: "monospace"
801
802
  },
802
803
  // Action footer - matches React Query DevTools
803
804
  actionFooter: {
804
- backgroundColor: buoyColors.card,
805
+ backgroundColor: night.color.surface,
805
806
  borderRadius: 6,
806
807
  borderWidth: 1,
807
- borderColor: buoyColors.primary + "4D",
808
+ borderColor: night.color.accent + "4D",
808
809
  paddingVertical: 12,
809
810
  paddingHorizontal: 12,
810
- shadowColor: buoyColors.primary,
811
+ shadowColor: night.color.accent,
811
812
  shadowOffset: {
812
813
  width: 0,
813
814
  height: 0
@@ -827,7 +828,7 @@ const styles = StyleSheet.create({
827
828
  },
828
829
  actionDescription: {
829
830
  fontSize: 9,
830
- color: buoyColors.textMuted,
831
+ color: night.color.textTertiary,
831
832
  textAlign: "center"
832
833
  }
833
834
  });
@@ -9,26 +9,28 @@
9
9
 
10
10
  import React, { memo } from "react";
11
11
  import { View, Text, TouchableOpacity, StyleSheet } from "react-native";
12
- import { macOSColors, FileText, Database, GitBranch } from "@buoy-gg/shared-ui";
12
+ import { night, FileText, Database, GitBranch } from "@buoy-gg/shared-ui";
13
13
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
14
14
  const VIEW_CONFIGS = [{
15
15
  key: "action",
16
16
  label: "ACTION",
17
17
  description: "View action details",
18
18
  icon: FileText,
19
- activeColor: macOSColors.semantic.warning
19
+ // Active-card chrome takes the single night accent (the per-view
20
+ // warning/info/success tints were selection chrome, not data).
21
+ activeColor: night.color.accent
20
22
  }, {
21
23
  key: "state",
22
24
  label: "STATE",
23
25
  description: "View current state",
24
26
  icon: Database,
25
- activeColor: macOSColors.semantic.info
27
+ activeColor: night.color.accent
26
28
  }, {
27
29
  key: "diff",
28
30
  label: "DIFF",
29
31
  description: "Compare changes",
30
32
  icon: GitBranch,
31
- activeColor: macOSColors.semantic.success
33
+ activeColor: night.color.accent
32
34
  }];
33
35
  export const ReduxDetailViewToggle = /*#__PURE__*/memo(function ReduxDetailViewToggle({
34
36
  activeView,
@@ -52,7 +54,7 @@ export const ReduxDetailViewToggle = /*#__PURE__*/memo(function ReduxDetailViewT
52
54
  style: styles.cardContent,
53
55
  children: [/*#__PURE__*/_jsx(IconComponent, {
54
56
  size: 14,
55
- color: isActive ? config.activeColor : isDisabled ? macOSColors.text.muted : macOSColors.text.secondary
57
+ color: isActive ? config.activeColor : isDisabled ? night.color.textTertiary : night.color.textSecondary
56
58
  }), /*#__PURE__*/_jsx(Text, {
57
59
  style: [styles.cardLabel, isActive && [styles.cardLabelActive, {
58
60
  color: config.activeColor
@@ -72,21 +74,22 @@ const styles = StyleSheet.create({
72
74
  flexDirection: "row",
73
75
  gap: 8,
74
76
  padding: 14,
75
- backgroundColor: macOSColors.background.base
77
+ // Transparent so the night sheet's star field shows through.
78
+ backgroundColor: "transparent"
76
79
  },
77
80
  card: {
78
81
  flex: 1,
79
- backgroundColor: macOSColors.background.card,
82
+ backgroundColor: night.color.surface,
80
83
  borderRadius: 12,
81
84
  borderWidth: 1,
82
- borderColor: macOSColors.border.default,
85
+ borderColor: night.color.border,
83
86
  padding: 10,
84
87
  gap: 4
85
88
  },
86
89
  cardActive: {
87
90
  borderWidth: 1.5,
88
- backgroundColor: "rgba(0, 184, 230, 0.05)",
89
- shadowColor: macOSColors.semantic.info,
91
+ backgroundColor: night.color.accentSoft,
92
+ shadowColor: night.color.accent,
90
93
  shadowOffset: {
91
94
  width: 0,
92
95
  height: 2
@@ -107,23 +110,23 @@ const styles = StyleSheet.create({
107
110
  fontSize: 10,
108
111
  fontWeight: "700",
109
112
  letterSpacing: 0.5,
110
- color: macOSColors.text.secondary
113
+ color: night.color.textSecondary
111
114
  },
112
115
  cardLabelActive: {
113
- color: macOSColors.text.primary
116
+ color: night.color.text
114
117
  },
115
118
  cardLabelDisabled: {
116
- color: macOSColors.text.muted
119
+ color: night.color.textTertiary
117
120
  },
118
121
  cardDescription: {
119
122
  fontSize: 9,
120
- color: macOSColors.text.muted,
123
+ color: night.color.textTertiary,
121
124
  lineHeight: 12
122
125
  },
123
126
  cardDescriptionActive: {
124
- color: macOSColors.text.secondary
127
+ color: night.color.textSecondary
125
128
  },
126
129
  cardDescriptionDisabled: {
127
- color: macOSColors.text.muted
130
+ color: night.color.textTertiary
128
131
  }
129
132
  });
@@ -9,7 +9,7 @@
9
9
 
10
10
  import { useState, useMemo, useRef, useCallback, useEffect } from "react";
11
11
  import { View, Text, StyleSheet, FlatList, TextInput, TouchableOpacity } from "react-native";
12
- import { JsModal, ModalHeader, macOSColors, buoyColors, Search, Trash2, Power, X, Zap, CheckCircle, Copy, Lock, AlertTriangle, devToolsStorageKeys, copyToClipboard, ProUpgradeModal, PowerToggleButton, TickProvider, useLimit, TIER_LIMITS } from "@buoy-gg/shared-ui";
12
+ import { JsModal, ModalHeader, macOSColors, night, Search, Trash2, Power, X, Zap, CheckCircle, Copy, Lock, AlertTriangle, devToolsStorageKeys, copyToClipboard, ProUpgradeModal, PowerToggleButton, TickProvider, useLimit, TIER_LIMITS } from "@buoy-gg/shared-ui";
13
13
  import { useIsPro } from "@buoy-gg/license";
14
14
  import { useReduxActions } from "../hooks/useReduxActions";
15
15
  import { reduxActionStore } from "../utils/reduxActionStore";
@@ -30,7 +30,7 @@ function EmptyState({
30
30
  style: styles.emptyState,
31
31
  children: [/*#__PURE__*/_jsx(Zap, {
32
32
  size: 32,
33
- color: macOSColors.text.muted
33
+ color: night.color.textTertiary
34
34
  }), /*#__PURE__*/_jsx(Text, {
35
35
  style: styles.emptyTitle,
36
36
  children: "No Redux actions"
@@ -191,12 +191,12 @@ export function ReduxModal({
191
191
  style: styles.headerSearchContainer,
192
192
  children: [/*#__PURE__*/_jsx(Search, {
193
193
  size: 14,
194
- color: macOSColors.text.secondary
194
+ color: night.color.textSecondary
195
195
  }), /*#__PURE__*/_jsx(TextInput, {
196
196
  ref: searchInputRef,
197
197
  style: styles.headerSearchInput,
198
198
  placeholder: "Search action types...",
199
- placeholderTextColor: macOSColors.text.muted,
199
+ placeholderTextColor: night.color.textTertiary,
200
200
  value: searchText,
201
201
  onChangeText: handleSearch,
202
202
  onSubmitEditing: () => setIsSearchActive(false),
@@ -212,7 +212,7 @@ export function ReduxModal({
212
212
  style: styles.headerSearchClear,
213
213
  children: /*#__PURE__*/_jsx(X, {
214
214
  size: 14,
215
- color: macOSColors.text.secondary
215
+ color: night.color.textSecondary
216
216
  })
217
217
  })]
218
218
  }) : /*#__PURE__*/_jsxs(View, {
@@ -228,7 +228,7 @@ export function ReduxModal({
228
228
  children: "ALL"
229
229
  }), /*#__PURE__*/_jsx(Text, {
230
230
  style: [styles.headerChipValue, {
231
- color: macOSColors.text.primary
231
+ color: night.color.text
232
232
  }],
233
233
  children: stats.totalActions
234
234
  })]
@@ -266,7 +266,7 @@ export function ReduxModal({
266
266
  style: styles.headerActionButton,
267
267
  children: /*#__PURE__*/_jsx(Search, {
268
268
  size: 14,
269
- color: macOSColors.text.secondary
269
+ color: night.color.textSecondary
270
270
  })
271
271
  }), /*#__PURE__*/_jsx(TouchableOpacity, {
272
272
  onPress: handleCopyAll,
@@ -274,7 +274,7 @@ export function ReduxModal({
274
274
  disabled: filteredActions.length === 0,
275
275
  children: /*#__PURE__*/_jsx(Copy, {
276
276
  size: 14,
277
- color: filteredActions.length > 0 ? macOSColors.text.secondary : macOSColors.text.disabled
277
+ color: filteredActions.length > 0 ? night.color.textSecondary : night.color.textTertiary
278
278
  })
279
279
  }), /*#__PURE__*/_jsx(PowerToggleButton, {
280
280
  isEnabled: isEnabled,
@@ -286,7 +286,7 @@ export function ReduxModal({
286
286
  disabled: filteredActions.length === 0,
287
287
  children: /*#__PURE__*/_jsx(Trash2, {
288
288
  size: 14,
289
- color: filteredActions.length > 0 ? macOSColors.text.muted : macOSColors.text.disabled
289
+ color: filteredActions.length > 0 ? night.color.textTertiary : night.color.textTertiary
290
290
  })
291
291
  })]
292
292
  })]
@@ -321,7 +321,7 @@ export function ReduxModal({
321
321
  style: styles.errorBanner,
322
322
  children: [/*#__PURE__*/_jsx(AlertTriangle, {
323
323
  size: 14,
324
- color: macOSColors.semantic.error
324
+ color: night.color.danger
325
325
  }), /*#__PURE__*/_jsx(Text, {
326
326
  style: styles.errorText,
327
327
  children: isReactReduxAvailable ? "Not inside a Redux Provider. Wrap your app with <Provider store={store}>." : "react-redux not installed. Run: npm install react-redux"
@@ -330,7 +330,7 @@ export function ReduxModal({
330
330
  style: styles.disabledBanner,
331
331
  children: [/*#__PURE__*/_jsx(Power, {
332
332
  size: 14,
333
- color: macOSColors.semantic.warning
333
+ color: night.color.warning
334
334
  }), /*#__PURE__*/_jsx(Text, {
335
335
  style: styles.disabledText,
336
336
  children: "Action capture is disabled"
@@ -339,7 +339,7 @@ export function ReduxModal({
339
339
  style: styles.disabledBanner,
340
340
  children: [/*#__PURE__*/_jsx(AlertTriangle, {
341
341
  size: 14,
342
- color: macOSColors.semantic.warning
342
+ color: night.color.warning
343
343
  }), /*#__PURE__*/_jsx(Text, {
344
344
  style: styles.disabledText,
345
345
  children: "Top-level capture only \u2014 thunk/RTK Query internals aren't visible. Put import '@buoy-gg/redux' first in your app entry (or add buoyReduxMiddleware) for full capture."
@@ -350,7 +350,7 @@ export function ReduxModal({
350
350
  activeOpacity: 0.8,
351
351
  children: [/*#__PURE__*/_jsx(Lock, {
352
352
  size: 14,
353
- color: buoyColors.primary
353
+ color: night.color.accent
354
354
  }), /*#__PURE__*/_jsxs(Text, {
355
355
  style: styles.lockedText,
356
356
  children: [lockedActionCount, " older ", lockedActionCount === 1 ? "action" : "actions", " locked"]
@@ -438,7 +438,9 @@ const styles = StyleSheet.create({
438
438
  inlineRoot: {
439
439
  flex: 1,
440
440
  minHeight: 0,
441
- backgroundColor: macOSColors.background.base
441
+ // Transparent so the desktop workbench's hoisted sky (one field spanning
442
+ // sidebar + panel) shows through — the shell paints its base beneath it.
443
+ backgroundColor: "transparent"
442
444
  },
443
445
  inlineHeader: {
444
446
  paddingHorizontal: 12,
@@ -449,21 +451,22 @@ const styles = StyleSheet.create({
449
451
  },
450
452
  container: {
451
453
  flex: 1,
452
- backgroundColor: macOSColors.background.base
454
+ // Transparent so JsModal's ToolBackground shows through (the modal paints opaque base beneath it).
455
+ backgroundColor: "transparent"
453
456
  },
454
457
  headerSearchContainer: {
455
458
  flexDirection: "row",
456
459
  alignItems: "center",
457
- backgroundColor: macOSColors.background.input,
460
+ backgroundColor: night.color.surfaceElevated,
458
461
  borderRadius: 10,
459
462
  borderWidth: 1,
460
- borderColor: macOSColors.border.default,
463
+ borderColor: night.color.border,
461
464
  paddingHorizontal: 12,
462
465
  paddingVertical: 5
463
466
  },
464
467
  headerSearchInput: {
465
468
  flex: 1,
466
- color: macOSColors.text.primary,
469
+ color: night.color.text,
467
470
  fontSize: 13,
468
471
  marginLeft: 6,
469
472
  paddingVertical: 2
@@ -481,21 +484,22 @@ const styles = StyleSheet.create({
481
484
  flexDirection: "row",
482
485
  alignItems: "center",
483
486
  gap: 4,
484
- backgroundColor: macOSColors.background.hover,
487
+ backgroundColor: night.color.surfaceElevated,
485
488
  paddingHorizontal: 10,
486
489
  paddingVertical: 5,
487
490
  borderRadius: 12,
488
491
  borderWidth: 1,
489
- borderColor: macOSColors.border.default
492
+ borderColor: night.color.border
490
493
  },
491
494
  headerChipActive: {
492
- backgroundColor: macOSColors.semantic.infoBackground,
493
- borderColor: macOSColors.semantic.info + "50"
495
+ // Active chip chrome takes the night accent, not info-cyan.
496
+ backgroundColor: night.color.accentSoft,
497
+ borderColor: night.color.accentBorderStrong
494
498
  },
495
499
  headerChipLabel: {
496
500
  fontSize: 10,
497
501
  fontWeight: "700",
498
- color: macOSColors.text.muted
502
+ color: night.color.textTertiary
499
503
  },
500
504
  headerChipValue: {
501
505
  fontSize: 12,
@@ -506,9 +510,9 @@ const styles = StyleSheet.create({
506
510
  width: 32,
507
511
  height: 32,
508
512
  borderRadius: 8,
509
- backgroundColor: macOSColors.background.hover,
513
+ backgroundColor: night.color.surfaceElevated,
510
514
  borderWidth: 1,
511
- borderColor: macOSColors.border.default,
515
+ borderColor: night.color.border,
512
516
  alignItems: "center",
513
517
  justifyContent: "center"
514
518
  },
@@ -530,13 +534,13 @@ const styles = StyleSheet.create({
530
534
  padding: 10,
531
535
  marginHorizontal: 12,
532
536
  marginTop: 8,
533
- backgroundColor: macOSColors.semantic.errorBackground,
537
+ backgroundColor: night.color.dangerSoft,
534
538
  borderRadius: 8,
535
539
  borderWidth: 1,
536
- borderColor: macOSColors.semantic.error + "20"
540
+ borderColor: night.color.danger + "20"
537
541
  },
538
542
  errorText: {
539
- color: macOSColors.semantic.error,
543
+ color: night.color.danger,
540
544
  fontSize: 11,
541
545
  flex: 1
542
546
  },
@@ -547,13 +551,13 @@ const styles = StyleSheet.create({
547
551
  padding: 10,
548
552
  marginHorizontal: 12,
549
553
  marginTop: 8,
550
- backgroundColor: macOSColors.semantic.warningBackground,
554
+ backgroundColor: night.color.warningSoft,
551
555
  borderRadius: 8,
552
556
  borderWidth: 1,
553
- borderColor: macOSColors.semantic.warning + "20"
557
+ borderColor: night.color.warning + "20"
554
558
  },
555
559
  disabledText: {
556
- color: macOSColors.semantic.warning,
560
+ color: night.color.warning,
557
561
  fontSize: 11,
558
562
  flex: 1
559
563
  },
@@ -566,14 +570,14 @@ const styles = StyleSheet.create({
566
570
  paddingVertical: 40
567
571
  },
568
572
  emptyTitle: {
569
- color: macOSColors.text.primary,
573
+ color: night.color.text,
570
574
  fontSize: 14,
571
575
  fontWeight: "600",
572
576
  marginTop: 12,
573
577
  marginBottom: 6
574
578
  },
575
579
  emptyText: {
576
- color: macOSColors.text.muted,
580
+ color: night.color.textTertiary,
577
581
  fontSize: 12,
578
582
  textAlign: "center"
579
583
  },
@@ -585,25 +589,26 @@ const styles = StyleSheet.create({
585
589
  padding: 10,
586
590
  marginHorizontal: 12,
587
591
  marginTop: 8,
588
- backgroundColor: buoyColors.primary + "15",
592
+ backgroundColor: night.color.accentSoft,
589
593
  borderRadius: 8,
590
594
  borderWidth: 1,
591
- borderColor: buoyColors.primary + "33"
595
+ borderColor: night.color.accentBorder
592
596
  },
593
597
  lockedText: {
594
- color: buoyColors.primary,
598
+ color: night.color.accent,
595
599
  fontSize: 11,
596
600
  fontWeight: "500",
597
601
  flex: 1
598
602
  },
599
603
  upgradeBadge: {
600
- backgroundColor: buoyColors.primary,
604
+ backgroundColor: night.color.accent,
601
605
  paddingHorizontal: 8,
602
606
  paddingVertical: 3,
603
607
  borderRadius: 4
604
608
  },
605
609
  upgradeBadgeText: {
606
- color: "#fff",
610
+ // The night accent takes dark ink.
611
+ color: night.color.onAccent,
607
612
  fontSize: 9,
608
613
  fontWeight: "700",
609
614
  letterSpacing: 0.5
@@ -18,28 +18,28 @@ declare const buttonConfigs: {
18
18
  textColor: "#20C997";
19
19
  };
20
20
  jump: {
21
- color: "#FFA94D";
21
+ color: "#FF8329";
22
22
  backgroundColor: string;
23
23
  borderColor: string;
24
- textColor: "#FFA94D";
24
+ textColor: "#FF8329";
25
25
  };
26
26
  skip: {
27
- color: "#A0A0A0";
27
+ color: "#9BA1A6";
28
28
  backgroundColor: string;
29
29
  borderColor: string;
30
- textColor: "#A0A0A0";
30
+ textColor: "#9BA1A6";
31
31
  };
32
32
  clear: {
33
- color: "#EF4444";
33
+ color: "#FF3B30";
34
34
  backgroundColor: string;
35
35
  borderColor: string;
36
- textColor: "#EF4444";
36
+ textColor: "#FF3B30";
37
37
  };
38
38
  diff: {
39
- color: "#00B8E6";
39
+ color: "#1E6DFF";
40
40
  backgroundColor: string;
41
41
  borderColor: string;
42
- textColor: "#00B8E6";
42
+ textColor: "#1E6DFF";
43
43
  };
44
44
  };
45
45
  export type ButtonType = keyof typeof buttonConfigs;
@@ -1 +1 @@
1
- {"version":3,"file":"ReduxActionDetailContent.d.ts","sourceRoot":"","sources":["../../../../src/redux/components/ReduxActionDetailContent.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAiBH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAC5C,OAAO,EAEL,KAAK,mBAAmB,EACzB,MAAM,yBAAyB,CAAC;AAIjC,UAAU,6BAA6B;IACrC,qCAAqC;IACrC,MAAM,EAAE,WAAW,CAAC;IACpB,iCAAiC;IACjC,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,qCAAqC;IACrC,aAAa,EAAE,MAAM,CAAC;IACtB,kCAAkC;IAClC,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,iDAAiD;IACjD,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;;OAKG;IACH,WAAW,CAAC,EAAE,mBAAmB,CAAC;CACnC;AAwDD,wBAAgB,wBAAwB,CAAC,EACvC,MAAM,EACN,OAAO,EACP,aAAa,EACb,aAAa,EACb,qBAA6B,EAC7B,WAAsB,GACvB,EAAE,6BAA6B,+BA0M/B;AAED;;GAEG;AACH,wBAAgB,uBAAuB,CAAC,EACtC,MAAM,EACN,OAAO,EACP,aAAa,EACb,aAAa,GACd,EAAE;IACD,MAAM,EAAE,WAAW,CAAC;IACpB,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,aAAa,EAAE,MAAM,CAAC;IACtB,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACxC,sCAiBA"}
1
+ {"version":3,"file":"ReduxActionDetailContent.d.ts","sourceRoot":"","sources":["../../../../src/redux/components/ReduxActionDetailContent.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAkBH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAC5C,OAAO,EAEL,KAAK,mBAAmB,EACzB,MAAM,yBAAyB,CAAC;AAIjC,UAAU,6BAA6B;IACrC,qCAAqC;IACrC,MAAM,EAAE,WAAW,CAAC;IACpB,iCAAiC;IACjC,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,qCAAqC;IACrC,aAAa,EAAE,MAAM,CAAC;IACtB,kCAAkC;IAClC,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,iDAAiD;IACjD,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;;OAKG;IACH,WAAW,CAAC,EAAE,mBAAmB,CAAC;CACnC;AAwDD,wBAAgB,wBAAwB,CAAC,EACvC,MAAM,EACN,OAAO,EACP,aAAa,EACb,aAAa,EACb,qBAA6B,EAC7B,WAAsB,GACvB,EAAE,6BAA6B,+BA0M/B;AAED;;GAEG;AACH,wBAAgB,uBAAuB,CAAC,EACtC,MAAM,EACN,OAAO,EACP,aAAa,EACb,aAAa,GACd,EAAE;IACD,MAAM,EAAE,WAAW,CAAC;IACpB,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,aAAa,EAAE,MAAM,CAAC;IACtB,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACxC,sCAiBA"}
@@ -1 +1 @@
1
- {"version":3,"file":"ReduxActionDetailView.d.ts","sourceRoot":"","sources":["../../../../src/redux/components/ReduxActionDetailView.tsx"],"names":[],"mappings":"AAAA;;GAEG;AAWH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAE5C,UAAU,0BAA0B;IAClC,MAAM,EAAE,WAAW,CAAC;CACrB;AAID,wBAAgB,qBAAqB,CAAC,EAAE,MAAM,EAAE,EAAE,0BAA0B,+BAkH3E"}
1
+ {"version":3,"file":"ReduxActionDetailView.d.ts","sourceRoot":"","sources":["../../../../src/redux/components/ReduxActionDetailView.tsx"],"names":[],"mappings":"AAAA;;GAEG;AAYH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAE5C,UAAU,0BAA0B;IAClC,MAAM,EAAE,WAAW,CAAC;CACrB;AAID,wBAAgB,qBAAqB,CAAC,EAAE,MAAM,EAAE,EAAE,0BAA0B,+BAkH3E"}