diff --git a/packages/cli/src/ui/components/Header.test.tsx b/packages/cli/src/ui/components/Header.test.tsx
index 4cadc73a48..ecf1adf8b0 100644
--- a/packages/cli/src/ui/components/Header.test.tsx
+++ b/packages/cli/src/ui/components/Header.test.tsx
@@ -116,13 +116,38 @@ describe('', () => {
it('renders with no gradient when theme.ui.gradient is undefined', async () => {
vi.spyOn(semanticColors, 'theme', 'get').mockReturnValue({
- ui: { gradient: undefined },
- } as typeof semanticColors.theme);
+ text: {
+ primary: '',
+ secondary: '',
+ link: '',
+ accent: '#123456',
+ response: '',
+ },
+ background: {
+ primary: '',
+ diff: { added: '', removed: '' },
+ },
+ border: {
+ default: '',
+ focused: '',
+ },
+ ui: {
+ comment: '',
+ symbol: '',
+ dark: '',
+ gradient: undefined,
+ },
+ status: {
+ error: '',
+ success: '',
+ warning: '',
+ },
+ });
const Gradient = await import('ink-gradient');
render();
expect(Gradient.default).not.toHaveBeenCalled();
const textCalls = (Text as Mock).mock.calls;
- expect(textCalls[0][0]).not.toHaveProperty('color');
+ expect(textCalls[0][0]).toHaveProperty('color', '#123456');
});
it('renders with a single color when theme.ui.gradient has one color', async () => {
diff --git a/packages/cli/src/ui/components/ThemedGradient.tsx b/packages/cli/src/ui/components/ThemedGradient.tsx
index 339626c04f..1a5b14ee3c 100644
--- a/packages/cli/src/ui/components/ThemedGradient.tsx
+++ b/packages/cli/src/ui/components/ThemedGradient.tsx
@@ -28,5 +28,10 @@ export const ThemedGradient: React.FC = ({ children, ...props }) => {
);
}
- return {children};
+ // Fallback to accent color if no gradient
+ return (
+
+ {children}
+
+ );
};