@renxqoo/renx-code 0.0.2 → 0.0.4

package/src/ui/theme.simple.test.ts

@@ -0,0 +1,52 @@
+import { describe, expect, it } from 'bun:test';
+
+import { applyUiThemeMode, uiTheme } from './theme';
+
+describe('theme module', () => {
+  it('should have required properties', () => {
+    expect(uiTheme).toBeDefined();
+    expect(typeof uiTheme).toBe('object');
+
+    // 检查关键属性
+    expect(uiTheme.bg).toBeString();
+    expect(uiTheme.surface).toBeString();
+    expect(uiTheme.text).toBeString();
+    expect(uiTheme.accent).toBeString();
+    expect(uiTheme.layout).toBeObject();
+    expect(uiTheme.typography).toBeObject();
+  });
+
+  it('should switch to dark theme', () => {
+    applyUiThemeMode('dark');
+
+    expect(uiTheme.bg).toBe('#09090b');
+    expect(uiTheme.surface).toBe('#18181b');
+    expect(uiTheme.text).toBe('#fafafa');
+    expect(uiTheme.accent).toBe('#8e51ff');
+  });
+
+  it('should switch to light theme', () => {
+    applyUiThemeMode('light');
+
+    expect(uiTheme.bg).toBe('#ffffff');
+    expect(uiTheme.surface).toBe('#ffffff');
+    expect(uiTheme.text).toBe('#09090b');
+    expect(uiTheme.accent).toBe('#7f22fe');
+  });
+
+  it('should create independent theme objects', () => {
+    // 应用暗色主题
+    applyUiThemeMode('dark');
+    const darkThemeBg = uiTheme.bg;
+    const darkThemeText = uiTheme.text;
+
+    // 应用亮色主题
+    applyUiThemeMode('light');
+    const lightThemeBg = uiTheme.bg;
+    const lightThemeText = uiTheme.text;
+
+    // 颜色值应该不同
+    expect(darkThemeBg).not.toBe(lightThemeBg);
+    expect(darkThemeText).not.toBe(lightThemeText);
+  });
+});

package/src/ui/theme.test.ts

