跳到正文
cccskills
免费在 GitHub 公开

textual

Use when building terminal UI apps with the Textual framework — creating widgets, screens, layouts, handling events, managing reactive attributes, testing with Pilot, snapshot testing with pytest-textual-snapshot, or running background workers. Covers App lifecycle, CSS styling, screen stack, custom messages, actions, bindings, and the Worker API.

中文简介正在准备中。当前显示原文说明。

查看安装方法

包含的文件(1)

  • SKILL.md5.7 KB

SKILL.md(原文)

安装前可以查看交给 AI 代理的指令内容。

Textual Knowledge

Provides patterns, API constraints, and working examples for building terminal applications with the Textual framework.

Scope

Consult python-engineering:standards-for-python-development for the shared rules (architecture, typing, testing, CLI rules).

TRIGGER: Activate when the user asks about Textual — building TUI apps, widgets, CSS styling, reactive attributes, testing, or concurrency.

COVERS:

  • App class, run/exit/suspend, title/subtitle, CSS loading
  • Screen stack (push, pop, switch), modal screens, modes, screen data return
  • Custom widgets, builtins, Line API, compound widgets, data flow
  • Layout types (vertical, horizontal, grid), docking, layers, offsets
  • CSS selectors, pseudo-classes, combinators, specificity, variables, nesting
  • Events, message queue, bubbling, custom messages, @on decorator
  • Actions, action strings, namespaces, bindings, dynamic actions
  • Reactive attributes, smart refresh, validation, watch methods, compute, data binding
  • Testing with run_test, Pilot API (press, click, hover, pause)
  • Snapshot testing with pytest-textual-snapshot
  • Workers (@work, run_worker, thread workers, worker events)

DOES NOT COVER:

  • Rich library internals (see Rich docs)
  • Textual Web deployment
  • Custom CSS parsers or non-Textual terminal frameworks

Workflow

flowchart TD
    Task([Task received]) --> Q1{Task type?}
    Q1 -->|App structure or lifecycle| App[Load app-and-screens.md]
    Q1 -->|Widget creation or builtins| Wid[Load widgets.md]
    Q1 -->|Layout or CSS styling| CSS[Load layout-and-css.md]
    Q1 -->|Events, messages, or actions| Evt[Load events-and-actions.md]
    Q1 -->|Reactive attributes or data binding| React[Load reactivity.md]
    Q1 -->|Testing or background tasks| Test[Load testing-and-workers.md]
    Q1 -->|Multiple concerns| Multi[Load relevant files]

Reference Files

App and Screens

App class basics, run/exit/suspend, CSS loading, screen stack (push/pop/switch), modal screens, returning data from screens, and modes.

Load when the user asks about App setup, screen navigation, modal dialogs, or multi-screen apps.

../python3-cli/references/textual/app-and-screens.md

Widgets

Custom widget creation, Static, Default CSS, focusability, bindings, Rich renderables, Line API, compound widgets, coordinating via messages, and the builtin widget catalog.

Load when the user asks about creating widgets, choosing a builtin widget, or structuring compound UIs.

../python3-cli/references/textual/widgets.md

Layout and CSS

Layout types (vertical, horizontal, grid), utility containers, docking, layers, offsets, CSS selectors, pseudo-classes, combinators, specificity, variables, nested CSS, and the style property reference.

Load when the user asks about arranging widgets, CSS syntax, selectors, or style properties.

../python3-cli/references/textual/layout-and-css.md

Events and Actions

Message queue, event handler naming convention, @on decorator, handler arguments, async handlers, event bubbling, custom messages, preventing messages, actions, action strings, namespaces, key bindings, dynamic actions, and the builtin actions list.

Load when the user asks about handling user input, defining key bindings, creating custom events, or action strings.

../python3-cli/references/textual/events-and-actions.md

Reactivity

Reactive attributes, var, smart refresh, layout-triggering reactives, validation methods, watch methods, dynamic watchers, recompose, compute methods, set_reactive, mutable reactives (mutate_reactive), and data binding.

Load when the user asks about reactive state, auto-refresh, watchers, computed values, or binding parent state to child widgets.

../python3-cli/references/textual/reactivity.md

Testing and Workers

