@renxqoo/renx-code 0.0.8 → 0.0.10

package/src/components/chat/code-block.test.tsx

@@ -1,206 +0,0 @@
-import { describe, expect, it } from 'vitest';
-
-import {
-  CodeBlock,
-  extractDiffPath,
-  inferCodeFiletype,
-  inferFiletypeFromPath,
-  looksLikeDiff,
-} from './code-block';
-
-type ElementLike = {
-  type: unknown;
-  props?: {
-    children?: unknown;
-    [key: string]: unknown;
-  };
-};
-
-const isElementLike = (value: unknown): value is ElementLike => {
-  return (
-    Boolean(value) && typeof value === 'object' && 'type' in (value as Record<string, unknown>)
-  );
-};
-
-const findElementByType = (node: unknown, targetType: string): ElementLike | null => {
-  if (!node) {
-    return null;
-  }
-
-  if (Array.isArray(node)) {
-    for (const child of node) {
-      const match = findElementByType(child, targetType);
-      if (match) {
-        return match;
-      }
-    }
-    return null;
-  }
-
-  if (!isElementLike(node)) {
-    return null;
-  }
-
-  if (typeof node.type === 'function') {
-    return findElementByType(
-      (node.type as (props: object) => unknown)(node.props ?? {}),
-      targetType
-    );
-  }
-
-  if (node.type === targetType) {
-    return node;
-  }
-
-  return findElementByType(node.props?.children, targetType);
-};
-
-describe('CodeBlock', () => {
-  it('detects unified diff content and extracts the changed path', () => {
-    const diff = [
-      'diff --git a/src/App.tsx b/src/App.tsx',
-      '--- a/src/App.tsx',
-      '+++ b/src/App.tsx',
-      '@@ -1,2 +1,2 @@',
-      '-const before = true;',
-      '+const after = true;',
-    ].join('\n');
-
-    expect(looksLikeDiff(diff)).toBe(true);
-    expect(extractDiffPath(diff)).toBe('src/App.tsx');
-    expect(inferCodeFiletype(diff)).toBe('diff');
-    expect(inferFiletypeFromPath('src/App.tsx')).toBe('tsx');
-  });
-
-  it('infers json and bash snippets without explicit metadata', () => {
-    expect(inferCodeFiletype('{\n  "name": "demo"\n}')).toBe('json');
-    expect(inferCodeFiletype('$ pnpm test\n$ pnpm lint')).toBe('bash');
-  });
-
-  it('renders diff snippets with the OpenTUI diff component', () => {
-    const tree = CodeBlock({
-      label: 'output',
-      content: ['--- a/a.ts', '+++ b/a.ts', '@@ -1 +1 @@', '-a', '+b'].join('\n'),
-    });
-
-    const diffNode = findElementByType(tree, 'diff');
-
-    expect(diffNode).not.toBeNull();
-    expect(diffNode?.props?.view).toBe('unified');
-    expect(diffNode?.props?.showLineNumbers).toBe(true);
-  });
-
-  it('falls back to code preview when a diff block is collapsed', () => {
-    const content = [
-      'diff --git a/src/a.ts b/src/a.ts',
-      '--- a/src/a.ts',
-      '+++ b/src/a.ts',
-      '@@ -1,2 +1,22 @@',
-      '-const oldValue = 1;',
-      '+const newValue = 1;',
-      ...Array.from({ length: 20 }, (_, index) => `+const line${index + 1} = ${index + 1};`),
-    ].join('\n');
-
-    const tree = CodeBlock({
-      label: 'output',
-      content,
-      collapsible: true,
-      expanded: false,
-    });
-
-    expect(findElementByType(tree, 'diff')).toBeNull();
-    expect(findElementByType(tree, 'code')).not.toBeNull();
-  });
-
-  it('renders diff component when a collapsed diff block is expanded', () => {
-    const content = [
-      'diff --git a/src/a.ts b/src/a.ts',
-      '--- a/src/a.ts',
-      '+++ b/src/a.ts',
-      '@@ -1,2 +1,22 @@',
-      '-const oldValue = 1;',
-      '+const newValue = 1;',
-      ...Array.from({ length: 20 }, (_, index) => `+const line${index + 1} = ${index + 1};`),
-    ].join('\n');
-
-    const tree = CodeBlock({
-      label: 'output',
-      content,
-      collapsible: true,
-      expanded: true,
-    });
-
-    expect(findElementByType(tree, 'diff')).not.toBeNull();
-  });
-
-  it('renders regular snippets with the OpenTUI code component', () => {
-    const tree = CodeBlock({
-      label: 'arguments',
-      content: '{\n  "timeout": 1000\n}',
-      languageHint: 'json',
-    });
-
-    const codeNode = findElementByType(tree, 'code');
-
-    expect(codeNode).not.toBeNull();
-    expect(codeNode?.props?.filetype).toBe('json');
-  });
-
-  it('collapses long output to 16 lines by default when enabled', () => {
-    const content = Array.from({ length: 20 }, (_, index) => `line ${index + 1}`).join('\n');
-    const expected = `${Array.from({ length: 16 }, (_, index) => `line ${index + 1}`).join('\n')}\n`;
-
-    const tree = CodeBlock({
-      label: 'output',
-      content,
-      collapsible: true,
-      expanded: false,
-    });
-
-    const codeNode = findElementByType(tree, 'code');
-
-    expect(codeNode).not.toBeNull();
-    expect(codeNode?.props?.content).toBe(expected);
-  });
-
-  it('shows full output when expanded is true', () => {
-    const content = Array.from({ length: 20 }, (_, index) => `line ${index + 1}`).join('\n');
-    const expected = content;
-
-    const tree = CodeBlock({
-      label: 'output',
-      content,
-      collapsible: true,
-      expanded: true,
-    });
-
-    const codeNode = findElementByType(tree, 'code');
-
-    expect(codeNode).not.toBeNull();
-    expect(codeNode?.props?.content).toBe(expected);
-  });
-
-  it('does not treat diagnostic text followed by a diff as a diff block', () => {
-    const content = [
-      "Error parsing diff: Hunk at line 5 contained invalid line Line 2');",
-      'Index: /tmp/task-errors.test.ts',
-      '===================================================================',
-      '--- /tmp/task-errors.test.ts original',
-      '+++ /tmp/task-errors.test.ts modified',
-      '@@ -1 +1 @@',
-      '-a',
-      '+b',
-    ].join('\n');
-
-    expect(looksLikeDiff(content)).toBe(false);
-    expect(inferCodeFiletype(content)).toBeUndefined();
-
-    const tree = CodeBlock({
-      label: 'output',
-      content,
-    });
-
-    expect(findElementByType(tree, 'diff')).toBeNull();
-    expect(findElementByType(tree, 'code')).not.toBeNull();
-  });
-});

