DocsTUI Components

TUI Components

Terminal UI components from connectonion.tui

Quick Start

main.py
python
from connectonion.tui import pick, Input, StatusBar
from rich.console import Console

console = Console()

# Single-select menu
choice = pick("Select model:", ["gpt-4", "claude-3", "gemini-pro"])

# Text input with file autocomplete
from connectonion.tui import FileProvider
text = Input(triggers={"@": FileProvider()}).run()

# Status bar
status = StatusBar([
    ("model", "gpt-4", "magenta"),
    ("tokens", "1.2k", "green"),
])
console.print(status.render())

Architecture

# data flow

User Input → TUI Component → Terminal (Rich) → User
     ↑                              ↓
     └──── Keyboard Events ────────┘

Components use Rich for terminal rendering, raw mode for keyboard capture, and ANSI codes for styling.

Input Components

Interactive input elements

Chat

Chat

Full chat interface with agent integration

Chat(agent=agent).run()

pick

pick

Single-select menu with keyboard navigation

pick("Select model", ["gpt-4", "claude-3"])

Input

Input

Smart text input with trigger-based autocomplete

Input(triggers={"@": FileProvider()}).run()

Dropdown

Dropdown

Selection list component for autocomplete menus

Dropdown(items, max_visible=5)

Display Components

Visual layout elements

StatusBar

StatusBar

Powerline-style status bar with colored segments

StatusBar([("model", "gpt-4", "magenta")])

Footer

Footer

Simple footer with tips/hints display

Footer(["? help", "/ commands"])

Divider

Divider

Simple horizontal line separator

Divider(width=40)

Utilities

Helper functions and providers

Fuzzy Matching

fuzzy_match

Fuzzy matching utilities for autocomplete

fuzzy_match("gp", "gpt-4")

Keyboard Input

getch / read_key

Low-level keyboard input primitives

key = read_key() # "up", "down", etc.

Autocomplete Providers

Providers

Data providers for autocomplete (FileProvider, StaticProvider)

FileProvider(root="src/")

Quick Reference

Component	Purpose	Import
Chat	Full chat interface with agent	`from connectonion.tui import Chat`
Input	Text input with autocomplete	`from connectonion.tui import Input`
pick	Single-select menu	`from connectonion.tui import pick`
Dropdown	Dropdown menus	`from connectonion.tui import Dropdown`
StatusBar	Powerline-style status	`from connectonion.tui import StatusBar`
Footer	Footer with help text	`from connectonion.tui import Footer`
Divider	Visual dividers	`from connectonion.tui import Divider`
fuzzy	Fuzzy matching	`from connectonion.tui import fuzzy_match`
keys	Keyboard input	`from connectonion.tui import getch`
providers	Autocomplete data sources	`from connectonion.tui import FileProvider`