@@ -0,0 +1,151 @@
+import { afterEach, beforeEach, describe, expect, it } from 'vitest';
+
+import { applyUiThemeMode, uiTheme } from './theme';
+
+describe('theme module', () => {
+  beforeEach(() => {
+    applyUiThemeMode('dark');
+  });
+
+  afterEach(() => {
+    // 恢复原始主题
+    applyUiThemeMode('dark');
+  });
+
+  describe('uiTheme', () => {
+    it('should be defined', () => {
+      expect(uiTheme).toBeDefined();
+      expect(typeof uiTheme).toBe('object');
+    });
+
+    it('should have required properties', () => {
+      expect(uiTheme).toHaveProperty('bg');
+      expect(uiTheme).toHaveProperty('surface');
+      expect(uiTheme).toHaveProperty('panel');
+      expect(uiTheme).toHaveProperty('text');
+      expect(uiTheme).toHaveProperty('muted');
+      expect(uiTheme).toHaveProperty('subtle');
+      expect(uiTheme).toHaveProperty('accent');
+      expect(uiTheme).toHaveProperty('thinking');
+      expect(uiTheme).toHaveProperty('divider');
+      expect(uiTheme).toHaveProperty('inputCursor');
+      expect(uiTheme).toHaveProperty('inputBg');
+      expect(uiTheme).toHaveProperty('inputSelectionBg');
+      expect(uiTheme).toHaveProperty('inputSelectionText');
+      expect(uiTheme).toHaveProperty('codeBlock');
+      expect(uiTheme).toHaveProperty('diff');
+      expect(uiTheme).toHaveProperty('layout');
+      expect(uiTheme).toHaveProperty('typography');
+    });
+
+    it('should have layout properties', () => {
+      expect(uiTheme.layout).toHaveProperty('appPaddingTop');
+      expect(uiTheme.layout).toHaveProperty('appPaddingBottom');
+      expect(uiTheme.layout).toHaveProperty('appPaddingX');
+      expect(uiTheme.layout).toHaveProperty('conversationPaddingX');
+      expect(uiTheme.layout).toHaveProperty('conversationPaddingY');
+      expect(uiTheme.layout).toHaveProperty('conversationContentPaddingX');
+      expect(uiTheme.layout).toHaveProperty('conversationContentPaddingY');
+      expect(uiTheme.layout).toHaveProperty('promptPaddingX');
+      expect(uiTheme.layout).toHaveProperty('promptPaddingBottom');
+      expect(uiTheme.layout).toHaveProperty('footerMarginTop');
+      expect(uiTheme.layout).toHaveProperty('footerPaddingRight');
+    });
+
+    it('should expose code and diff theme tokens', () => {
+      expect(uiTheme.codeBlock).toHaveProperty('bg');
+      expect(uiTheme.codeBlock).toHaveProperty('language');
+      expect(uiTheme.diff).toHaveProperty('addedBg');
+      expect(uiTheme.diff).toHaveProperty('removedLineNumberBg');
+    });
+
+    it('should have typography properties', () => {
+      expect(uiTheme.typography).toHaveProperty('body');
+      expect(uiTheme.typography).toHaveProperty('code');
+      expect(uiTheme.typography).toHaveProperty('muted');
+      expect(uiTheme.typography).toHaveProperty('note');
+      expect(uiTheme.typography).toHaveProperty('heading');
+    });
+
+    it('should have correct default values for dark theme', () => {
+      // 确保是暗色主题
+      applyUiThemeMode('dark');
+
+      expect(uiTheme.bg).toBe('#09090b');
+      expect(uiTheme.surface).toBe('#18181b');
+      expect(uiTheme.text).toBe('#fafafa');
+      expect(uiTheme.accent).toBe('#8e51ff');
+    });
+  });
+
+  describe('applyUiThemeMode', () => {
+    it('should switch to dark theme', () => {
+      applyUiThemeMode('dark');
+
+      expect(uiTheme.bg).toBe('#09090b');
+      expect(uiTheme.surface).toBe('#18181b');
+      expect(uiTheme.text).toBe('#fafafa');
+      expect(uiTheme.accent).toBe('#8e51ff');
+    });
+
+    it('should switch to light theme', () => {
+      applyUiThemeMode('light');
+
+      expect(uiTheme.bg).toBe('#ffffff');
+      expect(uiTheme.surface).toBe('#ffffff');
+      expect(uiTheme.text).toBe('#09090b');
+      expect(uiTheme.accent).toBe('#7f22fe');
+    });
+
+    it('should create independent theme objects', () => {
+      // 应用暗色主题
+      applyUiThemeMode('dark');
+      const darkThemeRef = uiTheme;
+
+      // 应用亮色主题
+      applyUiThemeMode('light');
+      const lightThemeRef = uiTheme;
+
+      // 两个引用应该不同
+      expect(darkThemeRef).not.toBe(lightThemeRef);
+
+      // 颜色值应该不同
+      expect(darkThemeRef.bg).not.toBe(lightThemeRef.bg);
+      expect(darkThemeRef.text).not.toBe(lightThemeRef.text);
+      expect(darkThemeRef.accent).not.toBe(lightThemeRef.accent);
+    });
+
+    it('should clone layout and typography objects', () => {
+      // 应用暗色主题
+      applyUiThemeMode('dark');
+      const darkThemeLayout = uiTheme.layout;
+      const darkThemeTypography = uiTheme.typography;
+
+      // 应用亮色主题
+      applyUiThemeMode('light');
+      const lightThemeLayout = uiTheme.layout;
+      const lightThemeTypography = uiTheme.typography;
+
+      // layout和typography对象应该是独立的副本
+      expect(darkThemeLayout).not.toBe(lightThemeLayout);
+      expect(darkThemeTypography).not.toBe(lightThemeTypography);
+
+      // 但它们的值应该相同（因为两个主题共享相同的布局和排版）
+      expect(darkThemeLayout.appPaddingTop).toBe(lightThemeLayout.appPaddingTop);
+      expect(darkThemeLayout.appPaddingBottom).toBe(lightThemeLayout.appPaddingBottom);
+      expect(darkThemeTypography.body).toBe(lightThemeTypography.body);
+      expect(darkThemeTypography.code).toBe(lightThemeTypography.code);
+    });
+
+    it('should handle invalid mode by defaulting to dark', () => {
+      // 先设置为亮色主题
+      applyUiThemeMode('light');
+      expect(uiTheme.bg).toBe('#ffffff');
+
+      // 使用无效模式（TypeScript会阻止，但JavaScript可能允许）
+      // 这里测试默认行为
+      applyUiThemeMode('dark' as any); // 强制为暗色
+      expect(uiTheme.bg).toBe('#09090b');
+    });
+  });
+});