package/src/components/chat/code-block.tsx

@@ -1,313 +0,0 @@
-import { opencodeMarkdownSyntax } from '../../ui/opencode-markdown';
-import { uiTheme } from '../../ui/theme';
-
-type CodeBlockProps = {
-  content: string;
-  label?: string;
-  languageHint?: string;
-  collapsible?: boolean;
-  collapsedLines?: number;
-  expanded?: boolean;
-  onToggleExpanded?: () => void;
-};
-
-const FILETYPE_BY_EXTENSION: Record<string, string> = {
-  bash: 'bash',
-  cjs: 'javascript',
-  css: 'css',
-  html: 'html',
-  java: 'java',
-  js: 'javascript',
-  json: 'json',
-  jsx: 'tsx',
-  md: 'markdown',
-  mjs: 'javascript',
-  py: 'python',
-  sh: 'bash',
-  sql: 'sql',
-  ts: 'typescript',
-  tsx: 'tsx',
-  txt: 'text',
-  xml: 'xml',
-  yaml: 'yaml',
-  yml: 'yaml',
-  zsh: 'bash',
-};
-
-const DIFF_HEADER_PATTERNS = [/^diff --git /m, /^Index:\s+/m, /^@@ /m];
-
-const normalizeHint = (value?: string): string | undefined => {
-  const normalized = value?.trim().toLowerCase();
-  if (!normalized || normalized === 'auto') {
-    return undefined;
-  }
-  if (normalized === 'sh' || normalized === 'shell' || normalized === 'zsh') {
-    return 'bash';
-  }
-  if (normalized === 'js') {
-    return 'javascript';
-  }
-  if (normalized === 'ts') {
-    return 'typescript';
-  }
-  return normalized;
-};
-
-export const looksLikeDiff = (value: string): boolean => {
-  const normalized = value.trim();
-  if (!normalized) {
-    return false;
-  }
-
-  const firstLine = normalized.split('\n', 1)[0]?.trim();
-  if (
-    !firstLine ||
-    !(
-      firstLine.startsWith('diff --git ') ||
-      firstLine.startsWith('Index: ') ||
-      firstLine.startsWith('--- ') ||
-      firstLine.startsWith('@@ ')
-    )
-  ) {
-    return false;
-  }
-
-  if (DIFF_HEADER_PATTERNS.some(pattern => pattern.test(normalized))) {
-    return (
-      /^@@ /m.test(normalized) ||
-      (/^--- /m.test(normalized) && /^\+\+\+ /m.test(normalized)) ||
-      /^diff --git /m.test(normalized)
-    );
-  }
-
-  return false;
-};
-
-export const inferFiletypeFromPath = (value?: string): string | undefined => {
-  if (!value) {
-    return undefined;
-  }
-
-  const fileName = value.split('/').pop();
-  if (!fileName || !fileName.includes('.')) {
-    return undefined;
-  }
-
-  const extension = fileName.split('.').pop()?.toLowerCase();
-  if (!extension) {
-    return undefined;
-  }
-
-  return FILETYPE_BY_EXTENSION[extension];
-};
-
-export const extractDiffPath = (value: string): string | undefined => {
-  const lines = value.split('\n');
-  for (const line of lines) {
-    if (line.startsWith('Index: ')) {
-      return line.slice('Index: '.length).trim();
-    }
-    if (line.startsWith('diff --git ')) {
-      const match = line.match(/^diff --git a\/(.+?) b\/(.+)$/);
-      if (match?.[2]) {
-        return match[2];
-      }
-    }
-    if (line.startsWith('+++ ')) {
-      const path = line.slice(4).trim();
-      if (path && path !== '/dev/null') {
-        return path.replace(/^b\//, '');
-      }
-    }
-  }
-
-  return undefined;
-};
-
-const looksLikeJson = (value: string): boolean => {
-  const normalized = value.trim();
-  if (!normalized || !['{', '['].includes(normalized[0] ?? '')) {
-    return false;
-  }
-
-  try {
-    JSON.parse(normalized);
-    return true;
-  } catch {
-    return false;
-  }
-};
-
-export const inferCodeFiletype = (value: string, languageHint?: string): string | undefined => {
-  const hint = normalizeHint(languageHint);
-  if (hint) {
-    return hint;
-  }
-
-  if (looksLikeDiff(value)) {
-    return 'diff';
-  }
-
-  const normalized = value.trim();
-  if (!normalized) {
-    return undefined;
-  }
-
-  if (looksLikeJson(normalized)) {
-    return 'json';
-  }
-
-  if (
-    normalized.startsWith('#!/bin/bash') ||
-    normalized.startsWith('#!/usr/bin/env bash') ||
-    normalized.startsWith('#!/bin/sh') ||
-    normalized.startsWith('#!/usr/bin/env zsh')
-  ) {
-    return 'bash';
-  }
-
-  const meaningfulLines = normalized
-    .split('\n')
-    .map(line => line.trim())
-    .filter(Boolean);
-  if (meaningfulLines.length > 0 && meaningfulLines.every(line => line.startsWith('$ '))) {
-    return 'bash';
-  }
-
-  return undefined;
-};
-
-const buildHeaderMeta = (content: string, filetype?: string): string | undefined => {
-  if (filetype === 'diff') {
-    return extractDiffPath(content) ?? 'unified';
-  }
-
-  if (!filetype || filetype === 'text') {
-    return undefined;
-  }
-
-  return filetype;
-};
-
-const DEFAULT_COLLAPSED_LINES = 16;
-
-const toContentLines = (value: string): string[] => {
-  if (!value) {
-    return [];
-  }
-
-  const trimmed = value.replace(/\n+$/, '');
-  if (!trimmed) {
-    return [];
-  }
-
-  return trimmed.split('\n');
-};
-
-const buildCollapsedContent = (
-  content: string,
-  lineLimit: number
-): { content: string; hiddenLines: number } => {
-  const lines = toContentLines(content);
-  if (lineLimit <= 0 || lines.length <= lineLimit) {
-    return {
-      content,
-      hiddenLines: 0,
-    };
-  }
-
-  return {
-    content: `${lines.slice(0, lineLimit).join('\n')}\n`,
-    hiddenLines: lines.length - lineLimit,
-  };
-};
-
-export const CodeBlock = ({
-  content,
-  label,
-  languageHint,
-  collapsible = false,
-  collapsedLines = DEFAULT_COLLAPSED_LINES,
-  expanded = false,
-  onToggleExpanded,
-}: CodeBlockProps) => {
-  const normalized = content.replace(/\n+$/, '\n');
-  const collapsed = buildCollapsedContent(normalized, collapsedLines);
-  const isTruncated = collapsible && collapsed.hiddenLines > 0;
-  const renderedContent = isTruncated && !expanded ? collapsed.content : normalized;
-  const filetype = inferCodeFiletype(normalized, languageHint);
-  const isDiff = filetype === 'diff';
-  const shouldRenderDiff = isDiff && (!isTruncated || expanded);
-  const codeFiletype = isDiff ? 'diff' : filetype;
-  const diffFiletype = isDiff ? inferFiletypeFromPath(extractDiffPath(normalized)) : undefined;
-  const headerLabel = label ?? 'code';
-  const headerMeta = buildHeaderMeta(normalized, filetype);
-  const toggleHint = expanded
-    ? 'show less (click to collapse)'
-    : `... hidden ${collapsed.hiddenLines} lines (click to expand)`;
-  const clickHandler = isTruncated ? onToggleExpanded : undefined;
-
-  return (
-    <box
-      flexDirection="column"
-      // backgroundColor={uiTheme.codeBlock.bg}
-      paddingLeft={1}
-      paddingRight={1}
-      paddingTop={1}
-      paddingBottom={1}
-    >
-      <text fg={uiTheme.codeBlock.header} attributes={uiTheme.typography.note}>
-        {headerLabel}
-        {headerMeta ? <span fg={uiTheme.codeBlock.language}> · {headerMeta}</span> : null}
-      </text>
-      <box marginTop={1} onMouseUp={clickHandler}>
-        {shouldRenderDiff ? (
-          <diff
-            diff={renderedContent}
-            view="unified"
-            filetype={diffFiletype}
-            fg={uiTheme.codeBlock.text}
-            syntaxStyle={opencodeMarkdownSyntax}
-            wrapMode="char"
-            conceal={true}
-            showLineNumbers={true}
-            selectionBg={uiTheme.codeBlock.selectionBg}
-            selectionFg={uiTheme.codeBlock.selectionText}
-            lineNumberFg={uiTheme.diff.lineNumberFg}
-            lineNumberBg={uiTheme.diff.lineNumberBg}
-            addedBg={uiTheme.diff.addedBg}
-            removedBg={uiTheme.diff.removedBg}
-            contextBg={uiTheme.diff.contextBg}
-            addedContentBg={uiTheme.diff.addedContentBg}
-            removedContentBg={uiTheme.diff.removedContentBg}
-            contextContentBg={uiTheme.diff.contextContentBg}
-            addedSignColor={uiTheme.diff.addedSign}
-            removedSignColor={uiTheme.diff.removedSign}
-            addedLineNumberBg={uiTheme.diff.addedLineNumberBg}
-            removedLineNumberBg={uiTheme.diff.removedLineNumberBg}
-          />
-        ) : (
-          <code
-            content={renderedContent}
-            filetype={codeFiletype}
-            fg={uiTheme.codeBlock.text}
-            syntaxStyle={opencodeMarkdownSyntax}
-            wrapMode="char"
-            conceal={true}
-            drawUnstyledText={true}
-            selectable={true}
-            selectionBg={uiTheme.codeBlock.selectionBg}
-            selectionFg={uiTheme.codeBlock.selectionText}
-          />
-        )}
-      </box>
-      {isTruncated ? (
-        <box marginTop={1} onMouseUp={clickHandler}>
-          <text fg={uiTheme.muted} attributes={uiTheme.typography.note}>
-            {toggleHint}
-          </text>
-        </box>
-      ) : null}
-    </box>
-  );
-};

package/src/components/chat/prompt-card.tsx

@@ -1,81 +0,0 @@
-import {
-  isAudioSelection,
-  isImageSelection,
-  isVideoSelection,
-} from '../../files/attachment-capabilities';
-import { uiTheme } from '../../ui/theme';
-
-type PromptCardProps = {
-  prompt: string;
-  files?: string[];
-  createdAtMs: number;
-  isFirst?: boolean;
-};
-
-const formatTime = (timestamp: number) => {
-  return new Date(timestamp).toLocaleTimeString('en-US', {
-    hour: '2-digit',
-    minute: '2-digit',
-    second: '2-digit',
-    hour12: false,
-  });
-};
-
-export const PromptCard = ({
-  prompt,
-  files = [],
-  createdAtMs,
-  isFirst = false,
-}: PromptCardProps) => {
-  const mediaFiles = files.filter(
-    file =>
-      isImageSelection({ relativePath: file, absolutePath: file, size: 0 }) ||
-      isAudioSelection({ relativePath: file, absolutePath: file, size: 0 }) ||
-      isVideoSelection({ relativePath: file, absolutePath: file, size: 0 })
-  );
-
-  return (
-    <box flexDirection="row" marginTop={isFirst ? 0 : 1} marginBottom={1}>
-      <box width={0.5} backgroundColor={uiTheme.accent} />
-      <box
-        flexGrow={1}
-        backgroundColor={uiTheme.userPromptBg}
-        paddingLeft={2}
-        paddingRight={1}
-        paddingTop={1}
-        paddingBottom={1}
-      >
-        <text
-          fg={uiTheme.userPromptText}
-          attributes={uiTheme.typography.heading}
-          wrapMode="word"
-          selectable={true}
-        >
-          {prompt}
-        </text>
-        {mediaFiles.length > 0 ? (
-          <box paddingTop={1} flexDirection="column">
-            <text fg={uiTheme.muted} attributes={uiTheme.typography.note}>
-              Media files
-            </text>
-            {mediaFiles.map(file => (
-              <text
-                key={file}
-                fg={uiTheme.text}
-                attributes={uiTheme.typography.note}
-                selectable={true}
-              >
-                {file}
-              </text>
-            ))}
-          </box>
-        ) : null}
-        <box paddingTop={1}>
-          <text fg={uiTheme.muted} attributes={uiTheme.typography.note} selectable={true}>
-            {formatTime(createdAtMs)}
-          </text>
-        </box>
-      </box>
-    </box>
-  );
-};

package/src/components/chat/segment-groups.test.ts

@@ -1,52 +0,0 @@
-import { describe, expect, it } from 'vitest';
-
-import type { ReplySegment } from '../../types/chat';
-import { buildReplyRenderItems } from './segment-groups';
-
-describe('buildReplyRenderItems', () => {
-  it('groups tool segments by call id and keeps non-tool segments in place', () => {
-    const segments: ReplySegment[] = [
-      { id: '1:thinking:1', type: 'thinking', content: 'thinking' },
-      {
-        id: '1:tool-use:call_a',
-        type: 'code',
-        content: '# Tool: bash (call_a)\n$ echo a\n',
-        data: { id: 'call_a', function: { name: 'bash', arguments: '{"command":"echo a"}' } },
-      },
-      { id: '1:tool:call_a:stdout', type: 'code', content: 'a\n' },
-      {
-        id: '1:tool-result:call_a',
-        type: 'code',
-        content: '# Result: bash (call_a) success\na\n',
-        data: { result: { success: true, data: { output: 'a' } } },
-      },
-      { id: '1:text:2', type: 'text', content: 'done' },
-    ];
-
-    const items = buildReplyRenderItems(segments);
-    expect(items.map(item => item.type)).toEqual(['segment', 'tool', 'segment']);
-    expect(items[1]?.type === 'tool' ? items[1].group.toolCallId : '').toBe('call_a');
-    expect(items[1]?.type === 'tool' ? items[1].group.streams.length : 0).toBe(1);
-    expect(items[1]?.type === 'tool' ? items[1].group.use?.data : undefined).toEqual({
-      id: 'call_a',
-      function: { name: 'bash', arguments: '{"command":"echo a"}' },
-    });
-    expect(items[1]?.type === 'tool' ? items[1].group.result?.data : undefined).toEqual({
-      result: { success: true, data: { output: 'a' } },
-    });
-  });
-
-  it('starts a new tool group when call id changes', () => {
-    const segments: ReplySegment[] = [
-      { id: '1:tool-use:call_a', type: 'code', content: '# Tool: bash (call_a)\n$ echo a\n' },
-      { id: '1:tool-result:call_a', type: 'code', content: '# Result: bash (call_a) success\na\n' },
-      { id: '1:tool-use:call_b', type: 'code', content: '# Tool: bash (call_b)\n$ echo b\n' },
-      { id: '1:tool-result:call_b', type: 'code', content: '# Result: bash (call_b) success\nb\n' },
-    ];
-
-    const items = buildReplyRenderItems(segments);
-    expect(items.length).toBe(2);
-    expect(items[0]?.type === 'tool' ? items[0].group.toolCallId : '').toBe('call_a');
-    expect(items[1]?.type === 'tool' ? items[1].group.toolCallId : '').toBe('call_b');
-  });
-});