@buoy-gg/assets 7.0.25 → 7.0.27

package/src/components/AssetRow.tsx

@@ -12,7 +12,7 @@
  */
 
 import { Image, StyleSheet, Text, TouchableOpacity, View } from "react-native";
-import { macOSColors } from "@buoy-gg/shared-ui";
+import { macOSColors, night } from "@buoy-gg/shared-ui";
 import { displaySource } from "../capture/measure";
 import {
   formatDimensions,
@@ -141,9 +141,9 @@ const styles = StyleSheet.create({
     marginHorizontal: 10,
     marginTop: 6,
     borderRadius: 10,
-    backgroundColor: macOSColors.background.card,
+    backgroundColor: night.color.surface,
     borderWidth: 1,
-    borderColor: macOSColors.border.default,
+    borderColor: night.color.border,
     overflow: "hidden",
   },
   body: {
@@ -160,7 +160,7 @@ const styles = StyleSheet.create({
     // Light plate so dark glyph assets stay visible on the dark card.
     backgroundColor: "rgba(255,255,255,0.10)",
     borderWidth: 1,
-    borderColor: macOSColors.border.default,
+    borderColor: night.color.border,
     alignItems: "center",
     justifyContent: "center",
     overflow: "hidden",
@@ -179,12 +179,12 @@ const styles = StyleSheet.create({
     gap: 3,
   },
   name: {
-    color: macOSColors.text.primary,
+    color: night.color.text,
     fontSize: 12,
     fontWeight: "600",
   },
   ext: {
-    color: macOSColors.text.muted,
+    color: night.color.textTertiary,
     fontWeight: "400",
   },
   metaRow: {
@@ -193,7 +193,7 @@ const styles = StyleSheet.create({
     gap: 8,
   },
   meta: {
-    color: macOSColors.text.secondary,
+    color: night.color.textSecondary,
     fontSize: 10,
     fontVariant: ["tabular-nums"],
   },
@@ -202,7 +202,7 @@ const styles = StyleSheet.create({
     gap: 4,
   },
   size: {
-    color: macOSColors.text.primary,
+    color: night.color.text,
     fontSize: 12,
     fontWeight: "700",
     fontVariant: ["tabular-nums"],
@@ -226,7 +226,7 @@ const styles = StyleSheet.create({
     borderRadius: 2.5,
   },
   badgePillText: {
-    color: macOSColors.text.secondary,
+    color: night.color.textSecondary,
     fontSize: 9,
     fontWeight: "600",
     letterSpacing: 0.3,

package/src/components/AssetsFilterBar.tsx

@@ -6,7 +6,7 @@
  */
 
 import { StyleSheet, Text, TouchableOpacity, View } from "react-native";
-import { macOSColors } from "@buoy-gg/shared-ui";
+import { night } from "@buoy-gg/shared-ui";
 import { KIND_COLORS, KIND_LABELS } from "../format";
 import type { AssetKind, AssetsStats } from "../types";
 
@@ -20,7 +20,7 @@ interface AssetsFilterBarProps {
 
 export function AssetsFilterBar({ stats, filter, onChange }: AssetsFilterBarProps) {
   const chips: Array<{ key: AssetFilter; label: string; accent: string }> = [
-    { key: "all", label: `ALL ${stats.total}`, accent: macOSColors.text.secondary },
+    { key: "all", label: `ALL ${stats.total}`, accent: night.color.textSecondary },
   ];
   for (const kind of Object.keys(stats.byKind) as AssetKind[]) {
     const entry = stats.byKind[kind];
@@ -62,7 +62,7 @@ export function AssetsFilterBar({ stats, filter, onChange }: AssetsFilterBarProp
             <Text
               style={[
                 styles.chipText,
-                { color: active ? chip.accent : macOSColors.text.secondary },
+                { color: active ? chip.accent : night.color.textSecondary },
               ]}
             >
               {chip.label}
@@ -84,8 +84,8 @@ const styles = StyleSheet.create({
   },
   chip: {
     borderWidth: 1,
-    borderColor: macOSColors.border.default,
-    backgroundColor: macOSColors.background.card,
+    borderColor: night.color.border,
+    backgroundColor: night.color.surface,
     borderRadius: 999,
     paddingHorizontal: 10,
     paddingVertical: 5,

package/src/components/AssetsListControls.tsx

@@ -6,7 +6,7 @@
  */
 
 import { StyleSheet, Text, TextInput, TouchableOpacity, View } from "react-native";
-import { macOSColors } from "@buoy-gg/shared-ui";
+import { night } from "@buoy-gg/shared-ui";
 import { saveBaseline } from "../store/baseline";
 
 export type AssetSort = "size" | "name" | "type";
@@ -40,7 +40,7 @@ export function AssetsListControls({
         value={query}
         onChangeText={onQueryChange}
         placeholder="Search assets…"
-        placeholderTextColor={macOSColors.text.muted}
+        placeholderTextColor={night.color.placeholder}
         autoCapitalize="none"
         autoCorrect={false}
         testID="buoy-assets-search"
@@ -75,25 +75,25 @@ const styles = StyleSheet.create({
   },
   input: {
     flex: 1,
-    backgroundColor: macOSColors.background.input,
+    backgroundColor: night.color.surfaceElevated,
     borderWidth: 1,
-    borderColor: macOSColors.border.default,
+    borderColor: night.color.border,
     borderRadius: 8,
     paddingHorizontal: 10,
     paddingVertical: 6,
-    color: macOSColors.text.primary,
+    color: night.color.text,
     fontSize: 12,
   },
   button: {
-    backgroundColor: macOSColors.background.card,
+    backgroundColor: night.color.surface,
     borderWidth: 1,
-    borderColor: macOSColors.border.default,
+    borderColor: night.color.border,
     borderRadius: 8,
     paddingHorizontal: 10,
     paddingVertical: 7,
   },
   buttonText: {
-    color: macOSColors.text.secondary,
+    color: night.color.textSecondary,
     fontSize: 10,
     fontWeight: "700",
     letterSpacing: 0.5,

package/src/components/AssetsModal.tsx

@@ -7,7 +7,7 @@
 
 import { useEffect, useState } from "react";
 import { FlatList, StyleSheet, Text, View } from "react-native";
-import { EventStepperFooter, JsModal, macOSColors } from "@buoy-gg/shared-ui";
+import { EventStepperFooter, JsModal, macOSColors, night } from "@buoy-gg/shared-ui";
 import type { ModalState } from "@buoy-gg/shared-ui";
 import { getScanStatus, installAssetCapture, rescan } from "../capture/install";
 import { formatAssetMarkdown, formatInventoryMarkdown } from "../export";
@@ -289,7 +289,9 @@ const styles = StyleSheet.create({
   inlineRoot: {
     flex: 1,
     minHeight: 0,
-    backgroundColor: 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,
@@ -313,12 +315,12 @@ const styles = StyleSheet.create({
     padding: 10,
     borderRadius: 8,
     borderWidth: 1,
-    borderColor: macOSColors.border.default,
-    backgroundColor: macOSColors.background.card,
+    borderColor: night.color.border,
+    backgroundColor: night.color.surface,
     gap: 4,
   },
   noticeText: {
-    color: macOSColors.text.secondary,
+    color: night.color.textSecondary,
     fontSize: 11,
   },
   fontsBox: {
@@ -326,11 +328,11 @@ const styles = StyleSheet.create({
     marginTop: 8,
     padding: 10,
     borderRadius: 8,
-    backgroundColor: macOSColors.background.card,
+    backgroundColor: night.color.surface,
     gap: 6,
   },
   fontsTitle: {
-    color: macOSColors.text.muted,
+    color: night.color.textTertiary,
     fontSize: 9,
     fontWeight: "700",
     letterSpacing: 0.5,
@@ -341,9 +343,9 @@ const styles = StyleSheet.create({
     gap: 6,
   },
   fontChip: {
-    color: macOSColors.text.secondary,
+    color: night.color.textSecondary,
     fontSize: 10,
-    backgroundColor: macOSColors.background.input,
+    backgroundColor: night.color.bg,
     borderRadius: 999,
     paddingHorizontal: 8,
     paddingVertical: 3,
@@ -355,12 +357,12 @@ const styles = StyleSheet.create({
     gap: 8,
   },
   emptyTitle: {
-    color: macOSColors.text.primary,
+    color: night.color.text,
     fontSize: 13,
     fontWeight: "600",
   },
   emptyText: {
-    color: macOSColors.text.secondary,
+    color: night.color.textSecondary,
     fontSize: 11,
     textAlign: "center",
     lineHeight: 16,

package/src/components/BaselineBar.tsx

@@ -8,7 +8,7 @@
  */
 
 import { StyleSheet, Text, TouchableOpacity, View } from "react-native";
-import { macOSColors } from "@buoy-gg/shared-ui";
+import { macOSColors, night } from "@buoy-gg/shared-ui";
 import { formatBytes } from "../format";
 import { clearBaseline, saveBaseline } from "../store/baseline";
 import type { AssetsDiff } from "../types";
@@ -67,30 +67,30 @@ const styles = StyleSheet.create({
     paddingHorizontal: 10,
     paddingVertical: 6,
     borderWidth: 1,
-    borderColor: macOSColors.border.default,
+    borderColor: night.color.border,
     borderRadius: 8,
-    backgroundColor: macOSColors.background.card,
+    backgroundColor: night.color.surface,
   },
   summary: {
     flex: 1,
-    color: macOSColors.text.secondary,
+    color: night.color.textSecondary,
     fontSize: 10,
     fontWeight: "600",
   },
   age: {
-    color: macOSColors.text.muted,
+    color: night.color.textTertiary,
     fontWeight: "400",
   },
   button: {
-    backgroundColor: macOSColors.background.input,
+    backgroundColor: night.color.surfaceElevated,
     borderWidth: 1,
-    borderColor: macOSColors.border.default,
+    borderColor: night.color.border,
     borderRadius: 6,
     paddingHorizontal: 8,
     paddingVertical: 5,
   },
   buttonText: {
-    color: macOSColors.text.secondary,
+    color: night.color.textSecondary,
     fontSize: 9,
     fontWeight: "700",
     letterSpacing: 0.5,