package/src/ui/theme.ts

@@ -0,0 +1,152 @@
+import { TextAttributes, rgbToHex } from '@opentui/core';
+
+import { resolveOpenCodeTheme, type OpenCodeThemeMode } from './open-code-theme';
+
+export type UiThemeMode = OpenCodeThemeMode;
+type TextAttributeValue = (typeof TextAttributes)[keyof typeof TextAttributes];
+
+export type UiTheme = {
+  bg: string;
+  surface: string;
+  panel: string;
+  text: string;
+  muted: string;
+  subtle: string;
+  accent: string;
+  thinking: string;
+  divider: string;
+  userPromptBg: string;
+  userPromptText: string;
+  inputBg: string;
+  inputCursor: string;
+  inputSelectionBg: string;
+  inputSelectionText: string;
+  codeBlock: {
+    bg: string;
+    border: string;
+    header: string;
+    language: string;
+    text: string;
+    selectionBg: string;
+    selectionText: string;
+  };
+  diff: {
+    lineNumberFg: string;
+    lineNumberBg: string;
+    addedBg: string;
+    removedBg: string;
+    contextBg: string;
+    addedContentBg: string;
+    removedContentBg: string;
+    contextContentBg: string;
+    addedSign: string;
+    removedSign: string;
+    addedLineNumberBg: string;
+    removedLineNumberBg: string;
+  };
+  layout: {
+    appPaddingTop: number;
+    appPaddingBottom: number;
+    appPaddingX: number;
+    conversationPaddingX: number;
+    conversationPaddingY: number;
+    conversationContentPaddingX: number;
+    conversationContentPaddingY: number;
+    promptPaddingX: number;
+    promptPaddingBottom: number;
+    footerMarginTop: number;
+    footerPaddingRight: number;
+  };
+  typography: {
+    body: TextAttributeValue;
+    code: TextAttributeValue;
+    muted: TextAttributeValue;
+    note: TextAttributeValue;
+    heading: TextAttributeValue;
+  };
+};
+
+const baseLayout: UiTheme['layout'] = {
+  appPaddingTop: 0,
+  appPaddingBottom: 1,
+  appPaddingX: 0,
+  conversationPaddingX: 0,
+  conversationPaddingY: 0,
+  conversationContentPaddingX: 2,
+  conversationContentPaddingY: 1,
+  promptPaddingX: 0,
+  promptPaddingBottom: 1,
+  footerMarginTop: 1,
+  footerPaddingRight: 0,
+};
+
+const baseTypography: UiTheme['typography'] = {
+  body: TextAttributes.BOLD,
+  code: TextAttributes.BOLD,
+  muted: TextAttributes.BOLD,
+  note: TextAttributes.NONE,
+  heading: TextAttributes.BOLD,
+};
+
+const toHex = (value: Parameters<typeof rgbToHex>[0]) => rgbToHex(value).toLowerCase();
+
+const createTheme = (mode: UiThemeMode, platform: NodeJS.Platform): UiTheme => {
+  const theme = resolveOpenCodeTheme(mode, platform);
+
+  return {
+    bg: toHex(theme.background),
+    surface: toHex(theme.backgroundPanel),
+    panel: toHex(theme.backgroundPanel),
+    text: toHex(theme.text),
+    muted: toHex(theme.textMuted),
+    subtle: toHex(theme.textMuted),
+    accent: toHex(theme.primary),
+    thinking: toHex(theme.textMuted),
+    divider: toHex(theme.borderSubtle),
+    userPromptBg: toHex(theme.backgroundElement),
+    userPromptText: toHex(theme.text),
+    inputBg: mode === 'light' ? '#e4e4e7' : '#27272a',
+    inputCursor: toHex(theme.primary),
+    inputSelectionBg: toHex(theme.borderActive),
+    inputSelectionText: toHex(theme.text),
+    codeBlock: {
+      bg: toHex(theme.backgroundElement),
+      border: toHex(theme.border),
+      header: toHex(theme.textMuted),
+      language: toHex(theme.accent),
+      text: toHex(theme.text),
+      selectionBg: toHex(theme.borderActive),
+      selectionText: toHex(theme.text),
+    },
+    diff: {
+      lineNumberFg: toHex(theme.diffLineNumber),
+      lineNumberBg: toHex(theme.backgroundElement),
+      addedBg: toHex(theme.diffAddedBg),
+      removedBg: toHex(theme.diffRemovedBg),
+      contextBg: toHex(theme.diffContextBg),
+      addedContentBg: toHex(theme.diffAddedBg),
+      removedContentBg: toHex(theme.diffRemovedBg),
+      contextContentBg: toHex(theme.diffContextBg),
+      addedSign: toHex(theme.diffAdded),
+      removedSign: toHex(theme.diffRemoved),
+      addedLineNumberBg: toHex(theme.diffAddedLineNumberBg),
+      removedLineNumberBg: toHex(theme.diffRemovedLineNumberBg),
+    },
+    layout: baseLayout,
+    typography: baseTypography,
+  };
+};
+
+const cloneTheme = (theme: UiTheme): UiTheme => ({
+  ...theme,
+  codeBlock: { ...theme.codeBlock },
+  diff: { ...theme.diff },
+  layout: { ...theme.layout },
+  typography: { ...theme.typography },
+});
+
+export let uiTheme: UiTheme = cloneTheme(createTheme('dark', process.platform));
+
+export const applyUiThemeMode = (mode: UiThemeMode) => {
+  uiTheme = cloneTheme(createTheme(mode, process.platform));
+};

