Allow themes to theme the UI (#769)

This commit is contained in:
Miguel Solorio
2025-06-05 14:35:47 -07:00
committed by GitHub
parent 2285bba66e
commit 8a0a2523ca
33 changed files with 533 additions and 385 deletions

View File

@@ -107,7 +107,7 @@ export const DiffRenderer: React.FC<DiffRendererProps> = ({
if (parsedLines.length === 0) {
return (
<Box borderStyle="round" borderColor={Colors.SubtleComment} padding={1}>
<Box borderStyle="round" borderColor={Colors.Gray} padding={1}>
<Text dimColor>No changes detected.</Text>
</Box>
);
@@ -162,7 +162,7 @@ const renderDiffContent = (
if (displayableLines.length === 0) {
return (
<Box borderStyle="round" borderColor={Colors.SubtleComment} padding={1}>
<Box borderStyle="round" borderColor={Colors.Gray} padding={1}>
<Text dimColor>No changes detected.</Text>
</Box>
);
@@ -217,7 +217,7 @@ const renderDiffContent = (
borderRight={false}
borderLeft={false}
borderStyle="double"
borderColor={Colors.SubtleComment}
borderColor={Colors.Gray}
></Box>,
);
}
@@ -260,7 +260,7 @@ const renderDiffContent = (
acc.push(
<Box key={lineKey} flexDirection="row">
<Text color={Colors.SubtleComment}>{gutterNumStr.padEnd(4)} </Text>
<Text color={Colors.Gray}>{gutterNumStr.padEnd(4)} </Text>
<Text color={color} dimColor={dim}>
{prefixSymbol}{' '}
</Text>

View File

@@ -25,7 +25,7 @@ export const ToolGroupMessage: React.FC<ToolGroupMessageProps> = ({
const hasPending = !toolCalls.every(
(t) => t.status === ToolCallStatus.Success,
);
const borderColor = hasPending ? Colors.AccentYellow : Colors.SubtleComment;
const borderColor = hasPending ? Colors.AccentYellow : Colors.Gray;
const staticHeight = /* border */ 2 + /* marginBottom */ 1;

View File

@@ -72,7 +72,7 @@ export const ToolMessage: React.FC<ToolMessageProps> = ({
<Box flexDirection="column">
{hiddenLines > 0 && (
<Box>
<Text color={Colors.SubtleComment}>
<Text color={Colors.Gray}>
... first {hiddenLines} line{hiddenLines === 1 ? '' : 's'}{' '}
hidden ...
</Text>
@@ -162,7 +162,7 @@ const ToolInfo: React.FC<ToolInfo> = ({
case 'medium':
return Colors.Foreground;
case 'low':
return Colors.SubtleComment;
return Colors.Gray;
default: {
const exhaustiveCheck: never = emphasis;
return exhaustiveCheck;
@@ -178,7 +178,7 @@ const ToolInfo: React.FC<ToolInfo> = ({
<Text color={nameColor} bold>
{name}
</Text>{' '}
<Text color={Colors.SubtleComment}>{description}</Text>
<Text color={Colors.Gray}>{description}</Text>
</Text>
</Box>
);