Update semantic color tokens (#6253)

Co-authored-by: jacob314 <jacob314@gmail.com>
This commit is contained in:
Miguel Solorio
2025-08-15 15:39:54 -07:00
committed by GitHub
parent 5246aa11f4
commit 3c0af3654a
60 changed files with 606 additions and 502 deletions

View File

@@ -6,11 +6,9 @@
import React from 'react';
import { Box, Text } from 'ink';
import { Colors } from '../../colors.js';
import crypto from 'crypto';
import { colorizeCode, colorizeLine } from '../../utils/CodeColorizer.js';
import { MaxSizedBox } from '../shared/MaxSizedBox.js';
import { theme } from '../../semantic-colors.js';
interface DiffLine {
type: 'add' | 'del' | 'context' | 'hunk' | 'other';
@@ -108,14 +106,20 @@ export const DiffRenderer: React.FC<DiffRendererProps> = ({
theme,
}) => {
if (!diffContent || typeof diffContent !== 'string') {
return <Text color={Colors.AccentYellow}>No diff content.</Text>;
return (
<Text color={theme?.semanticColors.status.warning}>No diff content.</Text>
);
}
const parsedLines = parseDiffWithLineNumbers(diffContent);
if (parsedLines.length === 0) {
return (
<Box borderStyle="round" borderColor={Colors.Gray} padding={1}>
<Box
borderStyle="round"
borderColor={theme?.semanticColors.border.default}
padding={1}
>
<Text dimColor>No changes detected.</Text>
</Box>
);
@@ -158,6 +162,7 @@ export const DiffRenderer: React.FC<DiffRendererProps> = ({
tabWidth,
availableTerminalHeight,
terminalWidth,
theme,
);
}
@@ -170,6 +175,7 @@ const renderDiffContent = (
tabWidth = DEFAULT_TAB_WIDTH,
availableTerminalHeight: number | undefined,
terminalWidth: number,
theme: import('../../themes/theme.js').Theme | undefined,
) => {
// 1. Normalize whitespace (replace tabs with spaces) *before* further processing
const normalizedLines = parsedLines.map((line) => ({
@@ -184,7 +190,11 @@ const renderDiffContent = (
if (displayableLines.length === 0) {
return (
<Box borderStyle="round" borderColor={Colors.Gray} padding={1}>
<Box
borderStyle="round"
borderColor={theme?.semanticColors.border.default}
padding={1}
>
<Text dimColor>No changes detected.</Text>
</Box>
);
@@ -248,7 +258,10 @@ const renderDiffContent = (
) {
acc.push(
<Box key={`gap-${index}`}>
<Text wrap="truncate" color={Colors.Gray}>
<Text
wrap="truncate"
color={theme?.semanticColors.border.default}
>
{'═'.repeat(terminalWidth)}
</Text>
</Box>,
@@ -289,12 +302,12 @@ const renderDiffContent = (
acc.push(
<Box key={lineKey} flexDirection="row">
<Text
color={theme.text.secondary}
color={theme?.semanticColors.text.secondary}
backgroundColor={
line.type === 'add'
? theme.background.diff.added
? theme?.semanticColors.background.diff.added
: line.type === 'del'
? theme.background.diff.removed
? theme?.semanticColors.background.diff.removed
: undefined
}
>
@@ -302,30 +315,32 @@ const renderDiffContent = (
</Text>
{line.type === 'context' ? (
<>
<Text>{prefixSymbol} </Text>
<Text color={theme?.semanticColors.text.primary}>
{prefixSymbol}{' '}
</Text>
<Text wrap="wrap">
{colorizeLine(displayContent, language)}
{colorizeLine(displayContent, language, theme)}
</Text>
</>
) : (
<Text
backgroundColor={
line.type === 'add'
? theme.background.diff.added
: theme.background.diff.removed
? theme?.semanticColors.background.diff.added
: theme?.semanticColors.background.diff.removed
}
wrap="wrap"
>
<Text
color={
line.type === 'add'
? theme.status.success
: theme.status.error
? theme?.semanticColors.status.success
: theme?.semanticColors.status.error
}
>
{prefixSymbol}
</Text>{' '}
{colorizeLine(displayContent, language)}
{colorizeLine(displayContent, language, theme)}
</Text>
)}
</Box>,