getcompanion-ai/co-mono
1
0
Fork 0
mirror of https://github.com/getcompanion-ai/co-mono.git synced 2026-04-15 21:03:19 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat(tui, coding-agent): add configurable code block indent setting (#855)

Browse source 
Add markdown.codeBlockIndent setting to customize indentation prefix for
rendered code blocks. Default remains 2 spaces for visual clarity, but
setting to empty string removes indentation for easier copy/paste of
code snippets to scripts, editors, or other tools.

Changes:
- tui: add optional codeBlockIndent to MarkdownTheme interface
- coding-agent: add MarkdownSettings with codeBlockIndent property
- coding-agent: compose theme with settings at call sites (no global state)
- coding-agent: update message components to accept optional MarkdownTheme

Co-authored-by: Mario Zechner <badlogicgames@gmail.com>
This commit is contained in:
Michael Renner 2026-01-19 22:36:03 +01:00 • committed by GitHub
parent 46545276e3
commit 20c7b5fed4
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
11 changed files with 85 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

9
packages/coding-agent/src/core/settings-manager.ts
View file

@ -47,6 +47,10 @@ export interface ThinkingBudgetsSettings {
high?: number;
}
export interface MarkdownSettings {
codeBlockIndent?: string; // default: " "
}
export interface Settings {
lastChangelogVersion?: string;
defaultProvider?: string;
@ -72,6 +76,7 @@ export interface Settings {
thinkingBudgets?: ThinkingBudgetsSettings; // Custom token budgets for thinking levels
editorPaddingX?: number; // Horizontal padding for input editor (default: 0)
showHardwareCursor?: boolean; // Show terminal cursor while still positioning it for IME
markdown?: MarkdownSettings;
}
/** Deep merge settings: project/overrides take precedence, nested objects merge recursively */
@ -500,4 +505,8 @@ export class SettingsManager {
this.globalSettings.editorPaddingX = Math.max(0, Math.min(3, Math.floor(padding)));
this.save();
}
getCodeBlockIndent(): string {
return this.settings.markdown?.codeBlockIndent ?? " ";
}
}

14
packages/coding-agent/src/modes/interactive/components/assistant-message.ts
View file

