Codewhale Ratatui

浏览输入框、工作栏、海洋、主题与海洋生物，再参考 Rust 示例将 Codewhale 的终端组件用于你的应用。

用于你的应用GitHub 仓库
原生对话、输入框与任务工作栏 · Underwater 真彩色 · 104×30原生对话、输入框与任务工作栏 · Underwater 真彩色 · 40×30在组件探索器中打开 ↓关于此组合 →

从可运行的应用开始

输入消息，按 Enter 显示消息，按 Esc 退出。入门示例在一个小应用中连接可编辑输入、原生输入框与工作栏。

查看完整入门示例 →阅读入门指南 →
git clone https://github.com/codewhale-hq/codewhale-ratatui
cd codewhale-ratatui
cargo run --locked --example starter

Rust 1.89+ · MIT 许可证

添加到现有 Ratatui 应用

将组件库添加到 Cargo.toml。可使用现有终端后端，或为新应用启用 Crossterm。

[dependencies]
codewhale-ratatui = { git = "https://github.com/codewhale-hq/codewhale-ratatui", rev = "4d5b05ba0709eb850e7415929b51c4db083d1241" }
ratatui = { version = "0.30.2", default-features = false, features = ["std", "crossterm_0_29"] }
crossterm = "0.29"

启动时检测一次主题，再传入绘制函数。Theme::detect().tui() 会选择原生终端配色。

let theme = codewhale_ratatui::Theme::detect().tui();
pub fn draw_composer(
    area: ratatui::layout::Rect,
    buffer: &mut ratatui::buffer::Buffer,
    theme: &codewhale_ratatui::Theme,
    draft: &codewhale_ratatui::TextInputState,
) -> Option<ratatui::layout::Position> {
    use codewhale_ratatui::{NativeComposer, Paint};
    let area = area.intersection(buffer.area);
    if area.is_empty() {
        return None;
    }
    let composer = NativeComposer::new(draft.text())
        .focused(true)
        .cursor(draft.cursor())
        .can_submit(!draft.is_empty())
        .placeholder("Type a line, then press Enter");
    let height = composer.desired_height(area.width, area.height);
    let slot = ratatui::layout::Rect::new(area.x, area.bottom() - height, area.width, height);
    composer.paint(slot, buffer, theme);
    composer.cursor_position(slot)
}
保存状态
应用保存草稿、选中项、工作数据及持续使用的鲸鱼 Stage。
渲染视图
组件将你提供的数据绘制到 Ratatui 帧中。
处理操作
将输入结果交给应用处理；动画需要重绘时，提供经过的时间。

你想构建什么？

选择一个起点，或浏览下方的全部组件。

The live component gallery

Showcase work

打开组件页面

The native conversation layout, composer and workbar, plus interactive component studies

正在加载预览…
104 × 30dark-truecolor

使用示例数据，由 Rust 组件渲染。选择终端配置和宽度，比较不同布局。

使用的组件

你的应用管理状态、时间与操作。组件渲染到你提供的 Ratatui 帧。