@buoy-gg/console 7.0.26 → 7.0.28

package/src/devtools/theme.ts

@@ -1,12 +1,9 @@
 /**
- * Console palette — a dark theme matched to Buoy's shared design tokens
- * (`macOSColors` in @buoy-gg/shared-ui) so the console reads as part of the
- * tool suite, tuned for contrast per WCAG AA:
- *   - body text  #F5F5F7 on #0A0A0C   ≈ 17:1
- *   - secondary  #A1A1A6 on #0A0A0C   ≈ 7:1
- *   - links      #40CCFF on #0A0A0C   ≈ 9:1
- *   - dividers / nesting guides lightened to ~#3A3A40 so lines are clearly
- *     visible against the near-black surface.
+ * Console palette — a dark theme whose CHROME entries (surfaces, dividers,
+ * default/secondary text) come from Buoy's `night` tokens so the console reads
+ * as part of the night suite, while the Chrome-DevTools DATA colours (level
+ * rows, value types, links, ANSI) stay classic — they tell the user something
+ * about the logged data.
  * `lightTheme` below holds the exact DevTools light tokens and `consoleTheme`
  * picks between the two from the host app's surface. Every shipped theme is
  * dark today, so the light branch is currently unreachable — it is kept because
@@ -17,7 +14,7 @@
  */
 
 import { Platform } from "react-native";
-import { macOSColors } from "@buoy-gg/shared-ui";
+import { night } from "@buoy-gg/shared-ui";
 
 /**
  * Monospace font. On the desktop dashboard (react-native-web) the generic
@@ -72,18 +69,18 @@ export const lightTheme: ConsoleColors = {
   valuePreview: "rgba(31,31,31,0.62)",
 };
 
-/** Dark theme (active) — matched to Buoy macOSColors, contrast-tuned. */
+/** Dark theme (active) — night chrome, classic DevTools data colours. */
 export const darkTheme: ConsoleColors = {
-  baseContainer: "#0A0A0C", // macOSColors.background.base
+  baseContainer: "#0A0A0C", // desktop inline shell base (modal path is transparent)
   surfaceError: "rgba(255,69,58,0.15)", // semantic.errorBackground
   surfaceYellow: "rgba(255,235,59,0.13)", // semantic.warningBackground
-  divider: "#3A3A40", // lightened from border.default (#2D2D2F) for visible lines
-  inputBackground: "#26262A", // background.input
-  menuBackground: "#1A1A1C", // background.card
-  onSurface: "#F5F5F7", // text.primary  (~17:1)
+  divider: night.color.fillTertiary, // row hairlines + nesting guides (strong enough to stay visible)
+  inputBackground: night.color.surfaceElevated,
+  menuBackground: night.color.surface,
+  onSurface: night.color.text,
   onSurfaceYellow: "#FFE9A3", // light warm yellow on dark warning row
   onErrorContainer: "#FFB4AB", // light red on dark error row
-  tokenSubtle: "#A1A1A6", // text.secondary (~7:1 — timestamps, previews)
+  tokenSubtle: night.color.textSecondary, // timestamps, previews
   primary: "#40CCFF", // semantic.infoLight (links, ~9:1)
   valueNumber: "#FF9F1C", // orange (number + boolean)
   valueString: "#7EE787", // green (string/regexp/symbol)