package/src/utils/time.test.ts

@@ -0,0 +1,144 @@
+import { describe, expect, it } from 'vitest';
+
+import { createTimeLabel } from './time';
+
+class MockDate extends Date {
+  constructor(private readonly value: Date) {
+    super(value.getTime());
+  }
+
+  override toLocaleTimeString(
+    locales?: Intl.LocalesArgument,
+    options?: Intl.DateTimeFormatOptions
+  ): string {
+    return this.value.toLocaleTimeString(locales, options);
+  }
+}
+
+describe('createTimeLabel', () => {
+  it('should return time in HH:MM:SS format', () => {
+    // 模拟一个固定的日期来测试格式
+    const mockDate = new Date('2024-01-15T14:30:45Z');
+    const originalDate = global.Date;
+
+    // 临时替换Date构造函数
+    global.Date = class extends originalDate {
+      constructor() {
+        super();
+        return new MockDate(mockDate);
+      }
+
+      static override now() {
+        return mockDate.getTime();
+      }
+    } as unknown as DateConstructor;
+
+    try {
+      const timeLabel = createTimeLabel();
+      // 24小时格式，前导零
+      expect(timeLabel).toBe('14:30:45');
+    } finally {
+      // 恢复原始的Date
+      global.Date = originalDate;
+    }
+  });
+
+  it('should use 24-hour format', () => {
+    // 测试下午时间
+    const mockDate = new Date('2024-01-15T22:15:30Z');
+    const originalDate = global.Date;
+
+    global.Date = class extends originalDate {
+      constructor() {
+        super();
+        return new MockDate(mockDate);
+      }
+
+      static override now() {
+        return mockDate.getTime();
+      }
+    } as unknown as DateConstructor;
+
+    try {
+      const timeLabel = createTimeLabel();
+      // 应该是22:15:30，不是10:15:30 PM
+      expect(timeLabel).toBe('22:15:30');
+    } finally {
+      global.Date = originalDate;
+    }
+  });
+
+  it('should pad single-digit hours, minutes, and seconds', () => {
+    // 测试单数字时间
+    const mockDate = new Date('2024-01-15T09:05:07Z');
+    const originalDate = global.Date;
+
+    global.Date = class extends originalDate {
+      constructor() {
+        super();
+        return new MockDate(mockDate);
+      }
+
+      static override now() {
+        return mockDate.getTime();
+      }
+    } as unknown as DateConstructor;
+
+    try {
+      const timeLabel = createTimeLabel();
+      // 应该是09:05:07，不是9:5:7
+      expect(timeLabel).toBe('09:05:07');
+    } finally {
+      global.Date = originalDate;
+    }
+  });
+
+  it('should use en-US locale', () => {
+    // 保存原始locale
+    const originalToLocaleTimeString = Date.prototype.toLocaleTimeString;
+
+    let calledWithLocale = '';
+    Date.prototype.toLocaleTimeString = function (
+      locales?: Intl.LocalesArgument,
+      options?: Intl.DateTimeFormatOptions
+    ): string {
+      calledWithLocale = Array.isArray(locales) ? (locales[0] ?? '') : (locales ?? '');
+      return originalToLocaleTimeString.call(this, locales, options);
+    };
+
+    try {
+      createTimeLabel();
+      expect(calledWithLocale).toBe('en-US');
+    } finally {
+      // 恢复原始方法
+      Date.prototype.toLocaleTimeString = originalToLocaleTimeString;
+    }
+  });
+
+  it('should use correct options', () => {
+    // 保存原始方法
+    const originalToLocaleTimeString = Date.prototype.toLocaleTimeString;
+
+    let calledWithOptions: Intl.DateTimeFormatOptions = {};
+    Date.prototype.toLocaleTimeString = function (
+      _locales?: Intl.LocalesArgument,
+      options?: Intl.DateTimeFormatOptions
+    ): string {
+      calledWithOptions = options ?? {};
+      return '00:00:00'; // 返回模拟值
+    };
+
+    try {
+      createTimeLabel();
+      expect(calledWithOptions).toEqual({
+        hour: '2-digit',
+        minute: '2-digit',
+        second: '2-digit',
+        hour12: false,
+      });
+    } finally {
+      // 恢复原始方法
+      Date.prototype.toLocaleTimeString = originalToLocaleTimeString;
+    }
+  });
+});

