@buoy-gg/storage 7.0.26 → 7.0.27

package/lib/commonjs/storage/components/StorageModalWithTabs.js

@@ -668,7 +668,7 @@ function StorageModalWithTabs({
           style: styles.emptyState,
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.Database, {
             size: 48,
-            color: _sharedUi.macOSColors.text.muted
+            color: _sharedUi.night.color.textTertiary
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
             style: styles.emptyTitle,
             children: !isListening ? "Event listener is paused" : filtered ? `No ${storageTypeFilter} events` : "No storage events yet"
@@ -788,14 +788,14 @@ function StorageModalWithTabs({
         accessibilityLabel: "Refresh storage",
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.RefreshCw, {
           size: 14,
-          color: _sharedUi.macOSColors.text.secondary
+          color: _sharedUi.night.color.textSecondary
         })
       }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
         onPress: handleToggleFilters,
         style: [styles.iconButton, (ignoredPatterns.size > 0 || enabledStorageTypes.size < 3) && styles.activeFilterButton],
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.Filter, {
           size: 14,
-          color: ignoredPatterns.size > 0 || enabledStorageTypes.size < 3 ? _sharedUi.macOSColors.semantic.debug : _sharedUi.macOSColors.text.secondary
+          color: ignoredPatterns.size > 0 || enabledStorageTypes.size < 3 ? _sharedUi.night.color.accent : _sharedUi.night.color.textSecondary
         })
       }), activeTab === "browser" && !isSearchActive && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
