feat(cli): Add markdown theming support for Reasoning box content - #4583
Merged
pandemicsyn merged 6 commits intoDec 22, 2025
Merged
Conversation
- Extended Theme interface with markdown color properties (text, heading, strong, em, code, blockquote, link, list) - Updated all 14 built-in themes with markdown color configurations - Modified MarkdownText component to accept and apply theme colors via TerminalRenderer - Updated SayReasoningMessage to pass theme to MarkdownText component - Enables full theming of markdown content inside Reasoning boxes
🦋 Changeset detectedLatest commit: 25a9499 The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
![kilo-code-bot[bot]](https://avatars.githubusercontent.com/in/2193792?s=60&v=4){kind=small}
Contributor
Author
There was a problem hiding this comment.
✅ No Issues Found
17 files reviewed | Confidence: 95% | Recommendation: Merge
Review Details
Files Reviewed:
cli/src/types/theme.ts- Theme interface extensioncli/src/ui/components/MarkdownText.tsx- Component theme supportcli/src/ui/messages/extension/say/SayReasoningMessage.tsx- Theme prop usage- 14 theme definition files (
alpha.ts,ansi.ts,ansi-light.ts,atom-one-dark.ts,ayu-dark.ts,ayu-light.ts,dark.ts,dracula.ts,github-dark.ts,github-light.ts,googlecode.ts,light.ts,shades-of-purple.ts,xcode.ts)
Checked:
- ✅ Security: No user input processing, static theme colors only
- ✅ Bugs: Type-safe implementation, proper null handling
- ✅ Performance: Theme merging happens once per render
- ✅ Error handling: Graceful fallback in MarkdownText component
- ✅ Backward compatibility: Optional theme prop maintains existing behavior
Implementation Quality:
- Clean extension of the Theme interface with required string properties
- Consistent markdown configuration across all 14 themes
- Proper precedence: theme colors override default options when provided
- Well-documented component with JSDoc comments
- Cast theme markdown colors to TerminalRendererOptions to fix TypeScript error - marked-terminal expects ChalkInstance or functions, but our theme uses strings - Type assertion allows the strings to be passed through correctly
- Import chalk and create proper chalk color instances - Add colorToChalk helper to handle both hex colors and named colors - Replace type assertion with proper chalk.hex() and chalk[color] calls - This ensures marked-terminal receives the correct ChalkInstance types
Contributor
Author
There was a problem hiding this comment.
✅ No New Issues in Latest Changes
Changes since last review (commits 246ca74 and f187fb2) look good.
Summary of new commits:
- Type assertion fix - Added proper type handling for TerminalRendererOptions
- Chalk instances fix - Replaced type assertion with proper
chalk.hex()andchalk[color]calls viacolorToChalkhelper
Reviewed:
- ✅
colorToChalkhelper correctly handles both hex colors (#ffffff) and named colors (white) - ✅ Graceful fallback to
chalk.whitefor invalid color names - ✅ Theme colors are statically defined in theme files (not user input), so the
(chalk as any)pattern is acceptable here - ✅ Implementation properly integrates with
marked-terminal's expectedChalkInstancetypes
Review Details
Files reviewed: cli/src/ui/components/MarkdownText.tsx
Checked: Type safety, runtime behavior, error handling
Contributor
|
- Replace 'as any' with proper type assertion using ChalkColor type - Fixes ESLint no-explicit-any error
Contributor
Author
There was a problem hiding this comment.
✅ No New Issues in Latest Changes
Changes since last review (commits 55cce3e and 25a9499) look good.
Summary of new commits:
- Type safety improvement - Replaced
as anywith properChalkColorMethodtype andisChalkColorMethodtype guard - Test coverage - Added comprehensive tests for theme support (hex colors, named colors, invalid color fallback)
Reviewed:
- ✅
colorToChalkhelper is now fully type-safe with explicitChalkColorMethodunion type - ✅
isChalkColorMethodtype guard properly validates named colors at runtime - ✅ Graceful fallback to
chalk.whitefor invalid color names - ✅ Test coverage verifies hex colors, named colors, and invalid color handling
- ✅ All 14 theme files have consistent markdown color configurations
Review Details
Files reviewed:
cli/src/ui/components/MarkdownText.tsx- Type-safe color handlingcli/src/ui/components/__tests__/MarkdownText.test.tsx- Theme support tests
Checked: Type safety, runtime behavior, error handling, test coverage
pandemicsyn
deleted the
session/agent_0804969b-ef89-4c16-a3c6-c17b312f5142
branch
December 22, 2025 14:41
This was referenced Dec 22, 2025
Merged
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
This PR adds full theming support for markdown content inside the Reasoning box in the CLI.
Changes
1. Extended Theme Interface
2. Updated All Theme Definitions
3. Modified MarkdownText Component
themeprop to accept Theme objectTerminalRendereroptions4. Updated SayReasoningMessage
MarkdownTextcomponentResult
Users can now customize the text color and styling of markdown content inside Reasoning boxes through the theme system. This provides a consistent theming experience across all CLI UI elements.
Files Changed
cli/src/types/theme.ts- Extended Theme interfacecli/src/constants/themes/*.ts- Updated all 14 theme definitionscli/src/ui/components/MarkdownText.tsx- Added theme supportcli/src/ui/messages/extension/say/SayReasoningMessage.tsx- Pass theme to MarkdownText