package/src/utils/time.ts

@@ -0,0 +1,7 @@
+export const createTimeLabel = () =>
+  new Date().toLocaleTimeString('en-US', {
+    hour: '2-digit',
+    minute: '2-digit',
+    second: '2-digit',
+    hour12: false,
+  });

package/tsconfig.json

@@ -0,0 +1,30 @@
+{
+  "compilerOptions": {
+    // Environment setup & latest features
+    "lib": ["ESNext"],
+    "target": "ESNext",
+    "module": "Preserve",
+    "moduleDetection": "force",
+    "jsx": "react-jsx",
+    "jsxImportSource": "@opentui/react",
+    "allowJs": true,
+
+    // Bundler mode
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "verbatimModuleSyntax": true,
+    "noEmit": true,
+
+    // Best practices
+    "strict": true,
+    "skipLibCheck": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedIndexedAccess": true,
+    "noImplicitOverride": true,
+
+    // Some stricter flags (disabled by default)
+    "noUnusedLocals": false,
+    "noUnusedParameters": false,
+    "noPropertyAccessFromIndexSignature": false
+  }
+}

package/LICENSE

@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2026 coding-agent-v2 contributors
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.

package/dist/App.d.ts

@@ -1,2 +0,0 @@
-export declare const App: () => import("react").ReactNode;
-//# sourceMappingURL=App.d.ts.map

package/dist/App.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"App.d.ts","sourceRoot":"","sources":["../src/App.tsx"],"names":[],"mappings":"AAuCA,eAAO,MAAM,GAAG,iCAiQf,CAAC"}