feat: implement custom slash commands system
Adds a comprehensive slash command system that allows users to create and manage custom commands: - Backend implementation in Rust for discovering, loading, and managing slash commands - Support for both user-level (~/.claude/commands/) and project-level (.claude/commands/) commands - YAML frontmatter support for command metadata (description, allowed-tools) - Command namespacing with directory structure (e.g., /namespace:command) - Detection of special features: bash commands (\!), file references (@), and arguments ($ARGUMENTS) Frontend enhancements: - SlashCommandPicker component with autocomplete UI and keyboard navigation - SlashCommandsManager component for CRUD operations on commands - Integration with FloatingPromptInput to trigger picker on "/" input - Visual indicators for command features (bash, files, arguments) - Grouped display by namespace with search functionality API additions: - slash_commands_list: Discover all available commands - slash_command_get: Retrieve specific command by ID - slash_command_save: Create or update commands - slash_command_delete: Remove commands This implementation provides a foundation for users to create reusable command templates and workflows. Commands are stored as markdown files with optional YAML frontmatter for metadata. Addresses #127 and #134
This commit is contained in:
@@ -24,6 +24,7 @@ import { Toast, ToastContainer } from "@/components/ui/toast";
|
||||
import { ClaudeVersionSelector } from "./ClaudeVersionSelector";
|
||||
import { StorageTab } from "./StorageTab";
|
||||
import { HooksEditor } from "./HooksEditor";
|
||||
import { SlashCommandsManager } from "./SlashCommandsManager";
|
||||
|
||||
interface SettingsProps {
|
||||
/**
|
||||
@@ -357,12 +358,13 @@ export const Settings: React.FC<SettingsProps> = ({
|
||||
) : (
|
||||
<div className="flex-1 overflow-y-auto p-4">
|
||||
<Tabs value={activeTab} onValueChange={setActiveTab} className="w-full">
|
||||
<TabsList className="grid grid-cols-6">
|
||||
<TabsList className="grid grid-cols-7 w-full">
|
||||
<TabsTrigger value="general">General</TabsTrigger>
|
||||
<TabsTrigger value="permissions">Permissions</TabsTrigger>
|
||||
<TabsTrigger value="environment">Environment</TabsTrigger>
|
||||
<TabsTrigger value="advanced">Advanced</TabsTrigger>
|
||||
<TabsTrigger value="hooks">Hooks</TabsTrigger>
|
||||
<TabsTrigger value="commands">Commands</TabsTrigger>
|
||||
<TabsTrigger value="storage">Storage</TabsTrigger>
|
||||
</TabsList>
|
||||
|
||||
@@ -705,6 +707,13 @@ export const Settings: React.FC<SettingsProps> = ({
|
||||
</Card>
|
||||
</TabsContent>
|
||||
|
||||
{/* Commands Tab */}
|
||||
<TabsContent value="commands">
|
||||
<Card className="p-6">
|
||||
<SlashCommandsManager className="p-0" />
|
||||
</Card>
|
||||
</TabsContent>
|
||||
|
||||
{/* Storage Tab */}
|
||||
<TabsContent value="storage">
|
||||
<StorageTab />
|
||||
|
Reference in New Issue
Block a user