Terminal UI

The TUI provides an interactive, keyboard-driven interface for managing skills with visual browsing, searching, and installation capabilities.

Launch

skillkit ui
# or just
skillkit

Framework

Built on modern technologies:

• @opentui/react - Terminal rendering
• React 19.0.0 - Component architecture
• Bun 1.2.0+ - Runtime requirement

Screens

Keyboard Navigation

Global Shortcuts

List Navigation

Search Mode

Screen Details

Home Screen

Dashboard with:

• Quick navigation shortcuts
• Recent activity
• System status

Browse Screen

Repository browser with:

• Search functionality
• Pagination
• Quality indicators
• Animation phases for smooth loading

Installed Screen

Manage local skills:

• Enable/disable skills
• Quality grades (A-F)
• Live search filtering
• Status icons: ● enabled, ○ disabled

Marketplace Screen

Browse 15,000+ skills:

• Category filtering
• Featured skills
• 3-phase animation loading
• Quality scoring

Recommend Screen

AI-powered suggestions:

• Project analysis
• Confidence scoring
• Progress tracking
• Match percentages

Visual Indicators

Quality Grades

Status Icons

Theme System

The TUI uses a monochromatic design with:

• Consistent color coding
• Terminal-compatible colors
• Visual accents for selection
• Muted states for disabled items

Architecture

State Management

loadSkills()
  → getSearchDirs(agentType)
  → findAllSkills(searchDirs)
  → evaluateSkillDirectory() for each
  → getQualityGrade(quality.overall)
  → SkillsState

Performance Optimizations

• useMemo for filtered lists
• useCallback for event handlers
• Pagination limits rendered items
• Progressive animation with phases

Animation Timing

Integration

The TUI integrates with @skillkit/core:

findAllSkills(searchDirs)      // Returns skill metadata
evaluateSkillDirectory(path)   // Quality metrics
getQualityGrade(score)         // 0-100 to A-F

Graceful Exit

The TUI handles shutdown gracefully:

1. Unmounts React components
2. Restores terminal state
3. Cleans up signal handlers
4. Exits process cleanly

Press q from Home screen or Ctrl+C to exit.