run_test, Pilot API (press, click, hover, pause), terminal size simulation, snapshot testing with pytest-textual-snapshot, run_worker, the @work decorator, worker state lifecycle, thread workers, and worker events.

Load when the user asks about writing tests, simulating input, snapshot comparisons, background HTTP requests, or preventing UI blocking.

../python3-cli/references/textual/testing-and-workers.md

Quick Reference

# Minimal app
from textual.app import App, ComposeResult
from textual.widgets import Label


class MyApp(App):
    CSS = "Screen { align: center middle; }"

    def compose(self) -> ComposeResult:
        yield Label("Hello!")


if __name__ == "__main__":
    MyApp().run()
# Reactive + watch
from textual.reactive import reactive
from textual.widget import Widget


class Counter(Widget):
    count = reactive(0)

    def watch_count(self, value: int) -> None:
        self.refresh()

    def render(self) -> str:
        return str(self.count)
# Worker for background HTTP
from textual import work
import httpx


class MyApp(App):
    @work(exclusive=True)
    async def fetch(self, url: str) -> None:
        async with httpx.AsyncClient() as client:
            response = await client.get(url)
        self.query_one("#result").update(response.text)
# Test with Pilot
async def test_button() -> None:
    app = MyApp()
    async with app.run_test() as pilot:
        await pilot.click("#submit")
        assert app.query_one("#result").renderable == "done"

评价

还没有评价。欢迎分享你的使用感受。

评论

无需登录即可发表。欢迎分享使用感受、提问,或说明在哪些环境下无法运行。

还没有评论。来写第一条吧。

提交后会立即公开。请勿填写邮箱、电话等个人信息。URL 最多 2 个。

0 / 1000 字

此表单受 reCAPTCHA 保护,适用 Google 的隐私权政策和服务条款。

同一仓库的技能

Add automated documentation updater to any Claude skill. Creates a Python sync script that downloads upstream docs, processes markdown for AI consumption, and maintains local cache with configurable refresh. Collects template variables, then delegates implementation through 5-phase workflow. Use when adding auto-updating reference documentation to plugins or skills.

中文简介正在准备中。当前显示原文说明。

Jamie-BitFlight/claude_skills672026年10月20日 更新

SAM-style feature initiation workflow — discovery through codebase analysis, architecture spec, task decomposition, validation, and context manifest. Use when a user asks to add a feature, plan a feature, or convert an idea into an executable SAM plan.

中文简介正在准备中。当前显示原文说明。

Jamie-BitFlight/claude_skills672026年10月20日 更新

Browser automation CLI for AI agents. Use when the user needs to interact with websites, including navigating pages, filling forms, clicking buttons, taking screenshots, extracting data, testing web apps, or automating any browser task. Triggers include requests to "open a website", "fill out a form", "click a button", "take a screenshot", "scrape data from a page", "test this web app", "login to a site", "automate browser actions", or any task requiring programmatic web interaction.

中文简介正在准备中。当前显示原文说明。

Jamie-BitFlight/claude_skills672026年10月20日 更新

Browser automation for AI agents using the agent-browser CLI and Playwright. Use when navigating pages, filling forms, clicking buttons, taking screenshots, extracting data, testing web apps, logging into sites, or automating any browser task. Triggers on "open a website", "fill out a form", "click a button", "scrape data", "test this web app", "automate browser actions", or any programmatic web interaction request.

中文简介正在准备中。当前显示原文说明。

Jamie-BitFlight/claude_skills672026年10月20日 更新

Runs the description-drift experiment — spawns all Claude Code agents simultaneously to collect self-reported capabilities, then compares them against static frontmatter descriptions to reveal how reliable orchestrator routing based on descriptions actually is. Use when measuring description drift across the agent fleet, re-running the capability collection experiment, analyzing a specific agent's self-reported capabilities, or auditing whether frontmatter descriptions accurately reflect agent behavior.

中文简介正在准备中。当前显示原文说明。

Jamie-BitFlight/claude_skills672026年10月20日 更新

Create or adapt Claude Code agent definitions. Use when creating an agent, changing subagent configuration, selecting agent scope, or designing a specialized delegation role.

中文简介正在准备中。当前显示原文说明。

Jamie-BitFlight/claude_skills672026年10月20日 更新

查看 Jamie-BitFlight 的全部技能

报告此技能的问题