feat(ui): Semantic tokens refactor (#8087)

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

@@ -7,7 +7,7 @@
 import type React from 'react';
 import { useState } from 'react';
 import { Box, Text } from 'ink';
-import { Colors } from '../colors.js';
+import { theme } from '../semantic-colors.js';
 import {
   EDITOR_DISPLAY_NAMES,
   editorSettingsManager,
@@ -112,7 +112,7 @@ export function EditorSettingsDialog({
   return (
     <Box
       borderStyle="round"
-      borderColor={Colors.Gray}
+      borderColor={theme.border.default}
       flexDirection="row"
       padding={1}
       width="100%"
@@ -120,7 +120,7 @@ export function EditorSettingsDialog({
       <Box flexDirection="column" width="45%" paddingRight={2}>
         <Text bold={focusedSection === 'editor'}>
           {focusedSection === 'editor' ? '> ' : '  '}Select Editor{' '}
-          <Text color={Colors.Gray}>{otherScopeModifiedMessage}</Text>
+          <Text color={theme.text.secondary}>{otherScopeModifiedMessage}</Text>
         </Text>
         <RadioButtonSelect
           items={editorItems.map((item) => ({
@@ -147,7 +147,7 @@ export function EditorSettingsDialog({
         </Box>
 
         <Box marginTop={1}>
-          <Text color={Colors.Gray}>
+          <Text color={theme.text.secondary}>
             (Use Enter to select, Tab to change focus)
           </Text>
         </Box>
@@ -156,17 +156,17 @@ export function EditorSettingsDialog({
       <Box flexDirection="column" width="55%" paddingLeft={2}>
         <Text bold>Editor Preference</Text>
         <Box flexDirection="column" gap={1} marginTop={1}>
-          <Text color={Colors.Gray}>
+          <Text color={theme.text.secondary}>
             These editors are currently supported. Please note that some editors
             cannot be used in sandbox mode.
           </Text>
-          <Text color={Colors.Gray}>
+          <Text color={theme.text.secondary}>
             Your preferred editor is:{' '}
             <Text
               color={
                 mergedEditorName === 'None'
-                  ? Colors.AccentRed
-                  : Colors.AccentCyan
+                  ? theme.status.error
+                  : theme.text.link
               }
               bold
             >