@@ -803,7 +803,7 @@ function StorageModalWithTabs({
           style: styles.iconButton,
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.Search, {
             size: 14,
-            color: _sharedUi.macOSColors.text.secondary
+            color: _sharedUi.night.color.textSecondary
           })
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.ToolbarCopyButton, {
           value: getStorageSnapshot,
@@ -882,7 +882,9 @@ const styles = _reactNative.StyleSheet.create({
   inlineRoot: {
     flex: 1,
     minHeight: 0,
-    backgroundColor: _sharedUi.macOSColors.background.base
+    // Transparent so the desktop workbench's hoisted sky (one field spanning
+    // sidebar + panel) shows through — the shell paints its base beneath it.
+    backgroundColor: "transparent"
   },
   inlineHeader: {
     paddingHorizontal: 12,
@@ -897,18 +899,21 @@ const styles = _reactNative.StyleSheet.create({
   flexFill: {
     flex: 1
   },
+  // Night chrome — the header is glass over the star field, so the action
+  // chips sit on the Everlights dark-glass fill.
   iconButton: {
     width: 32,
     height: 32,
     borderRadius: 8,
-    backgroundColor: _sharedUi.macOSColors.background.hover,
+    backgroundColor: _sharedUi.night.color.buttonSurface,
     borderWidth: 1,
-    borderColor: _sharedUi.macOSColors.border.default,
+    borderColor: _sharedUi.night.color.border,
     alignItems: "center",
     justifyContent: "center"
   },
   activeFilterButton: {
-    backgroundColor: _sharedUi.macOSColors.semantic.infoBackground
+    backgroundColor: _sharedUi.night.color.accentSoft,
+    borderColor: _sharedUi.night.color.accentBorderStrong
   },
   separator: {
     height: 8
@@ -933,7 +938,7 @@ const styles = _reactNative.StyleSheet.create({
     padding: 32
   },
   emptyTitle: {
-    color: _sharedUi.macOSColors.text.primary,
+    color: _sharedUi.night.color.text,
     fontSize: 16,
     fontWeight: "600",
     marginTop: 16,
@@ -943,7 +948,7 @@ const styles = _reactNative.StyleSheet.create({
     textTransform: "uppercase"
   },
   emptySubtitle: {
-    color: _sharedUi.macOSColors.text.secondary,
+    color: _sharedUi.night.color.textSecondary,
     fontSize: 14,
     textAlign: "center",
     fontFamily: "monospace"
@@ -962,7 +967,7 @@ const styles = _reactNative.StyleSheet.create({
     opacity: 0.3
   },
   eventCounter: {
-    color: _sharedUi.macOSColors.text.primary,
+    color: _sharedUi.night.color.text,
     fontSize: 12,
     fontWeight: "600",
     fontFamily: "monospace",
@@ -979,19 +984,19 @@ const styles = _reactNative.StyleSheet.create({
     flexDirection: "row",
     alignItems: "center",
     gap: 6,
-    backgroundColor: _sharedUi.macOSColors.background.input,
+    backgroundColor: _sharedUi.night.color.surfaceElevated,
     paddingHorizontal: 10,
     paddingVertical: 4,
     borderRadius: 6,
     borderWidth: 1,
-    borderColor: _sharedUi.macOSColors.border.input,
+    borderColor: _sharedUi.night.color.border,
     height: 28
   },
   keyNameText: {
     flex: 1,
     fontSize: 13,
     fontWeight: "600",
-    color: _sharedUi.macOSColors.semantic.debug,
+    color: _sharedUi.night.color.accent,
     fontFamily: "monospace",
     letterSpacing: 0.5
   },

package/lib/commonjs/storage/components/StorageTypeFilterBar.js

@@ -55,7 +55,7 @@ function StorageTypeFilterBar({
     style: styles.row,
     children: SEGMENTS.map(segment => {
       const isActive = active === segment.id;
-      const accent = segment.color ?? _sharedUi.macOSColors.text.primary;
+      const accent = segment.color ?? _sharedUi.night.color.accent;
       return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
         accessibilityLabel: `Filter by ${segment.label}`,
         accessibilityState: {
@@ -64,13 +64,13 @@ function StorageTypeFilterBar({
         activeOpacity: 0.8,
         onPress: () => onChange(segment.id),
         style: [styles.pill, {
-          borderColor: _sharedUi.macOSColors.border.default
+          borderColor: _sharedUi.night.color.border
         }, isActive && [styles.pillActive, segment.color ? {
           backgroundColor: segment.color + "15",
           borderColor: segment.color + "40"
         } : {
-          backgroundColor: _sharedUi.macOSColors.background.hover,
-          borderColor: _sharedUi.macOSColors.border.hover
+          backgroundColor: _sharedUi.night.color.accentSoft,
+          borderColor: _sharedUi.night.color.accentBorderStrong
         }]],
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
           style: [styles.label, isActive && {
@@ -80,7 +80,7 @@ function StorageTypeFilterBar({
           children: segment.label
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
           style: [styles.value, {
-            color: isActive ? accent : _sharedUi.macOSColors.text.muted
+            color: isActive ? accent : _sharedUi.night.color.textTertiary
           }],
           children: counts[segment.id]
         })]
@@ -108,10 +108,10 @@ const styles = _reactNative.StyleSheet.create({
   },
   pill: {
     flex: 1,
-    backgroundColor: _sharedUi.macOSColors.background.input + "80",
+    backgroundColor: _sharedUi.night.color.buttonSurface,
     borderRadius: 8,
     borderWidth: 1,
-    borderColor: _sharedUi.macOSColors.border.default + "30",
+    borderColor: _sharedUi.night.color.border,
     paddingVertical: 6,
     paddingHorizontal: 8,
     alignItems: "center",
@@ -126,7 +126,7 @@ const styles = _reactNative.StyleSheet.create({
   },
   label: {
     fontSize: 9,
-    color: _sharedUi.macOSColors.text.secondary,
+    color: _sharedUi.night.color.textSecondary,
     textTransform: "uppercase",
     letterSpacing: 0.4,
     fontWeight: "500",

package/lib/commonjs/storage/components/StorageValueEditModal.js

@@ -129,7 +129,7 @@ function StorageValueEditModal({
             keyboardType: mode === "number" ? "numeric" : "default",
             onSubmitEditing: mode === "number" ? commit : undefined,
             placeholder: mode === "raw" ? "{ }" : "value",
-            placeholderTextColor: _sharedUi.macOSColors.text.muted,
+            placeholderTextColor: _sharedUi.night.color.placeholder,
             style: [styles.input, mode === "raw" && styles.inputRaw, mode !== "number" && styles.inputMultiline, error != null && styles.inputInvalid]
           })
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
@@ -222,10 +222,10 @@ const styles = _reactNative.StyleSheet.create({
     padding: 12
   },
   card: {
-    backgroundColor: _sharedUi.macOSColors.background.card,
+    backgroundColor: _sharedUi.night.color.surface,
     borderRadius: 14,
     borderWidth: 1,
-    borderColor: _sharedUi.macOSColors.border.default,
+    borderColor: _sharedUi.night.color.border,
     padding: 14,
     gap: 8
   },
@@ -236,7 +236,7 @@ const styles = _reactNative.StyleSheet.create({
   },
   title: {
     flex: 1,
-    color: _sharedUi.macOSColors.text.primary,
+    color: _sharedUi.night.color.text,
     fontSize: 14,
     fontWeight: "700"
   },
@@ -244,7 +244,7 @@ const styles = _reactNative.StyleSheet.create({
     paddingHorizontal: 8,
     paddingVertical: 2,
     borderRadius: 6,
-    backgroundColor: _sharedUi.macOSColors.background.hover
+    backgroundColor: _sharedUi.night.color.surfaceElevated
   },
   typeBadgeText: {
     color: _sharedUi.macOSColors.semantic.warning,
@@ -253,7 +253,7 @@ const styles = _reactNative.StyleSheet.create({
     fontFamily: "monospace"
   },
   path: {
-    color: _sharedUi.macOSColors.text.muted,
+    color: _sharedUi.night.color.textTertiary,
     fontSize: 11,
     fontFamily: "monospace"
   },
@@ -262,10 +262,10 @@ const styles = _reactNative.StyleSheet.create({
     maxHeight: 240
   },
   input: {
-    color: _sharedUi.macOSColors.text.primary,
-    backgroundColor: _sharedUi.macOSColors.background.input,
+    color: _sharedUi.night.color.text,
+    backgroundColor: _sharedUi.night.color.surfaceElevated,
     borderWidth: 1,
-    borderColor: _sharedUi.macOSColors.border.input,
+    borderColor: _sharedUi.night.color.border,
     borderRadius: 10,
     paddingHorizontal: 12,
     paddingVertical: 10,
@@ -283,15 +283,15 @@ const styles = _reactNative.StyleSheet.create({
     lineHeight: 18
   },
   inputInvalid: {
-    borderColor: _sharedUi.macOSColors.semantic.error
+    borderColor: _sharedUi.night.color.danger
   },
   hint: {
-    color: _sharedUi.macOSColors.text.muted,
+    color: _sharedUi.night.color.textTertiary,
     fontSize: 11,
     lineHeight: 16
   },
   error: {
-    color: _sharedUi.macOSColors.semantic.error,
+    color: _sharedUi.night.color.danger,
     fontSize: 11,
     lineHeight: 16,
     fontFamily: "monospace"
@@ -308,10 +308,10 @@ const styles = _reactNative.StyleSheet.create({
     justifyContent: "center",
     borderRadius: 10,
     borderWidth: 1,
-    borderColor: _sharedUi.macOSColors.border.default
+    borderColor: _sharedUi.night.color.border
   },
   cancelText: {
-    color: _sharedUi.macOSColors.text.secondary,
+    color: _sharedUi.night.color.textSecondary,
     fontSize: 14,
     fontWeight: "600"
   },
@@ -321,13 +321,13 @@ const styles = _reactNative.StyleSheet.create({
     alignItems: "center",
     justifyContent: "center",
     borderRadius: 10,
-    backgroundColor: _sharedUi.macOSColors.semantic.success
+    backgroundColor: _sharedUi.night.color.accent
   },
   saveDisabled: {
     opacity: 0.35
   },
   saveText: {
-    color: _sharedUi.macOSColors.background.base,
+    color: _sharedUi.night.color.onAccent,
     fontSize: 15,
     fontWeight: "700"
   },
@@ -342,15 +342,15 @@ const styles = _reactNative.StyleSheet.create({
     justifyContent: "center",
     borderRadius: 12,
     borderWidth: 1,
-    borderColor: _sharedUi.macOSColors.border.default,
-    backgroundColor: _sharedUi.macOSColors.background.base
+    borderColor: _sharedUi.night.color.border,
+    backgroundColor: _sharedUi.night.color.surfaceElevated
   },
   boolActive: {
     borderColor: _sharedUi.macOSColors.semantic.warning,
     backgroundColor: _sharedUi.macOSColors.semantic.warning + "18"
   },
   boolText: {
-    color: _sharedUi.macOSColors.text.muted,
+    color: _sharedUi.night.color.textTertiary,
     fontSize: 16,
     fontWeight: "700",
     fontFamily: "monospace"

package/lib/module/storage/components/DiffViewer/DiffOptionsPanel.js

@@ -1,7 +1,7 @@
 "use strict";
 
 import { View, Text, StyleSheet, TouchableOpacity, Switch } from "react-native";
-import { macOSColors, Settings, Hash, FileText, Filter } from "@buoy-gg/shared-ui";
+import { night, Settings, Hash, FileText, Filter } from "@buoy-gg/shared-ui";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const COMPARE_METHODS = [{
   id: "chars",
@@ -44,7 +44,7 @@ export function DiffOptionsPanel({
       activeOpacity: 0.7,
       children: [/*#__PURE__*/_jsx(Settings, {
         size: 12,
-        color: macOSColors.semantic.info
+        color: night.color.accent
       }), /*#__PURE__*/_jsx(Text, {
         style: styles.toggleText,
         children: "Options"
@@ -73,7 +73,7 @@ export function DiffOptionsPanel({
               style: styles.optionLeft,
               children: [/*#__PURE__*/_jsx(Hash, {
                 size: 11,
-                color: macOSColors.text.secondary
+                color: night.color.textSecondary
               }), /*#__PURE__*/_jsx(Text, {
                 style: styles.optionLabel,
                 children: "Line Numbers"
@@ -82,10 +82,10 @@ export function DiffOptionsPanel({
               value: !options.hideLineNumbers,
               onValueChange: value => updateOption("hideLineNumbers", !value),
               trackColor: {
-                false: macOSColors.border.default,
-                true: macOSColors.semantic.success + "60"
+                false: night.color.surfaceElevated,
+                true: night.color.accent
               },
-              thumbColor: !options.hideLineNumbers ? macOSColors.semantic.success : macOSColors.text.muted,
+              thumbColor: night.color.knob,
               style: styles.switch
             })]
           }), /*#__PURE__*/_jsx(Text, {
@@ -100,7 +100,7 @@ export function DiffOptionsPanel({
               style: styles.optionLeft,
               children: [/*#__PURE__*/_jsx(FileText, {
                 size: 11,
-                color: macOSColors.text.secondary
+                color: night.color.textSecondary
               }), /*#__PURE__*/_jsx(Text, {
                 style: styles.optionLabel,
                 children: "Word Diff"
@@ -109,10 +109,10 @@ export function DiffOptionsPanel({
               value: !options.disableWordDiff,
               onValueChange: value => updateOption("disableWordDiff", !value),
               trackColor: {
-                false: macOSColors.border.default,
-                true: macOSColors.semantic.success + "60"
+                false: night.color.surfaceElevated,
+                true: night.color.accent
               },
-              thumbColor: !options.disableWordDiff ? macOSColors.semantic.success : macOSColors.text.muted,
+              thumbColor: night.color.knob,
               style: styles.switch
             })]
           }), /*#__PURE__*/_jsx(Text, {
@@ -127,7 +127,7 @@ export function DiffOptionsPanel({
               style: styles.optionLeft,
               children: [/*#__PURE__*/_jsx(Filter, {
                 size: 11,
-                color: macOSColors.text.secondary
+                color: night.color.textSecondary
               }), /*#__PURE__*/_jsx(Text, {
                 style: styles.optionLabel,
                 children: "Diff Only"
@@ -136,10 +136,10 @@ export function DiffOptionsPanel({
               value: options.showDiffOnly,
               onValueChange: value => updateOption("showDiffOnly", value),
               trackColor: {
-                false: macOSColors.border.default,
-                true: macOSColors.semantic.success + "60"
+                false: night.color.surfaceElevated,
+                true: night.color.accent
               },
-              thumbColor: options.showDiffOnly ? macOSColors.semantic.success : macOSColors.text.muted,
+              thumbColor: night.color.knob,
               style: styles.switch
             })]
           }), /*#__PURE__*/_jsx(Text, {
@@ -198,7 +198,7 @@ const styles = StyleSheet.create({
   toggleButton: {
     flexDirection: "row",
     alignItems: "center",
-    backgroundColor: macOSColors.background.card,
+    backgroundColor: night.color.surface,
     paddingVertical: 6,
     paddingHorizontal: 10,
     borderRadius: 4,
@@ -207,18 +207,18 @@ const styles = StyleSheet.create({
   toggleText: {
     fontSize: 10,
     fontWeight: "600",
-    color: macOSColors.semantic.info,
+    color: night.color.accent,
     fontFamily: "monospace",
     flex: 1
   },
   toggleIndicator: {
     fontSize: 8,
-    color: macOSColors.text.muted,
+    color: night.color.textTertiary,
     fontFamily: "monospace"
   },
   optionsContent: {
     marginTop: 8,
-    backgroundColor: macOSColors.background.input,
+    backgroundColor: night.color.surface,
     borderRadius: 6,
     padding: 12,
     gap: 16
@@ -229,7 +229,7 @@ const styles = StyleSheet.create({
   sectionTitle: {
     fontSize: 9,
     fontWeight: "700",
-    color: macOSColors.semantic.info,
+    color: night.color.accent,
     fontFamily: "monospace",
     letterSpacing: 0.5,
     marginBottom: 4
@@ -250,12 +250,12 @@ const styles = StyleSheet.create({
   },
   optionLabel: {
     fontSize: 11,
-    color: macOSColors.text.primary,
+    color: night.color.text,
     fontFamily: "monospace"
   },
   optionDescription: {
     fontSize: 9,
-    color: macOSColors.text.muted,
+    color: night.color.textTertiary,
     fontFamily: "monospace",
     marginTop: 4,
     marginLeft: 19,
@@ -276,27 +276,27 @@ const styles = StyleSheet.create({
   methodButton: {
     paddingVertical: 6,
     paddingHorizontal: 10,
-    backgroundColor: macOSColors.background.input,
+    backgroundColor: night.color.surfaceElevated,
     borderRadius: 4,
     borderWidth: 1,
-    borderColor: macOSColors.border.default
+    borderColor: night.color.border
   },
   methodButtonActive: {
-    backgroundColor: macOSColors.semantic.infoBackground,
-    borderColor: macOSColors.semantic.info + "40"
+    backgroundColor: night.color.accentSoft,
+    borderColor: night.color.accentBorderStrong
   },
   methodButtonText: {
     fontSize: 9,
     fontFamily: "monospace",
-    color: macOSColors.text.muted,
+    color: night.color.textTertiary,
     fontWeight: "600"
   },
   methodButtonTextActive: {
-    color: macOSColors.semantic.info
+    color: night.color.accent
   },
   methodDescription: {
     fontSize: 9,
-    color: macOSColors.text.muted,
+    color: night.color.textTertiary,
     fontFamily: "monospace",
     marginTop: 8,
     lineHeight: 12
@@ -310,33 +310,33 @@ const styles = StyleSheet.create({
     height: 28,
     justifyContent: "center",
     alignItems: "center",
-    backgroundColor: macOSColors.background.input,
+    backgroundColor: night.color.surfaceElevated,
     borderRadius: 4,
     borderWidth: 1,
-    borderColor: macOSColors.border.default
+    borderColor: night.color.border
   },
   contextButtonActive: {
-    backgroundColor: macOSColors.semantic.warningBackground,
-    borderColor: macOSColors.semantic.warning + "40"
+    backgroundColor: night.color.accentSoft,
+    borderColor: night.color.accentBorderStrong
   },
   contextButtonText: {
     fontSize: 10,
     fontFamily: "monospace",
-    color: macOSColors.text.muted,
+    color: night.color.textTertiary,
     fontWeight: "600"
   },
   contextButtonTextActive: {
-    color: macOSColors.semantic.warning
+    color: night.color.accent
   },
   contextDescription: {
     fontSize: 9,
-    color: macOSColors.text.muted,
+    color: night.color.textTertiary,
     fontFamily: "monospace",
     marginTop: 8,
     lineHeight: 12
   },
   activeIndicator: {
-    backgroundColor: macOSColors.semantic.warningBackground,
+    backgroundColor: night.color.warningSoft,
     paddingHorizontal: 6,
     paddingVertical: 2,
     borderRadius: 3,
@@ -346,7 +346,7 @@ const styles = StyleSheet.create({
   activeIndicatorText: {
     fontSize: 8,
     fontFamily: "monospace",
-    color: macOSColors.semantic.warning,
+    color: night.color.warning,
     fontWeight: "600"
   }
 });

package/lib/module/storage/components/DiffViewer/TreeDiffViewer.js

@@ -1,7 +1,7 @@
 "use strict";
 
 import { View, StyleSheet } from "react-native";
-import { gameUIColors } from "@buoy-gg/shared-ui";
+import { night } from "@buoy-gg/shared-ui";
 import { TreeDiffViewer as SharedTreeDiffViewer } from "@buoy-gg/shared-ui/dataViewer";
 import { jsx as _jsx } from "react/jsx-runtime";
 export function TreeDiffViewer({
@@ -22,11 +22,11 @@ export function TreeDiffViewer({
 const styles = StyleSheet.create({
   container: {
     flex: 1,
-    backgroundColor: gameUIColors.background
+    backgroundColor: night.color.bg
   },
   // Inline: size to the tree so the page scroll reveals it, rather than
   // stretching to the pane and clipping the rows.
   containerInline: {
-    backgroundColor: gameUIColors.background
+    backgroundColor: night.color.bg
   }
 });

package/lib/module/storage/components/DiffViewer/themes/diffThemes.js

@@ -1,109 +1,10 @@
 "use strict";
 
 /**
- * Diff Viewer Theme System
- *
- * Only three official themes:
- * 1. Git Classic - Traditional Git colors
- * 2. VS Code Dark Modern - Exact VS Code Dark Modern theme
- * 3. Dev Tools Default - Custom dark theme for our dev tools
+ * Re-export shim — the diff theme system now lives in
+ * @buoy-gg/shared-ui/dataViewer (this used to be a byte-for-byte fork, and
+ * the night-theme pass had to be made twice before it was collapsed; same
+ * story as ../modes/ThemedSplitView). Keep importing from here inside the
+ * storage package.
  */
-
-/**
- * Git Classic Theme
- * Traditional Git diff colors - simple and familiar
- */
-export const gitClassicTheme = {
-  name: "Git Classic",
-  description: "Traditional Git diff colors - simple and familiar",
-  background: "#FFFFFF",
-  panelBackground: "#F8F8F8",
-  headerBackground: "#F0F0F0",
-  addedBackground: "#E6FFED",
-  removedBackground: "#FFEEF0",
-  modifiedBackground: "#FFF5DD",
-  unchangedBackground: "transparent",
-  contextBackground: "#FAFAFA",
-  addedText: "#22863A",
-  removedText: "#CB2431",
-  modifiedText: "#B08800",
-  unchangedText: "#24292E",
-  addedWordHighlight: "#ACF2BD",
-  removedWordHighlight: "#FDB8C0",
-  lineNumberBackground: "#F6F8FA",
-  lineNumberText: "#959DA5",
-  lineNumberBorder: "#E1E4E8",
-  markerAddedBackground: "#CDFFD8",
-  markerRemovedBackground: "#FFDCE0",
-  markerModifiedBackground: "#FFF5B1",
-  markerText: "#666666",
-  borderColor: "#E1E4E8",
-  dividerColor: "#E1E4E8",
-  summaryBackground: "#F6F8FA",
-  summaryAddedText: "#28A745",
-  summaryRemovedText: "#D73A49",
-  summaryModifiedText: "#0366D6",
-  emptyStateText: "#586069",
-  separatorBackground: "#F6F8FA",
-  separatorText: "#586069"
-};
-
-/**
- * Dev Tools Default Theme
- * Clean dark theme matching Buoy website brand colors
- */
-export const devToolsDefaultTheme = {
-  name: "Dev Tools Default",
-  description: "Clean dark theme with Buoy brand colors",
-  // Surface colors (matching website dark theme)
-  background: "#121212",
-  panelBackground: "#1A1A1A",
-  headerBackground: "#1A1A1A",
-  // Diff colors using website's semantic colors
-  // Added: Primary teal (#20C997)
-  // Removed: Error red (#EF4444)
-  // Modified: Secondary purple (#9B70E0)
-  addedBackground: "rgba(32, 201, 151, 0.12)",
-  removedBackground: "rgba(239, 68, 68, 0.12)",
-  modifiedBackground: "rgba(155, 112, 224, 0.12)",
-  unchangedBackground: "transparent",
-  contextBackground: "rgba(255, 255, 255, 0.02)",
-  // Text colors
-  addedText: "#20C997",
-  removedText: "#EF4444",
-  modifiedText: "#9B70E0",
-  unchangedText: "#E0E0E0",
-  // Word-level highlights
-  addedWordHighlight: "rgba(32, 201, 151, 0.3)",
-  removedWordHighlight: "rgba(239, 68, 68, 0.3)",
-  // UI elements
-  lineNumberBackground: "#121212",
-  lineNumberText: "#A0A0A0",
-  lineNumberBorder: "#333333",
-  // Markers
-  markerAddedBackground: "rgba(32, 201, 151, 0.2)",
-  markerRemovedBackground: "rgba(239, 68, 68, 0.2)",
-  markerModifiedBackground: "rgba(155, 112, 224, 0.2)",
-  markerText: "#A0A0A0",
-  // Borders and dividers
-  borderColor: "#333333",
-  dividerColor: "#333333",
-  // Summary bar
-  summaryBackground: "#1A1A1A",
-  summaryAddedText: "#20C997",
-  summaryRemovedText: "#EF4444",
-  summaryModifiedText: "#9B70E0",
-  // Empty state
-  emptyStateText: "#888888",
-  // Separator
-  separatorBackground: "#1A1A1A",
-  separatorText: "#A0A0A0"
-};
-
-/**
- * Theme collection
- */
-export const diffThemes = {
-  gitClassic: gitClassicTheme,
-  devToolsDefault: devToolsDefaultTheme
-};
+export { diffThemes, gitClassicTheme, devToolsDefaultTheme } from "@buoy-gg/shared-ui/dataViewer";