tui-screenlisted
Install: claude install-skill stevengonsalvez/agents-in-a-box
# TUI Screen Creation Skill
This skill guides creation of **premium, consistent TUI components** for agents-in-a-box.
## Core Principles
All TUI components must follow these styling standards for visual consistency:
### 1. Color Palette (MANDATORY)
```rust
// Primary colors
const CORNFLOWER_BLUE: Color = Color::Rgb(100, 149, 237); // Borders, section titles
const GOLD: Color = Color::Rgb(255, 215, 0); // CTAs, emphasis, titles
const SELECTION_GREEN: Color = Color::Rgb(100, 200, 100); // Active selections
const WARNING_ORANGE: Color = Color::Rgb(255, 165, 0); // Warnings
// Backgrounds
const DARK_BG: Color = Color::Rgb(25, 25, 35); // Main background
const PANEL_BG: Color = Color::Rgb(30, 30, 40); // Panel backgrounds
const LIST_HIGHLIGHT_BG: Color = Color::Rgb(40, 40, 60); // Selection background
// Text
const SOFT_WHITE: Color = Color::Rgb(220, 220, 230); // Primary text
const MUTED_GRAY: Color = Color::Rgb(120, 120, 140); // Secondary text
const SUBDUED_BORDER: Color = Color::Rgb(60, 60, 80); // Secondary borders
// Status
const PROGRESS_CYAN: Color = Color::Rgb(100, 200, 230); // Loading/progress
```
### 2. Required Imports
```rust
use ratatui::{
Frame,
layout::{Constraint, Direction, Layout, Rect},
style::{Color, Modifier, Style},
text::{Line, Span},
widgets::{Block, Borders, BorderType, List, ListItem, ListState, Paragraph, Tabs, Wrap},
};
```
## Component Patterns
### Standa