← ClaudeAtlas

textuallisted

Use this skill when building or debugging a Python terminal UI (TUI) with Textual (Textualize's framework): `App`/`Screen`/`Widget`, `compose()`, `reactive`/`watch_`, `@work` workers, Textual CSS / TCSS (`dock`, `grid`, `fr` units), widgets like `RichLog`, `Markdown`, `DataTable`, `Input`, `TextArea`, `Tree`, `ListView`; testing with `Pilot` / `pytest-textual-snapshot`; `textual serve` / Textual Web deploy; Rich renderables inside Textual; or streaming LLM/agent tokens into a terminal and agentic-CLI front-ends. Triggers: Textual, Textualize, TUI, terminal UI, `@work`, TCSS, `RichLog`, `query_one`, Pilot, `textual serve`. Writes current 8.x code, not stale pre-1.0 patterns. Not for: Rust TUIs (→ Ratatui sibling), Go TUIs (→ Bubble Tea sibling), plain non-interactive CLI output (Click/argparse/Typer) with no live UI, or agent-session orchestration / tmux multiplexing. Note: browser deploy via `textual serve` (the same Textual app served to a browser) IS in scope; a general React/HTML web-app request is not.
vinsonconsulting/claude-skill-foundry · ★ 1 · Web & Frontend · score 80
Install: claude install-skill vinsonconsulting/claude-skill-foundry
# Textual Write current, compiling Textual code (pinned to **8.2.7**, Python **≥3.9**, Rich **15.0.0**) and refuse the pre-1.0 / 0.x patterns the model remembers from training — the 1.0 (Dec 2024) and 2.0 (Feb 2025) releases were hard breaks. The body is the load-bearing 20%: one mental model and one **run-verified** example per concept. Everything enumerable — the full widget catalog, every TCSS rule, the streaming model, testing, deploy, migration — lives in `references/`. Open the matching reference before writing nontrivial code in that area. ## Mental model Textual is a **retained, reactive, DOM-like** framework — the opposite of Ratatui's immediate mode and Bubble Tea's MVU. You build a tree of widget objects **once**, then mutate their state; Textual re-renders only the affected parts, like a web framework. It is **async-native** (asyncio) and styled with **Textual CSS (TCSS)**, not layout math. Four nouns carry everything: - **App** — the application and event loop; `App().run()` (or `await run_async()`). Holds screens, handles input, owns the `@work` workers. - **Screen** — a full-window container you push/pop; the default screen hosts your `compose()`. Modals/dialogs are screens. - **Widget** — a node in the DOM tree. **Leaf** widgets draw themselves (`render()`); **compound** widgets yield children (`compose()`). - **DOM + TCSS** — widgets form a tree you query with `query_one`/`query` (CSS selectors) and style with TCSS. Mutating a widget's `reactive` state s