MCPcopy Index your code
hub / github.com/TylerBloom/webatui

github.com/TylerBloom/webatui @v0.1.1

Chat with this repo
repository ↗ · DeepWiki ↗ · release v0.1.1 ↗ · + Follow
90 symbols 148 edges 7 files 40 documented · 44%
What it actually does AI analysis from the code graph — generated when you open this
loading…
README

Crates.io Documentation GitHub Workflows Coverage Status Maintenance

About

Webatui is an integration between the Yew and Ratatui for building TUI-themed webapps. As much as possible, webatui is built to be "plug and play". That is, if you already have a TUI app that you want to display in the browser, you should be able to do so with minimal refactoring.

The crate was inspired by the creation of my blog, The Avid Rustacean. A write up on how Yew and Ratatui are integrated can be found in the blog inital post.

What webatui does: - Renders the text to HTML - Supports Ratatui's index colors via base16-palettes - Supports hyperlinks - Supports mouse events (clicks) - Supports automatic screen resizing - Supports scrolling (on PC and mobile)

Basic Usage

This crate has examples that you can use as a template for your own project. To get a more complete understanding, I would recommend following the Yew tutorial. Once you have wrapped your head around that (or just gotten it to run), come back here.

For basic apps, add Ratatui and Webatui as dependencies. Webatui handles nearly all of the Yew-related details, but your app will use ratatui to render the text. See the hello world example to see how to turn your Yew hello world example into a Webatui hello world.

There are a few important details. Webatui handrolls most of its own CSS; however, you must use a monospace font. Pick a font that you like, but every example uses Adobe's Source Code Pro font. Many monospace fonts will render well on PC but do not render in a strickly monospace fashion on mobile. Take this into consideration when picking your font.

Contributing

This project is licensed under LGPL-2.1. You may use this crate as a dependency on a closed-source/properity codebase; however, if you improve up or derivate another library crate from this crate, please license that crate under the LGPL-2.1 or a strong GPL license.

If you discover a bug, would like a feature supported, or have some way of improving this crate, please feel free to open an issue or a PR.

Future Plans

This crate was born from an abstraction that I needed for my blog. As such, there are surely ways to improve upon it. I will avoid needlessly adding breaking changes; however, they still many occur for improved ergonomics, effieceny, final binary size, and more.

Extension points exported contracts — how you extend this code

TerminalApp (Interface)
The core user-facing abstraction of this crate. A terminal app is a type that can be wrapped by a [`WebTerminal`] and be [3 …
src/lib.rs
ToIndexedColor (Interface)
An abstraction to allow for conversion between base16 colors and ratatui `Color` [3 implementers]
src/backend.rs
NeedsHydration (Interface)
An abstraction to allow for method chain to mark a something as hydratable [1 implementers]
src/backend.rs
Base16Style (Interface)
An abstraction to allow for conversion between base16 colors and ratatui `Color`. [1 implementers]
src/backend.rs

Core symbols most depended-on inside this repo

on_click
called by 6
src/backend.rs
style
called by 5
src/backend.rs
run_tui
called by 3
src/lib.rs
to_color
called by 3
src/backend.rs
hydrate
called by 2
src/lib.rs
render
called by 2
src/lib.rs
text
called by 2
src/backend.rs
refresh_body_bg
called by 2
src/backend.rs

Shape

Method 53
Function 18
Class 11
Enum 4
Interface 4

Languages

Rust100%

Modules by API surface

src/backend.rs45 symbols
src/lib.rs20 symbols
src/utils.rs10 symbols
examples/counter/src/main.rs6 symbols
examples/color_changer/src/main.rs5 symbols
examples/hello_world/src/main.rs4 symbols

For agents

$ claude mcp add webatui \
  -- python -m otcore.mcp_server <graph>

⬇ download graph artifact