Kilo Icon on editor actions

[catrielmuller]

Context

This PR adds a Kilo Code icon button to the editor toolbar that provides quick access to open Kilo Code from any editor context. This improves discoverability and accessibility by making it easier for users to launch Kilo Code without needing to navigate to the sidebar or use keyboard shortcuts.

Implementation

The implementation involves three main changes:

1. Command Registration (packages/types/src/vscode.ts): Added a new "open" command ID to the command registry to enable the new toolbar action.

2. Command Handler (src/activate/registerCommands.ts): Registered the open command handler that reuses the existing openClineInNewTab functionality, ensuring consistent behavior with other "open" actions.

3. UI Integration (src/package.json):

   • Added a new command definition with the Kilo Code icon (using light/dark variants from assets/icons/)
   • Registered the command in the editor toolbar menu with "when": "true" to make it always visible
   • Moved the popout button definition to maintain proper command grouping

The implementation follows the existing pattern used by other editor actions and properly marks Kilo Code-specific changes with kilocode_change comments to facilitate future upstream merges.

Screenshots

How to Test

1. Open any file in the VS Code editor
2. Look at the editor toolbar (top-right corner of the editor)
3. You should see a Kilo Code icon button (the icon will be light or dark depending on your theme)
4. Click the Kilo Code icon button
5. Verify that Kilo Code opens in a new editor tab
6. Test in both light and dark themes to ensure the icon displays correctly

[changeset-bot]

🦋 Changeset detected

Latest commit: 10ce725

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
kilo-code	Patch

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

[kiloconnect]

WARNING: Duplicate command definition

The command kilo-code.popoutButtonClicked is already defined at lines 166-169 in this file. This duplicate definition should be removed to avoid potential issues with VS Code's command registration.

Suggested change

	},
	},

[kiloconnect]

Code Review Summary

Status: 1 Issue Found | Recommendation: Address before merge

Overview

Severity	Count
CRITICAL	0
WARNING	1
SUGGESTION	0

Issue Details (click to expand)

WARNING

File	Line	Issue
src/package.json	301	Duplicate command definition - kilo-code.popoutButtonClicked is defined twice (first at line 166-169, again at lines 297-301)

Files Reviewed (4 files)

• .changeset/cold-sheep-feel.md - 0 issues
• packages/types/src/vscode.ts - 0 issues
• src/activate/registerCommands.ts - 0 issues
• src/package.json - 1 issue

---

Fix these issues in Kilo Cloud

[hassoncs]

Nice! I pulled it down, and it works great! My only question is, why do we need a new open event? kilo-code.open vs just using kilo-code.popoutButtonClicked again?

	open: () => openClineInNewTab({ context, outputChannel }), // kilocode_change
	openInNewTab: () => openClineInNewTab({ context, outputChannel }),

[catrielmuller]

Nice! I pulled it down, and it works great! My only question is, why do we need a new open event? kilo-code.open vs just using kilo-code.popoutButtonClicked again?

	open: () => openClineInNewTab({ context, outputChannel }), // kilocode_change
	openInNewTab: () => openClineInNewTab({ context, outputChannel }),

Because the OpenInNewTab use another icon (

)