@ -1,5 +1,5 @@
import type { AssistantMessage } from "@mariozechner/pi-ai";
import { Container, Markdown, Spacer, Text } from "@mariozechner/pi-tui";
import { Container, Markdown, type MarkdownTheme, Spacer, Text } from "@mariozechner/pi-tui";
import { getMarkdownTheme, theme } from "../theme/theme.js";
/**
@ -8,12 +8,18 @@ import { getMarkdownTheme, theme } from "../theme/theme.js";
export class AssistantMessageComponent extends Container {
private contentContainer: Container;
private hideThinkingBlock: boolean;
private markdownTheme: MarkdownTheme;
private lastMessage?: AssistantMessage;
constructor(message?: AssistantMessage, hideThinkingBlock = false) {
constructor(
message?: AssistantMessage,
hideThinkingBlock = false,
markdownTheme: MarkdownTheme = getMarkdownTheme(),
) {
super();
this.hideThinkingBlock = hideThinkingBlock;
this.markdownTheme = markdownTheme;
// Container for text/thinking content
this.contentContainer = new Container();
@ -55,7 +61,7 @@ export class AssistantMessageComponent extends Container {
if (content.type === "text" && content.text.trim()) {
// Assistant text messages with no background - trim the text
// Set paddingY=0 to avoid extra spacing before tool executions
this.contentContainer.addChild(new Markdown(content.text.trim(), 1, 0, getMarkdownTheme()));
this.contentContainer.addChild(new Markdown(content.text.trim(), 1, 0, this.markdownTheme));
} else if (content.type === "thinking" && content.thinking.trim()) {
// Check if there's text content after this thinking block
const hasTextAfter = message.content.slice(i + 1).some((c) => c.type === "text" && c.text.trim());
@ -69,7 +75,7 @@ export class AssistantMessageComponent extends Container {
} else {
// Thinking traces in thinkingText color, italic
this.contentContainer.addChild(
new Markdown(content.thinking.trim(), 1, 0, getMarkdownTheme(), {
new Markdown(content.thinking.trim(), 1, 0, this.markdownTheme, {
color: (text: string) => theme.fg("thinkingText", text),
italic: true,
}),

8
packages/coding-agent/src/modes/interactive/components/branch-summary-message.ts
View file

@ -1,4 +1,4 @@
import { Box, Markdown, Spacer, Text } from "@mariozechner/pi-tui";
import { Box, Markdown, type MarkdownTheme, Spacer, Text } from "@mariozechner/pi-tui";
import type { BranchSummaryMessage } from "../../../core/messages.js";
import { getMarkdownTheme, theme } from "../theme/theme.js";
import { editorKey } from "./keybinding-hints.js";
@ -10,10 +10,12 @@ import { editorKey } from "./keybinding-hints.js";
export class BranchSummaryMessageComponent extends Box {
private expanded = false;
private message: BranchSummaryMessage;
private markdownTheme: MarkdownTheme;
constructor(message: BranchSummaryMessage) {
constructor(message: BranchSummaryMessage, markdownTheme: MarkdownTheme = getMarkdownTheme()) {
super(1, 1, (t) => theme.bg("customMessageBg", t));
this.message = message;
this.markdownTheme = markdownTheme;
this.updateDisplay();
}
@ -37,7 +39,7 @@ export class BranchSummaryMessageComponent extends Box {
if (this.expanded) {
const header = "**Branch Summary**\n\n";
this.addChild(
new Markdown(header + this.message.summary, 0, 0, getMarkdownTheme(), {
new Markdown(header + this.message.summary, 0, 0, this.markdownTheme, {
color: (text: string) => theme.fg("customMessageText", text),
}),
);

8
packages/coding-agent/src/modes/interactive/components/compaction-summary-message.ts
View file

@ -1,4 +1,4 @@
import { Box, Markdown, Spacer, Text } from "@mariozechner/pi-tui";
import { Box, Markdown, type MarkdownTheme, Spacer, Text } from "@mariozechner/pi-tui";
import type { CompactionSummaryMessage } from "../../../core/messages.js";
import { getMarkdownTheme, theme } from "../theme/theme.js";
import { editorKey } from "./keybinding-hints.js";
@ -10,10 +10,12 @@ import { editorKey } from "./keybinding-hints.js";
export class CompactionSummaryMessageComponent extends Box {
private expanded = false;
private message: CompactionSummaryMessage;
private markdownTheme: MarkdownTheme;
constructor(message: CompactionSummaryMessage) {
constructor(message: CompactionSummaryMessage, markdownTheme: MarkdownTheme = getMarkdownTheme()) {
super(1, 1, (t) => theme.bg("customMessageBg", t));
this.message = message;
this.markdownTheme = markdownTheme;
this.updateDisplay();
}
@ -38,7 +40,7 @@ export class CompactionSummaryMessageComponent extends Box {
if (this.expanded) {
const header = `**Compacted from ${tokenStr} tokens**\n\n`;
this.addChild(
new Markdown(header + this.message.summary, 0, 0, getMarkdownTheme(), {
new Markdown(header + this.message.summary, 0, 0, this.markdownTheme, {
color: (text: string) => theme.fg("customMessageText", text),
}),
);

12
packages/coding-agent/src/modes/interactive/components/custom-message.ts
View file

@ -1,6 +1,6 @@
import type { TextContent } from "@mariozechner/pi-ai";
import type { Component } from "@mariozechner/pi-tui";
import { Box, Container, Markdown, Spacer, Text } from "@mariozechner/pi-tui";
import { Box, Container, Markdown, type MarkdownTheme, Spacer, Text } from "@mariozechner/pi-tui";
import type { MessageRenderer } from "../../../core/extensions/types.js";
import type { CustomMessage } from "../../../core/messages.js";
import { getMarkdownTheme, theme } from "../theme/theme.js";
@ -14,12 +14,18 @@ export class CustomMessageComponent extends Container {
private customRenderer?: MessageRenderer;
private box: Box;
private customComponent?: Component;
private markdownTheme: MarkdownTheme;
private _expanded = false;
constructor(message: CustomMessage<unknown>, customRenderer?: MessageRenderer) {
constructor(
message: CustomMessage<unknown>,
customRenderer?: MessageRenderer,
markdownTheme: MarkdownTheme = getMarkdownTheme(),
) {
super();
this.message = message;
this.customRenderer = customRenderer;
this.markdownTheme = markdownTheme;
this.addChild(new Spacer(1));
@ -93,7 +99,7 @@ export class CustomMessageComponent extends Container {
}
this.box.addChild(
new Markdown(text, 0, 0, getMarkdownTheme(), {
new Markdown(text, 0, 0, this.markdownTheme, {
color: (text: string) => theme.fg("customMessageText", text),
}),
);

6
packages/coding-agent/src/modes/interactive/components/user-message.ts
View file

@ -1,15 +1,15 @@
import { Container, Markdown, Spacer } from "@mariozechner/pi-tui";
import { Container, Markdown, type MarkdownTheme, Spacer } from "@mariozechner/pi-tui";
import { getMarkdownTheme, theme } from "../theme/theme.js";
/**
* Component that renders a user message
*/
export class UserMessageComponent extends Container {
constructor(text: string) {
constructor(text: string, markdownTheme: MarkdownTheme = getMarkdownTheme()) {
super();
this.addChild(new Spacer(1));
this.addChild(
new Markdown(text, 1, 1, getMarkdownTheme(), {
new Markdown(text, 1, 1, markdownTheme, {
bgColor: (text: string) => theme.bg("userMessageBg", text),
color: (text: string) => theme.fg("userMessageText", text),
}),

36
packages/coding-agent/src/modes/interactive/interactive-mode.ts
View file

@ -22,6 +22,7 @@ import type {
EditorComponent,
EditorTheme,
KeyId,
MarkdownTheme,
OverlayHandle,
OverlayOptions,
SlashCommand,
@ -410,7 +411,7 @@ export class InteractiveMode {
} else {
this.ui.addChild(new Text(theme.bold(theme.fg("accent", "What's New")), 1, 0));
this.ui.addChild(new Spacer(1));
this.ui.addChild(new Markdown(this.changelogMarkdown.trim(), 1, 0, getMarkdownTheme()));
this.ui.addChild(new Markdown(this.changelogMarkdown.trim(), 1, 0, this.getMarkdownThemeWithSettings()));
this.ui.addChild(new Spacer(1));
}
this.ui.addChild(new DynamicBorder());
@ -585,6 +586,13 @@ export class InteractiveMode {
return undefined;
}
private getMarkdownThemeWithSettings(): MarkdownTheme {
return {
...getMarkdownTheme(),
codeBlockIndent: this.settingsManager.getCodeBlockIndent(),
};
}
// =========================================================================
// Extension System
// =========================================================================
@ -1700,7 +1708,11 @@ export class InteractiveMode {
this.updatePendingMessagesDisplay();
this.ui.requestRender();
} else if (event.message.role === "assistant") {
this.streamingComponent = new AssistantMessageComponent(undefined, this.hideThinkingBlock);
this.streamingComponent = new AssistantMessageComponent(
undefined,
this.hideThinkingBlock,
this.getMarkdownThemeWithSettings(),
);
this.streamingMessage = event.message;
this.chatContainer.addChild(this.streamingComponent);
this.streamingComponent.updateContent(this.streamingMessage);
@ -1991,20 +2003,22 @@ export class InteractiveMode {
case "custom": {
if (message.display) {
const renderer = this.session.extensionRunner?.getMessageRenderer(message.customType);
this.chatContainer.addChild(new CustomMessageComponent(message, renderer));
this.chatContainer.addChild(
new CustomMessageComponent(message, renderer, this.getMarkdownThemeWithSettings()),
);
}
break;
}
case "compactionSummary": {
this.chatContainer.addChild(new Spacer(1));
const component = new CompactionSummaryMessageComponent(message);
const component = new CompactionSummaryMessageComponent(message, this.getMarkdownThemeWithSettings());
component.setExpanded(this.toolOutputExpanded);
this.chatContainer.addChild(component);
break;
}
case "branchSummary": {
this.chatContainer.addChild(new Spacer(1));
const component = new BranchSummaryMessageComponent(message);
const component = new BranchSummaryMessageComponent(message, this.getMarkdownThemeWithSettings());
component.setExpanded(this.toolOutputExpanded);
this.chatContainer.addChild(component);
break;
@ -2012,7 +2026,7 @@ export class InteractiveMode {
case "user": {
const textContent = this.getUserMessageText(message);
if (textContent) {
const userComponent = new UserMessageComponent(textContent);
const userComponent = new UserMessageComponent(textContent, this.getMarkdownThemeWithSettings());
this.chatContainer.addChild(userComponent);
if (options?.populateHistory) {
this.editor.addToHistory?.(textContent);
@ -2021,7 +2035,11 @@ export class InteractiveMode {
break;
}
case "assistant": {
const assistantComponent = new AssistantMessageComponent(message, this.hideThinkingBlock);
const assistantComponent = new AssistantMessageComponent(
message,
this.hideThinkingBlock,
this.getMarkdownThemeWithSettings(),
);
this.chatContainer.addChild(assistantComponent);
break;
}
@ -3431,7 +3449,7 @@ export class InteractiveMode {
this.chatContainer.addChild(new DynamicBorder());
this.chatContainer.addChild(new Text(theme.bold(theme.fg("accent", "What's New")), 1, 0));
this.chatContainer.addChild(new Spacer(1));
this.chatContainer.addChild(new Markdown(changelogMarkdown, 1, 1, getMarkdownTheme()));
this.chatContainer.addChild(new Markdown(changelogMarkdown, 1, 1, this.getMarkdownThemeWithSettings()));
this.chatContainer.addChild(new DynamicBorder());
this.ui.requestRender();
}
@ -3561,7 +3579,7 @@ export class InteractiveMode {
this.chatContainer.addChild(new DynamicBorder());
this.chatContainer.addChild(new Text(theme.bold(theme.fg("accent", "Keyboard Shortcuts")), 1, 0));
this.chatContainer.addChild(new Spacer(1));
this.chatContainer.addChild(new Markdown(hotkeys.trim(), 1, 1, getMarkdownTheme()));
this.chatContainer.addChild(new Markdown(hotkeys.trim(), 1, 1, this.getMarkdownThemeWithSettings()));
this.chatContainer.addChild(new DynamicBorder());
this.ui.requestRender();
}