Revert "Update semantic color tokens" (#6365)

packages/cli/src/ui/components/ThemeDialog.tsx

@@ -6,7 +6,7 @@
 
 import React, { useCallback, useState } from 'react';
 import { Box, Text } from 'ink';
-import { theme } from '../semantic-colors.js';
+import { Colors } from '../colors.js';
 import { themeManager, DEFAULT_THEME } from '../themes/theme-manager.js';
 import { RadioButtonSelect } from './shared/RadioButtonSelect.js';
 import { DiffRenderer } from './messages/DiffRenderer.js';
@@ -207,7 +207,7 @@ export function ThemeDialog({
   return (
     <Box
       borderStyle="round"
-      borderColor={theme.border.default}
+      borderColor={Colors.Gray}
       flexDirection="column"
       paddingTop={includePadding ? 1 : 0}
       paddingBottom={includePadding ? 1 : 0}
@@ -218,19 +218,9 @@ export function ThemeDialog({
       <Box flexDirection="row">
         {/* Left Column: Selection */}
         <Box flexDirection="column" width="45%" paddingRight={2}>
-          <Text
-            bold={currentFocusedSection === 'theme'}
-            wrap="truncate"
-            color={
-              currentFocusedSection === 'theme'
-                ? theme.text.primary
-                : theme.text.secondary
-            }
-          >
+          <Text bold={currentFocusedSection === 'theme'} wrap="truncate">
             {currentFocusedSection === 'theme' ? '> ' : '  '}Select Theme{' '}
-            <Text color={theme.text.secondary}>
-              {otherScopeModifiedMessage}
-            </Text>
+            <Text color={Colors.Gray}>{otherScopeModifiedMessage}</Text>
           </Text>
           <RadioButtonSelect
             key={selectInputKey}
@@ -247,15 +237,7 @@ export function ThemeDialog({
           {/* Scope Selection */}
           {showScopeSelection && (
             <Box marginTop={1} flexDirection="column">
-              <Text
-                bold={currentFocusedSection === 'scope'}
-                wrap="truncate"
-                color={
-                  currentFocusedSection === 'scope'
-                    ? theme.text.primary
-                    : theme.text.secondary
-                }
-              >
+              <Text bold={currentFocusedSection === 'scope'} wrap="truncate">
                 {currentFocusedSection === 'scope' ? '> ' : '  '}Apply To
               </Text>
               <RadioButtonSelect
@@ -272,9 +254,7 @@ export function ThemeDialog({
 
         {/* Right Column: Preview */}
         <Box flexDirection="column" width="55%" paddingLeft={2}>
-          <Text bold color={theme.text.primary}>
-            Preview
-          </Text>
+          <Text bold>Preview</Text>
           {/* Get the Theme object for the highlighted theme, fall back to default if not found */}
           {(() => {
             const previewTheme =
@@ -284,7 +264,7 @@ export function ThemeDialog({
             return (
               <Box
                 borderStyle="single"
-                borderColor={theme.border.default}
+                borderColor={Colors.Gray}
                 paddingTop={includePadding ? 1 : 0}
                 paddingBottom={includePadding ? 1 : 0}
                 paddingLeft={1}
@@ -301,7 +281,6 @@ def fibonacci(n):
                   'python',
                   codeBlockHeight,
                   colorizeCodeWidth,
-                  previewTheme,
                 )}
                 <Box marginTop={1} />
                 <DiffRenderer
@@ -321,7 +300,7 @@ def fibonacci(n):
         </Box>
       </Box>
       <Box marginTop={1}>
-        <Text color={theme.text.secondary} wrap="truncate">
+        <Text color={Colors.Gray} wrap="truncate">
           (Use Enter to select
           {showScopeSelection ? ', Tab to change focus' : ''})
         </Text>