feat(tui): add hierarchical skill group selector with tab navigation

.changeset/skill-group-selector.md

@@ -0,0 +1,5 @@
+---
+"@moonshot-ai/kimi-code": minor
+---
+
+Add hierarchical group navigation selector for the /skill command. Run /skill to open the interactive selector.

apps/kimi-code/src/tui/commands/dispatch.ts

@@ -54,9 +54,11 @@ import {
   type BuiltinSlashCommandName,
 } from './registry';
 import { handleReloadCommand, handleReloadTuiCommand } from './reload';
-import type { SkillListSession } from './skills';
+import { isUserActivatableSkill, type SkillListSession } from './skills';
+import { runSkillSelector } from './prompts';
 import {
   canRestoreSubmittedInput,
+  resolveSkillCommand,
   resolveSlashCommandInput,
   slashBusyMessage,
   slashCommandBusyReason,
@@ -424,6 +426,7 @@ const SESSION_REQUIRING_COMMANDS: ReadonlySet<BuiltinSlashCommandName> = new Set
   'goal',
   'init',
   'plan',
+  'skill',
   'swarm',
   'undo',
   'web',
@@ -606,8 +609,89 @@ async function handleBuiltInSlashCommand(
     case 'web':
       await handleWebCommand(host);
       return;
+    case 'skill':
+      await handleSkillCommand(host, args);
+      return;
     default:
       host.showError(`Unknown slash command: /${String(name)}`);
       return;
   }
 }
+
+async function handleSkillCommand(
+  host: SlashCommandHost,
+  args: string,
+): Promise<void> {
+  const busyReason = slashCommandBusyReason({
+    isStreaming: host.state.appState.streamingPhase !== 'idle',
+    isCompacting: host.state.appState.isCompacting,
+  });
+  if (busyReason !== undefined) {
+    host.showError(slashBusyMessage('skill', busyReason));
+    return;
+  }
+
+  let session = host.session;
+  if (session === undefined) {
+    session = await ensureSessionForCommand(host);
+    if (session === undefined) return;
+    const busyCheck = slashCommandBusyReason({
+      isStreaming: host.state.appState.streamingPhase !== 'idle',
+      isCompacting: host.state.appState.isCompacting,
+    });
+    if (busyCheck !== undefined) {
+      host.showError(slashBusyMessage('skill', busyCheck));
+      return;
+    }
+  }
+
+  let skills: readonly SkillSummary[] = [];
+  try {
+    skills = await session.listSkills();
+  } catch (error) {
+    host.showError(formatErrorMessage(error));
+    return;
+  }
+
+  const activatableSkills = skills.filter(isUserActivatableSkill);
+  const trimmedArgs = args.trim();
+
+  if (
+    trimmedArgs.length > 0 &&
+    trimmedArgs !== 'skill' &&
+    trimmedArgs !== '/skill' &&
+    trimmedArgs !== 'skills' &&
+    trimmedArgs !== '/skills'
+  ) {
+    const spaceIdx = trimmedArgs.search(/\s/);
+    const firstWord = spaceIdx >= 0 ? trimmedArgs.slice(0, spaceIdx) : trimmedArgs;
+    const remainingArgs = spaceIdx >= 0 ? trimmedArgs.slice(spaceIdx + 1).trim() : '';
+
+    const resolvedName =
+      resolveSkillCommand(host.skillCommandMap, firstWord) ??
+      resolveSkillCommand(host.skillCommandMap, trimmedArgs) ??
+      firstWord;
+    const targetSkill = activatableSkills.find(
+      (s) => s.name === resolvedName || s.name === firstWord || s.name === trimmedArgs,
+    );
+    if (targetSkill !== undefined) {
+      const skillArgs =
+        targetSkill.name === resolvedName || targetSkill.name === firstWord ? remainingArgs : '';
+      host.sendSkillActivation(session, targetSkill.name, skillArgs);
+      return;
+    }
+  }
+
+  const selectedSkill = await runSkillSelector(host, activatableSkills);
+  if (selectedSkill !== undefined) {
+    const busyCheck = slashCommandBusyReason({
+      isStreaming: host.state.appState.streamingPhase !== 'idle',
+      isCompacting: host.state.appState.isCompacting,
+    });
+    if (busyCheck !== undefined) {
+      host.showError(slashBusyMessage('skill', busyCheck));
+      return;
+    }
+    host.sendSkillActivation(session, selectedSkill.name, '');
+  }
+}

apps/kimi-code/src/tui/commands/prompts.ts

@@ -14,9 +14,10 @@ import type {
 
 import { ApiKeyInputDialogComponent, type ApiKeyInputResult } from '../components/dialogs/api-key-input-dialog';
 import { ChoicePickerComponent, type ChoiceOption } from '../components/dialogs/choice-picker';
-import { FeedbackInputDialogComponent, type FeedbackInputDialogResult } from '../components/dialogs/feedback-input-dialog';
 import { ModelSelectorComponent } from '../components/dialogs/model-selector';
 import { PlatformSelectorComponent } from '../components/dialogs/platform-selector';
+import { SkillSelectorComponent } from '../components/dialogs/skill-selector';
+import type { SkillSummary } from '@moonshot-ai/kimi-code-sdk';
 import type { SlashCommandHost } from './dispatch';
 
 export function promptPlatformSelection(host: SlashCommandHost): Promise<string | undefined> {
@@ -249,3 +250,26 @@ export function runModelSelector(
     host.mountEditorReplacement(selector);
   });
 }
+
+export function runSkillSelector(
+  host: SlashCommandHost,
+  skills: readonly SkillSummary[],
+  skillRoots?: readonly string[],
+): Promise<SkillSummary | undefined> {
+  return new Promise((resolve) => {
+    const selector = new SkillSelectorComponent({
+      skills,
+      skillRoots,
+      searchable: true,
+      onSelect: (skill) => {
+        host.restoreEditor();
+        resolve(skill);
+      },
+      onCancel: () => {
+        host.restoreEditor();
+        resolve(undefined);
+      },
+    });
+    host.mountEditorReplacement(selector);
+  });
+}

apps/kimi-code/src/tui/commands/registry.ts

@@ -206,6 +206,12 @@ export const BUILTIN_SLASH_COMMANDS = [
     priority: 95,
     availability: 'always',
   },
+  {
+    name: 'skill',
+    aliases: ['skills'],
+    description: 'Select skill from hierarchical group selector',
+    priority: 90,
+  },
   {
     name: 'btw',
     aliases: [],