diff --git a/docs/README.md b/docs.md similarity index 100% rename from docs/README.md rename to docs.md diff --git a/docs/examples/app/event01.py b/docs/examples/app/event01.py index 60a411735..0f3bc3cdc 100644 --- a/docs/examples/app/event01.py +++ b/docs/examples/app/event01.py @@ -25,6 +25,6 @@ class EventApp(App): self.screen.styles.background = self.COLORS[int(event.key)] -app = EventApp() if __name__ == "__main__": + app = EventApp() app.run() diff --git a/docs/examples/app/question01.py b/docs/examples/app/question01.py index 01a70c233..e61fba393 100644 --- a/docs/examples/app/question01.py +++ b/docs/examples/app/question01.py @@ -12,7 +12,7 @@ class QuestionApp(App[str]): self.exit(event.button.id) -app = QuestionApp() if __name__ == "__main__": + app = QuestionApp() reply = app.run() print(reply) diff --git a/docs/examples/app/question02.py b/docs/examples/app/question02.py index a1d107c04..36b23722b 100644 --- a/docs/examples/app/question02.py +++ b/docs/examples/app/question02.py @@ -3,6 +3,8 @@ from textual.widgets import Static, Button class QuestionApp(App[str]): + CSS_PATH = "question02.css" + def compose(self) -> ComposeResult: yield Static("Do you love Textual?", id="question") yield Button("Yes", id="yes", variant="primary") @@ -12,7 +14,7 @@ class QuestionApp(App[str]): self.exit(event.button.id) -app = QuestionApp(css_path="question02.css") if __name__ == "__main__": + app = QuestionApp() reply = app.run() print(reply) diff --git a/docs/examples/app/question03.py b/docs/examples/app/question03.py index 1f2f02cd3..41ad0f349 100644 --- a/docs/examples/app/question03.py +++ b/docs/examples/app/question03.py @@ -32,7 +32,7 @@ class QuestionApp(App[str]): self.exit(event.button.id) -app = QuestionApp() if __name__ == "__main__": + app = QuestionApp() reply = app.run() print(reply) diff --git a/docs/examples/app/return.py b/docs/examples/app/return.py index 9e37b4276..d3214318e 100644 --- a/docs/examples/app/return.py +++ b/docs/examples/app/return.py @@ -9,6 +9,6 @@ class ButtonsApp(App): yield Button("Chani") -app = ButtonsApp() if __name__ == "__main__": + app = ButtonsApp() app.run() diff --git a/docs/examples/app/simple02.py b/docs/examples/app/simple02.py index 8b4fec9ce..e087ac2d2 100644 --- a/docs/examples/app/simple02.py +++ b/docs/examples/app/simple02.py @@ -5,6 +5,6 @@ class MyApp(App): pass -app = MyApp() if __name__ == "__main__": + app = MyApp() app.run() diff --git a/docs/examples/app/widgets01.py b/docs/examples/app/widgets01.py index baeb3bec8..c8abd8f48 100644 --- a/docs/examples/app/widgets01.py +++ b/docs/examples/app/widgets01.py @@ -10,6 +10,6 @@ class WelcomeApp(App): self.exit() -app = WelcomeApp() if __name__ == "__main__": + app = WelcomeApp() app.run() diff --git a/docs/examples/app/widgets02.py b/docs/examples/app/widgets02.py index 9fb52c228..43a3bf047 100644 --- a/docs/examples/app/widgets02.py +++ b/docs/examples/app/widgets02.py @@ -10,6 +10,6 @@ class WelcomeApp(App): self.exit() -app = WelcomeApp() if __name__ == "__main__": + app = WelcomeApp() app.run() diff --git a/docs/examples/basic.css b/docs/examples/basic.css deleted file mode 100644 index 825d4e9b6..000000000 --- a/docs/examples/basic.css +++ /dev/null @@ -1,253 +0,0 @@ -/* CSS file for basic.py */ - - - - * { - transition: color 300ms linear, background 300ms linear; -} - - -*:hover { - /* tint: 30% red; - /* outline: heavy red; */ -} - -App > Screen { - - background: $surface; - color: $text; - layers: base sidebar; - - color: $text; - background: $background; - layout: vertical; - - overflow: hidden; - -} - -#tree-container { - overflow-y: auto; - height: 20; - margin: 1 3; - background: $panel; - padding: 1 2; -} - -DirectoryTree { - padding: 0 1; - height: auto; - -} - - - - -DataTable { - /*border:heavy red;*/ - /* tint: 10% green; */ - /* text-opacity: 50%; */ - padding: 1; - margin: 1 2; - height: 24; -} - -#sidebar { - color: $text; - background: $panel; - dock: left; - width: 30; - margin-bottom: 1; - offset-x: -100%; - - transition: offset 500ms in_out_cubic; - layer: sidebar; -} - -#sidebar.-active { - offset-x: 0; -} - -#sidebar .title { - height: 1; - background: $primary-background-darken-1; - color: $text-muted; - border-right: wide $background; - content-align: center middle; -} - -#sidebar .user { - height: 8; - background: $panel-darken-1; - color: $text-muted; - border-right: wide $background; - content-align: center middle; -} - -#sidebar .content { - background: $panel-darken-2; - color: $text; - border-right: wide $background; - content-align: center middle; -} - - - - -Tweet { - height:12; - width: 100%; - margin: 0 2; - - background: $panel; - color: $text; - layout: vertical; - /* border: outer $primary; */ - padding: 1; - border: wide $panel; - overflow: auto; - /* scrollbar-gutter: stable; */ - align-horizontal: center; - box-sizing: border-box; -} - - -.scrollable { - overflow-x: auto; - overflow-y: scroll; - margin: 1 2; - height: 24; - align-horizontal: center; - layout: vertical; -} - -.code { - height: auto; - -} - - -TweetHeader { - height:1; - background: $accent; - color: $text -} - -TweetBody { - width: 100%; - background: $panel; - color: $text; - height: auto; - padding: 0 1 0 0; -} - -Tweet.scroll-horizontal TweetBody { - width: 350; -} - -.button { - background: $accent; - color: $text; - width:20; - height: 3; - /* border-top: hidden $accent-darken-3; */ - border: tall $accent-darken-2; - /* border-left: tall $accent-darken-1; */ - - - /* padding: 1 0 0 0 ; */ - - transition: background 400ms in_out_cubic, color 400ms in_out_cubic; - -} - -.button:hover { - background: $accent-lighten-1; - color: $text-disabled; - width: 20; - height: 3; - border: tall $accent-darken-1; - /* border-left: tall $accent-darken-3; */ - - - - -} - -#footer { - color: $text; - background: $accent; - height: 1; - - content-align: center middle; - dock:bottom; -} - - -#sidebar .content { - layout: vertical -} - -OptionItem { - height: 3; - background: $panel; - border-right: wide $background; - border-left: blank; - content-align: center middle; -} - -OptionItem:hover { - height: 3; - color: $text; - background: $primary-darken-1; - /* border-top: hkey $accent2-darken-3; - border-bottom: hkey $accent2-darken-3; */ - text-style: bold; - border-left: outer $secondary-darken-2; -} - -Error { - width: 100%; - height:3; - background: $error; - color: $text; - border-top: tall $error-darken-2; - border-bottom: tall $error-darken-2; - - padding: 0; - text-style: bold; - align-horizontal: center; -} - -Warning { - width: 100%; - height:3; - background: $warning; - color: $text-muted; - border-top: tall $warning-darken-2; - border-bottom: tall $warning-darken-2; - - text-style: bold; - align-horizontal: center; -} - -Success { - width: 100%; - - height:auto; - box-sizing: border-box; - background: $success; - color: $text-muted; - - border-top: hkey $success-darken-2; - border-bottom: hkey $success-darken-2; - - text-style: bold ; - - align-horizontal: center; -} - - -.horizontal { - layout: horizontal -} diff --git a/docs/examples/demo.py b/docs/examples/demo.py deleted file mode 100644 index fcea3e753..000000000 --- a/docs/examples/demo.py +++ /dev/null @@ -1,234 +0,0 @@ -from rich.console import RenderableType - -from rich.syntax import Syntax -from rich.text import Text - -from textual.app import App, ComposeResult -from textual.reactive import Reactive -from textual.widget import Widget -from textual.widgets import Static, DataTable, DirectoryTree, Header, Footer -from textual.layout import Container - -CODE = ''' -from __future__ import annotations - -from typing import Iterable, TypeVar - -T = TypeVar("T") - - -def loop_first(values: Iterable[T]) -> Iterable[tuple[bool, T]]: - """Iterate and generate a tuple with a flag for first value.""" - iter_values = iter(values) - try: - value = next(iter_values) - except StopIteration: - return - yield True, value - for value in iter_values: - yield False, value - - -def loop_last(values: Iterable[T]) -> Iterable[tuple[bool, T]]: - """Iterate and generate a tuple with a flag for last value.""" - iter_values = iter(values) - try: - previous_value = next(iter_values) - except StopIteration: - return - for value in iter_values: - yield False, previous_value - previous_value = value - yield True, previous_value - - -def loop_first_last(values: Iterable[T]) -> Iterable[tuple[bool, bool, T]]: - """Iterate and generate a tuple with a flag for first and last value.""" - iter_values = iter(values) - try: - previous_value = next(iter_values) - except StopIteration: - return - first = True - for value in iter_values: - yield first, False, previous_value - first = False - previous_value = value - yield first, True, previous_value -''' - - -lorem_short = """Lorem ipsum dolor sit amet, consectetur adipiscing elit. In velit liber a a a, volutpat nec hendrerit at, faucibus in odio. Aliquam hendrerit nibh sed quam volutpat maximus. Nullam suscipit convallis lorem quis sodales. In tristique lobortis ante et dictum. Ut at finibus ipsum.""" -lorem = ( - lorem_short - + """ In urna dolor, placerat et mi facilisis, congue sollicitudin massa. Phasellus felis turpis, cursus eu lectus et, porttitor malesuada augue. Sed feugiat volutpat velit, sollicitudin fringilla velit bibendum faucibus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In velit libero, volutpat nec hendrerit at, faucibus in odio. Aliquam hendrerit nibh sed quam volutpat maximus. Nullam suscipit convallis lorem quis sodales. In tristique lobortis ante et dictum. Ut at finibus ipsum. In urna dolor, placerat et mi facilisis, congue sollicitudin massa. Phasellus felis turpis, cursus eu lectus et, porttitor malesuada augue. Sed feugiat volutpat velit, sollicitudin fringilla velit bibendum faucibus. """ -) - -lorem_short_text = Text.from_markup(lorem_short) -lorem_long_text = Text.from_markup(lorem * 2) - - -class TweetHeader(Widget): - def render(self) -> RenderableType: - return Text("Lorem Impsum", justify="center") - - -class TweetBody(Widget): - short_lorem = Reactive(False) - - def render(self) -> Text: - return lorem_short_text if self.short_lorem else lorem_long_text - - -class Tweet(Widget): - pass - - -class OptionItem(Widget): - def render(self) -> Text: - return Text("Option") - - -class Error(Widget): - def render(self) -> Text: - return Text("This is an error message", justify="center") - - -class Warning(Widget): - def render(self) -> Text: - return Text("This is a warning message", justify="center") - - -class Success(Widget): - def render(self) -> Text: - return Text("This is a success message", justify="center") - - -class BasicApp(App, css_path="basic.css"): - """A basic app demonstrating CSS""" - - def on_load(self): - """Bind keys here.""" - self.bind("s", "toggle_class('#sidebar', '-active')", description="Sidebar") - self.bind("d", "toggle_dark", description="Dark mode") - self.bind("q", "quit", description="Quit") - self.bind("f", "query_test", description="Query test") - - def compose(self): - yield Header() - - table = DataTable() - self.scroll_to_target = Tweet(TweetBody()) - - yield Container( - Tweet(TweetBody()), - Widget( - Static( - Syntax(CODE, "python", line_numbers=True, indent_guides=True), - classes="code", - ), - classes="scrollable", - ), - table, - Error(), - Tweet(TweetBody(), classes="scrollbar-size-custom"), - Warning(), - Tweet(TweetBody(), classes="scroll-horizontal"), - Success(), - Tweet(TweetBody(), classes="scroll-horizontal"), - Tweet(TweetBody(), classes="scroll-horizontal"), - Tweet(TweetBody(), classes="scroll-horizontal"), - Tweet(TweetBody(), classes="scroll-horizontal"), - Tweet(TweetBody(), classes="scroll-horizontal"), - ) - yield Widget( - Widget(classes="title"), - Widget(classes="user"), - OptionItem(), - OptionItem(), - OptionItem(), - Widget(classes="content"), - id="sidebar", - ) - yield Footer() - - table.add_column("Foo", width=20) - table.add_column("Bar", width=20) - table.add_column("Baz", width=20) - table.add_column("Foo", width=20) - table.add_column("Bar", width=20) - table.add_column("Baz", width=20) - table.zebra_stripes = True - for n in range(100): - table.add_row(*[f"Cell ([b]{n}[/b], {col})" for col in range(6)]) - - def on_mount(self): - self.sub_title = "Widget demo" - - async def on_key(self, event) -> None: - await self.dispatch_key(event) - - def action_toggle_dark(self): - self.dark = not self.dark - - def action_query_test(self): - query = self.query("Tweet") - self.log(query) - self.log(query.nodes) - self.log(query) - self.log(query.nodes) - - query.set_styles("outline: outer red;") - - query = query.exclude(".scroll-horizontal") - self.log(query) - self.log(query.nodes) - - # query = query.filter(".rubbish") - # self.log(query) - # self.log(query.first()) - - async def key_q(self): - await self.shutdown() - - def key_x(self): - self.panic(self.tree) - - def key_escape(self): - self.app.bell() - - def key_t(self): - # Pressing "t" toggles the content of the TweetBody widget, from a long "Lorem ipsum..." to a shorter one. - tweet_body = self.query("TweetBody").first() - tweet_body.short_lorem = not tweet_body.short_lorem - - def key_v(self): - self.get_child(id="content").scroll_to_widget(self.scroll_to_target) - - def key_space(self): - self.bell() - - -app = BasicApp() - -if __name__ == "__main__": - app.run() - - # from textual.geometry import Region - # from textual.color import Color - - # print(Region.intersection.cache_info()) - # print(Region.overlaps.cache_info()) - # print(Region.union.cache_info()) - # print(Region.split_vertical.cache_info()) - # print(Region.__contains__.cache_info()) - # from textual.css.scalar import Scalar - - # print(Scalar.resolve_dimension.cache_info()) - - # from rich.style import Style - # from rich.cells import cached_cell_len - - # print(Style._add.cache_info()) - - # print(cached_cell_len.cache_info()) diff --git a/docs/examples/events/custom01.py b/docs/examples/events/custom01.py new file mode 100644 index 000000000..043b32ffc --- /dev/null +++ b/docs/examples/events/custom01.py @@ -0,0 +1,48 @@ +from textual.app import App, ComposeResult +from textual.color import Color +from textual.message import Message, MessageTarget +from textual.widgets import Static + + +class ColorButton(Static): + """A color button.""" + + class Selected(Message): + """Color selected message.""" + + def __init__(self, sender: MessageTarget, color: Color) -> None: + self.color = color + super().__init__(sender) + + def __init__(self, color: Color) -> None: + self.color = color + super().__init__() + + def on_mount(self) -> None: + self.styles.margin = (1, 2) + self.styles.content_align = ("center", "middle") + self.styles.background = Color.parse("#ffffff33") + self.styles.border = ("tall", self.color) + + async def on_click(self) -> None: + # The emit method sends an event to a widget's parent + await self.emit(self.Selected(self, self.color)) + + def render(self) -> str: + return str(self.color) + + +class ColorApp(App): + def compose(self) -> ComposeResult: + yield ColorButton(Color.parse("#008080")) + yield ColorButton(Color.parse("#808000")) + yield ColorButton(Color.parse("#E9967A")) + yield ColorButton(Color.parse("#121212")) + + def on_color_button_selected(self, message: ColorButton.Selected) -> None: + self.screen.styles.animate("background", message.color, duration=0.5) + + +if __name__ == "__main__": + app = ColorApp() + app.run() diff --git a/docs/examples/events/dictionary.css b/docs/examples/events/dictionary.css new file mode 100644 index 000000000..f0e46faa7 --- /dev/null +++ b/docs/examples/events/dictionary.css @@ -0,0 +1,29 @@ +Screen { + background: $panel; +} + +TextInput { + dock: top; + border: tall $background; + width: 100%; + height: 1; + padding: 0 1; + margin: 1 1 0 1; + background: $boost; +} + +TextInput:focus { + border: tall $accent; +} + +#results { + width: auto; + min-height: 100%; +} + +#results-container { + background: $background 50%; + overflow: auto; + margin: 1 2; + height: 100%; +} diff --git a/docs/examples/events/dictionary.py b/docs/examples/events/dictionary.py new file mode 100644 index 000000000..207474629 --- /dev/null +++ b/docs/examples/events/dictionary.py @@ -0,0 +1,45 @@ +import asyncio + +try: + import httpx +except ImportError: + raise ImportError("Please install httpx with 'pip install httpx' ") + +from rich.json import JSON + +from textual.app import App, ComposeResult +from textual.layout import Vertical +from textual.widgets import Static, TextInput + + +class DictionaryApp(App): + """Searches ab dictionary API as-you-type.""" + + CSS_PATH = "dictionary.css" + + def compose(self) -> ComposeResult: + yield TextInput(placeholder="Search for a word") + yield Vertical(Static(id="results", fluid=False), id="results-container") + + async def on_text_input_changed(self, message: TextInput.Changed) -> None: + """A coroutine to handle a text changed message.""" + if message.value: + # Look up the word in the background + asyncio.create_task(self.lookup_word(message.value)) + else: + # Clear the results + self.query_one("#results", Static).update() + + async def lookup_word(self, word: str) -> None: + """Looks up a word.""" + url = f"https://api.dictionaryapi.dev/api/v2/entries/en/{word}" + async with httpx.AsyncClient() as client: + results = (await client.get(url)).text + + if word == self.query_one(TextInput).value: + self.query_one("#results", Static).update(JSON(results)) + + +if __name__ == "__main__": + app = DictionaryApp() + app.run() diff --git a/docs/examples/guide/dom1.py b/docs/examples/guide/dom1.py index e1f9fa14e..b45ebdb8c 100644 --- a/docs/examples/guide/dom1.py +++ b/docs/examples/guide/dom1.py @@ -5,6 +5,6 @@ class ExampleApp(App): pass -app = ExampleApp() if __name__ == "__main__": + app = ExampleApp() app.run() diff --git a/docs/examples/guide/dom2.py b/docs/examples/guide/dom2.py index b8b2913bf..35b670327 100644 --- a/docs/examples/guide/dom2.py +++ b/docs/examples/guide/dom2.py @@ -8,6 +8,6 @@ class ExampleApp(App): yield Footer() -app = ExampleApp() if __name__ == "__main__": + app = ExampleApp() app.run() diff --git a/docs/examples/guide/dom3.py b/docs/examples/guide/dom3.py index b90231fe3..e78ee5c05 100644 --- a/docs/examples/guide/dom3.py +++ b/docs/examples/guide/dom3.py @@ -20,6 +20,6 @@ class ExampleApp(App): ) -app = ExampleApp() if __name__ == "__main__": + app = ExampleApp() app.run() diff --git a/docs/examples/guide/dom4.css b/docs/examples/guide/dom4.css index 2f68d4160..d9169ee17 100644 --- a/docs/examples/guide/dom4.css +++ b/docs/examples/guide/dom4.css @@ -2,7 +2,7 @@ /* The top level dialog (a Container) */ #dialog { margin: 4 8; - background: $primary; + background: $panel; color: $text; border: tall $background; padding: 1 2; diff --git a/docs/examples/guide/dom4.py b/docs/examples/guide/dom4.py index 020133a26..dd12a4ea8 100644 --- a/docs/examples/guide/dom4.py +++ b/docs/examples/guide/dom4.py @@ -6,6 +6,8 @@ QUESTION = "Do you want to learn about Textual CSS?" class ExampleApp(App): + CSS_PATH = "dom4.css" + def compose(self) -> ComposeResult: yield Header() yield Footer() @@ -20,4 +22,6 @@ class ExampleApp(App): ) -app = ExampleApp(css_path="dom4.css") +if __name__ == "__main__": + app = ExampleApp() + app.run() diff --git a/docs/examples/guide/layout/center_layout.py b/docs/examples/guide/layout/center_layout.py index 973a256f0..0cf31c615 100644 --- a/docs/examples/guide/layout/center_layout.py +++ b/docs/examples/guide/layout/center_layout.py @@ -3,12 +3,14 @@ from textual.widgets import Static class CenterLayoutExample(App): + CSS_PATH = "center_layout.css" + def compose(self) -> ComposeResult: yield Static("One", id="bottom") yield Static("Two", id="middle") yield Static("Three", id="top") -app = CenterLayoutExample(css_path="center_layout.css") if __name__ == "__main__": + app = CenterLayoutExample() app.run() diff --git a/docs/examples/guide/layout/combining_layouts.py b/docs/examples/guide/layout/combining_layouts.py index 396b207ec..9dd34ab96 100644 --- a/docs/examples/guide/layout/combining_layouts.py +++ b/docs/examples/guide/layout/combining_layouts.py @@ -4,6 +4,8 @@ from textual.widgets import Static, Header class CombiningLayoutsExample(App): + CSS_PATH = "combining_layouts.css" + def compose(self) -> ComposeResult: yield Header() yield layout.Container( @@ -38,6 +40,6 @@ class CombiningLayoutsExample(App): print(self.stylesheet.variables["boost-lighten-2"]) -app = CombiningLayoutsExample(css_path="combining_layouts.css") if __name__ == "__main__": + app = CombiningLayoutsExample() app.run() diff --git a/docs/examples/guide/layout/dock_layout1_sidebar.py b/docs/examples/guide/layout/dock_layout1_sidebar.py index 9e0eced59..81eb94805 100644 --- a/docs/examples/guide/layout/dock_layout1_sidebar.py +++ b/docs/examples/guide/layout/dock_layout1_sidebar.py @@ -10,11 +10,13 @@ Docked widgets will not scroll out of view, making them ideal for sticky headers class DockLayoutExample(App): + CSS_PATH = "dock_layout1_sidebar.css" + def compose(self) -> ComposeResult: yield Static("Sidebar", id="sidebar") yield Static(TEXT * 10, id="body") -app = DockLayoutExample(css_path="dock_layout1_sidebar.css") if __name__ == "__main__": + app = DockLayoutExample() app.run() diff --git a/docs/examples/guide/layout/dock_layout2_sidebar.py b/docs/examples/guide/layout/dock_layout2_sidebar.py index cec0f931e..0da8f78c3 100644 --- a/docs/examples/guide/layout/dock_layout2_sidebar.py +++ b/docs/examples/guide/layout/dock_layout2_sidebar.py @@ -10,12 +10,14 @@ Docked widgets will not scroll out of view, making them ideal for sticky headers class DockLayoutExample(App): + CSS_PATH = "dock_layout2_sidebar.css" + def compose(self) -> ComposeResult: yield Static("Sidebar2", id="another-sidebar") yield Static("Sidebar1", id="sidebar") yield Static(TEXT * 10, id="body") -app = DockLayoutExample(css_path="dock_layout2_sidebar.css") +app = DockLayoutExample() if __name__ == "__main__": app.run() diff --git a/docs/examples/guide/layout/dock_layout3_sidebar_header.py b/docs/examples/guide/layout/dock_layout3_sidebar_header.py index eaa2a0b00..5967bda7f 100644 --- a/docs/examples/guide/layout/dock_layout3_sidebar_header.py +++ b/docs/examples/guide/layout/dock_layout3_sidebar_header.py @@ -10,12 +10,14 @@ Docked widgets will not scroll out of view, making them ideal for sticky headers class DockLayoutExample(App): + CSS_PATH = "dock_layout3_sidebar_header.css" + def compose(self) -> ComposeResult: yield Header(id="header") yield Static("Sidebar1", id="sidebar") yield Static(TEXT * 10, id="body") -app = DockLayoutExample(css_path="dock_layout3_sidebar_header.css") if __name__ == "__main__": + app = DockLayoutExample() app.run() diff --git a/docs/examples/guide/layout/grid_layout1.py b/docs/examples/guide/layout/grid_layout1.py index 35ea2e384..943f18cb7 100644 --- a/docs/examples/guide/layout/grid_layout1.py +++ b/docs/examples/guide/layout/grid_layout1.py @@ -3,6 +3,8 @@ from textual.widgets import Static class GridLayoutExample(App): + CSS_PATH = "grid_layout1.css" + def compose(self) -> ComposeResult: yield Static("One", classes="box") yield Static("Two", classes="box") @@ -12,6 +14,6 @@ class GridLayoutExample(App): yield Static("Six", classes="box") -app = GridLayoutExample(css_path="grid_layout1.css") if __name__ == "__main__": + app = GridLayoutExample() app.run() diff --git a/docs/examples/guide/layout/grid_layout2.py b/docs/examples/guide/layout/grid_layout2.py index ed8f697b7..1df6b5938 100644 --- a/docs/examples/guide/layout/grid_layout2.py +++ b/docs/examples/guide/layout/grid_layout2.py @@ -3,6 +3,8 @@ from textual.widgets import Static class GridLayoutExample(App): + CSS_PATH = "grid_layout1.css" + def compose(self) -> ComposeResult: yield Static("Oneeee", classes="box") yield Static("Two", classes="box") @@ -13,6 +15,6 @@ class GridLayoutExample(App): yield Static("Seven", classes="box") -app = GridLayoutExample(css_path="grid_layout1.css") if __name__ == "__main__": + app = GridLayoutExample() app.run() diff --git a/docs/examples/guide/layout/grid_layout3_row_col_adjust.py b/docs/examples/guide/layout/grid_layout3_row_col_adjust.py index e1a911005..c75a58da1 100644 --- a/docs/examples/guide/layout/grid_layout3_row_col_adjust.py +++ b/docs/examples/guide/layout/grid_layout3_row_col_adjust.py @@ -3,6 +3,8 @@ from textual.widgets import Static class GridLayoutExample(App): + CSS_PATH = "grid_layout3_row_col_adjust.css" + def compose(self) -> ComposeResult: yield Static("One", classes="box") yield Static("Two", classes="box") @@ -12,6 +14,6 @@ class GridLayoutExample(App): yield Static("Six", classes="box") -app = GridLayoutExample(css_path="grid_layout3_row_col_adjust.css") if __name__ == "__main__": + app = GridLayoutExample() app.run() diff --git a/docs/examples/guide/layout/grid_layout4_row_col_adjust.py b/docs/examples/guide/layout/grid_layout4_row_col_adjust.py index 62391b20f..f11a2d5b0 100644 --- a/docs/examples/guide/layout/grid_layout4_row_col_adjust.py +++ b/docs/examples/guide/layout/grid_layout4_row_col_adjust.py @@ -3,6 +3,8 @@ from textual.widgets import Static class GridLayoutExample(App): + CSS_PATH = "grid_layout4_row_col_adjust.css" + def compose(self) -> ComposeResult: yield Static("One", classes="box") yield Static("Two", classes="box") @@ -12,6 +14,6 @@ class GridLayoutExample(App): yield Static("Six", classes="box") -app = GridLayoutExample(css_path="grid_layout4_row_col_adjust.css") if __name__ == "__main__": + app = GridLayoutExample() app.run() diff --git a/docs/examples/guide/layout/grid_layout5_col_span.py b/docs/examples/guide/layout/grid_layout5_col_span.py index f9302621a..d7fe1cb83 100644 --- a/docs/examples/guide/layout/grid_layout5_col_span.py +++ b/docs/examples/guide/layout/grid_layout5_col_span.py @@ -3,6 +3,8 @@ from textual.widgets import Static class GridLayoutExample(App): + CSS_PATH = "grid_layout5_col_span.css" + def compose(self) -> ComposeResult: yield Static("One", classes="box") yield Static("Two [b](column-span: 2)", classes="box", id="two") @@ -12,6 +14,6 @@ class GridLayoutExample(App): yield Static("Six", classes="box") -app = GridLayoutExample(css_path="grid_layout5_col_span.css") if __name__ == "__main__": + app = GridLayoutExample() app.run() diff --git a/docs/examples/guide/layout/grid_layout6_row_span.py b/docs/examples/guide/layout/grid_layout6_row_span.py index 19cabbe5e..54630b081 100644 --- a/docs/examples/guide/layout/grid_layout6_row_span.py +++ b/docs/examples/guide/layout/grid_layout6_row_span.py @@ -3,6 +3,8 @@ from textual.widgets import Static class GridLayoutExample(App): + CSS_PATH = "grid_layout6_row_span.css" + def compose(self) -> ComposeResult: yield Static("One", classes="box") yield Static("Two [b](column-span: 2 and row-span: 2)", classes="box", id="two") @@ -12,6 +14,6 @@ class GridLayoutExample(App): yield Static("Six", classes="box") -app = GridLayoutExample(css_path="grid_layout6_row_span.css") +app = GridLayoutExample() if __name__ == "__main__": app.run() diff --git a/docs/examples/guide/layout/grid_layout7_gutter.py b/docs/examples/guide/layout/grid_layout7_gutter.py index 00f98e112..db916858c 100644 --- a/docs/examples/guide/layout/grid_layout7_gutter.py +++ b/docs/examples/guide/layout/grid_layout7_gutter.py @@ -3,6 +3,8 @@ from textual.widgets import Static class GridLayoutExample(App): + CSS_PATH = "grid_layout7_gutter.css" + def compose(self) -> ComposeResult: yield Static("One", classes="box") yield Static("Two", classes="box") @@ -12,6 +14,6 @@ class GridLayoutExample(App): yield Static("Six", classes="box") -app = GridLayoutExample(css_path="grid_layout7_gutter.css") if __name__ == "__main__": + app = GridLayoutExample() app.run() diff --git a/docs/examples/guide/layout/horizontal_layout.py b/docs/examples/guide/layout/horizontal_layout.py index cada52668..40997293f 100644 --- a/docs/examples/guide/layout/horizontal_layout.py +++ b/docs/examples/guide/layout/horizontal_layout.py @@ -3,12 +3,14 @@ from textual.widgets import Static class HorizontalLayoutExample(App): + CSS_PATH = "horizontal_layout.css" + def compose(self) -> ComposeResult: yield Static("One", classes="box") yield Static("Two", classes="box") yield Static("Three", classes="box") -app = HorizontalLayoutExample(css_path="horizontal_layout.css") if __name__ == "__main__": + app = HorizontalLayoutExample() app.run() diff --git a/docs/examples/guide/layout/horizontal_layout_overflow.py b/docs/examples/guide/layout/horizontal_layout_overflow.py index 8520c2b8b..b5be0e96d 100644 --- a/docs/examples/guide/layout/horizontal_layout_overflow.py +++ b/docs/examples/guide/layout/horizontal_layout_overflow.py @@ -3,12 +3,14 @@ from textual.widgets import Static class HorizontalLayoutExample(App): + CSS_PATH = "horizontal_layout_overflow.css" + def compose(self) -> ComposeResult: yield Static("One", classes="box") yield Static("Two", classes="box") yield Static("Three", classes="box") -app = HorizontalLayoutExample(css_path="horizontal_layout_overflow.css") if __name__ == "__main__": + app = HorizontalLayoutExample() app.run() diff --git a/docs/examples/guide/layout/layers.py b/docs/examples/guide/layout/layers.py index d26b5f18a..06afbd29a 100644 --- a/docs/examples/guide/layout/layers.py +++ b/docs/examples/guide/layout/layers.py @@ -3,11 +3,13 @@ from textual.widgets import Static class LayersExample(App): + CSS_PATH = "layers.css" + def compose(self) -> ComposeResult: yield Static("box1 (layer = above)", id="box1") yield Static("box2 (layer = below)", id="box2") -app = LayersExample(css_path="layers.css") if __name__ == "__main__": + app = LayersExample() app.run() diff --git a/docs/examples/guide/layout/offset.py b/docs/examples/guide/layout/offset.py index c55362ca4..738297307 100644 --- a/docs/examples/guide/layout/offset.py +++ b/docs/examples/guide/layout/offset.py @@ -12,6 +12,8 @@ class Box(Static): class OffsetExample(App): + CSS_PATH = "offset.css" + def compose(self) -> ComposeResult: yield layout.Container( Box(id="box1"), @@ -22,6 +24,6 @@ class OffsetExample(App): ) -app = OffsetExample(css_path="offset.css") if __name__ == "__main__": + app = OffsetExample() app.run() diff --git a/docs/examples/guide/layout/utility_containers.py b/docs/examples/guide/layout/utility_containers.py index 2ae40a2cc..fa44d0088 100644 --- a/docs/examples/guide/layout/utility_containers.py +++ b/docs/examples/guide/layout/utility_containers.py @@ -4,6 +4,8 @@ from textual.widgets import Static class UtilityContainersExample(App): + CSS_PATH = "utility_containers.css" + def compose(self) -> ComposeResult: yield layout.Horizontal( layout.Vertical( @@ -19,6 +21,6 @@ class UtilityContainersExample(App): ) -app = UtilityContainersExample(css_path="utility_containers.css") if __name__ == "__main__": + app = UtilityContainersExample() app.run() diff --git a/docs/examples/guide/layout/vertical_layout.py b/docs/examples/guide/layout/vertical_layout.py index 7c75dd592..233407ac3 100644 --- a/docs/examples/guide/layout/vertical_layout.py +++ b/docs/examples/guide/layout/vertical_layout.py @@ -3,12 +3,14 @@ from textual.widgets import Static class VerticalLayoutExample(App): + CSS_PATH = "vertical_layout.css" + def compose(self) -> ComposeResult: yield Static("One", classes="box") yield Static("Two", classes="box") yield Static("Three", classes="box") -app = VerticalLayoutExample(css_path="vertical_layout.css") if __name__ == "__main__": + app = VerticalLayoutExample() app.run() diff --git a/docs/examples/guide/layout/vertical_layout_scrolled.py b/docs/examples/guide/layout/vertical_layout_scrolled.py index 7adb2cc81..984040ef7 100644 --- a/docs/examples/guide/layout/vertical_layout_scrolled.py +++ b/docs/examples/guide/layout/vertical_layout_scrolled.py @@ -3,12 +3,14 @@ from textual.widgets import Static class VerticalLayoutScrolledExample(App): + CSS_PATH = "vertical_layout_scrolled.css" + def compose(self) -> ComposeResult: yield Static("One", classes="box") yield Static("Two", classes="box") yield Static("Three", classes="box") -app = VerticalLayoutScrolledExample(css_path="vertical_layout_scrolled.css") if __name__ == "__main__": + app = VerticalLayoutScrolledExample() app.run() diff --git a/docs/examples/guide/structure.py b/docs/examples/guide/structure.py index 11f285a74..fe1d3dea6 100644 --- a/docs/examples/guide/structure.py +++ b/docs/examples/guide/structure.py @@ -25,6 +25,6 @@ class ClockApp(App): yield Clock() -app = ClockApp() if __name__ == "__main__": + app = ClockApp() app.run() diff --git a/docs/examples/guide/styles/border01.py b/docs/examples/guide/styles/border01.py index 232478bc3..6cc5aada5 100644 --- a/docs/examples/guide/styles/border01.py +++ b/docs/examples/guide/styles/border01.py @@ -22,6 +22,6 @@ class BorderApp(App): self.widget.styles.border = ("heavy", "yellow") -app = BorderApp() if __name__ == "__main__": + app = BorderApp() app.run() diff --git a/docs/examples/guide/styles/box_sizing01.py b/docs/examples/guide/styles/box_sizing01.py index 6b1757220..af1e5ef62 100644 --- a/docs/examples/guide/styles/box_sizing01.py +++ b/docs/examples/guide/styles/box_sizing01.py @@ -33,6 +33,6 @@ class BoxSizing(App): self.widget2.styles.box_sizing = "content-box" -app = BoxSizing() if __name__ == "__main__": + app = BoxSizing() app.run() diff --git a/docs/examples/guide/styles/colors.py b/docs/examples/guide/styles/colors.py index b8115776c..5abfaf861 100644 --- a/docs/examples/guide/styles/colors.py +++ b/docs/examples/guide/styles/colors.py @@ -12,6 +12,6 @@ class WidgetApp(App): self.widget.styles.border = ("heavy", "white") -app = WidgetApp() if __name__ == "__main__": + app = WidgetApp() app.run() diff --git a/docs/examples/guide/styles/colors01.py b/docs/examples/guide/styles/colors01.py index 4c9af2b4a..401f9becb 100644 --- a/docs/examples/guide/styles/colors01.py +++ b/docs/examples/guide/styles/colors01.py @@ -19,6 +19,6 @@ class ColorApp(App): self.widget3.styles.background = Color(191, 78, 96) -app = ColorApp() if __name__ == "__main__": + app = ColorApp() app.run() diff --git a/docs/examples/guide/styles/colors02.py b/docs/examples/guide/styles/colors02.py index 51d7f005c..80b480e4e 100644 --- a/docs/examples/guide/styles/colors02.py +++ b/docs/examples/guide/styles/colors02.py @@ -15,6 +15,6 @@ class ColorApp(App): widget.styles.background = Color(191, 78, 96, a=alpha) -app = ColorApp() if __name__ == "__main__": + app = ColorApp() app.run() diff --git a/docs/examples/guide/styles/dimensions01.py b/docs/examples/guide/styles/dimensions01.py index 4f1292659..ed479f0f3 100644 --- a/docs/examples/guide/styles/dimensions01.py +++ b/docs/examples/guide/styles/dimensions01.py @@ -22,6 +22,6 @@ class DimensionsApp(App): self.widget.styles.height = 10 -app = DimensionsApp() if __name__ == "__main__": + app = DimensionsApp() app.run() diff --git a/docs/examples/guide/styles/dimensions02.py b/docs/examples/guide/styles/dimensions02.py index 769086fe2..339aade99 100644 --- a/docs/examples/guide/styles/dimensions02.py +++ b/docs/examples/guide/styles/dimensions02.py @@ -22,6 +22,6 @@ class DimensionsApp(App): self.widget.styles.height = "auto" -app = DimensionsApp() if __name__ == "__main__": + app = DimensionsApp() app.run() diff --git a/docs/examples/guide/styles/dimensions03.py b/docs/examples/guide/styles/dimensions03.py index f7a41293c..4d361227e 100644 --- a/docs/examples/guide/styles/dimensions03.py +++ b/docs/examples/guide/styles/dimensions03.py @@ -22,6 +22,6 @@ class DimensionsApp(App): self.widget.styles.height = "80%" -app = DimensionsApp() if __name__ == "__main__": + app = DimensionsApp() app.run() diff --git a/docs/examples/guide/styles/dimensions04.py b/docs/examples/guide/styles/dimensions04.py index 1cff8f651..405b5545e 100644 --- a/docs/examples/guide/styles/dimensions04.py +++ b/docs/examples/guide/styles/dimensions04.py @@ -25,6 +25,6 @@ class DimensionsApp(App): self.widget2.styles.height = "1fr" -app = DimensionsApp() if __name__ == "__main__": + app = DimensionsApp() app.run() diff --git a/docs/examples/guide/styles/margin01.py b/docs/examples/guide/styles/margin01.py index 1453d0ca5..7036cb725 100644 --- a/docs/examples/guide/styles/margin01.py +++ b/docs/examples/guide/styles/margin01.py @@ -27,6 +27,6 @@ class MarginApp(App): self.widget2.styles.margin = 2 -app = MarginApp() if __name__ == "__main__": + app = MarginApp() app.run() diff --git a/docs/examples/guide/styles/outline01.py b/docs/examples/guide/styles/outline01.py index dc120d227..cd77d0b8c 100644 --- a/docs/examples/guide/styles/outline01.py +++ b/docs/examples/guide/styles/outline01.py @@ -22,6 +22,6 @@ class OutlineApp(App): self.widget.styles.outline = ("heavy", "yellow") -app = OutlineApp() if __name__ == "__main__": + app = OutlineApp() app.run() diff --git a/docs/examples/guide/styles/padding01.py b/docs/examples/guide/styles/padding01.py index f87bdae73..92c68948a 100644 --- a/docs/examples/guide/styles/padding01.py +++ b/docs/examples/guide/styles/padding01.py @@ -22,6 +22,6 @@ class PaddingApp(App): self.widget.styles.padding = 2 -app = PaddingApp() if __name__ == "__main__": + app = PaddingApp() app.run() diff --git a/docs/examples/guide/styles/padding02.py b/docs/examples/guide/styles/padding02.py index 2900d78fe..50bf0b940 100644 --- a/docs/examples/guide/styles/padding02.py +++ b/docs/examples/guide/styles/padding02.py @@ -22,6 +22,6 @@ class PaddingApp(App): self.widget.styles.padding = (2, 4) -app = PaddingApp() if __name__ == "__main__": + app = PaddingApp() app.run() diff --git a/docs/examples/guide/styles/screen.py b/docs/examples/guide/styles/screen.py index 77caa300d..5a7b85fd7 100644 --- a/docs/examples/guide/styles/screen.py +++ b/docs/examples/guide/styles/screen.py @@ -7,6 +7,6 @@ class ScreenApp(App): self.screen.styles.border = ("heavy", "white") -app = ScreenApp() if __name__ == "__main__": + app = ScreenApp() app.run() diff --git a/docs/examples/guide/styles/widget.py b/docs/examples/guide/styles/widget.py index b8115776c..5abfaf861 100644 --- a/docs/examples/guide/styles/widget.py +++ b/docs/examples/guide/styles/widget.py @@ -12,6 +12,6 @@ class WidgetApp(App): self.widget.styles.border = ("heavy", "white") -app = WidgetApp() if __name__ == "__main__": + app = WidgetApp() app.run() diff --git a/docs/examples/light_dark.py b/docs/examples/light_dark.py deleted file mode 100644 index be4351258..000000000 --- a/docs/examples/light_dark.py +++ /dev/null @@ -1,19 +0,0 @@ -from textual.app import App -from textual.widgets import Button - - -class ButtonApp(App): - - DEFAULT_CSS = """ - Button { - width: 100%; - } - """ - - def compose(self): - yield Button("Lights off") - - def on_button_pressed(self, event): - self.dark = not self.dark - self.bell() - event.button.label = "Lights ON" if self.dark else "Lights OFF" diff --git a/docs/examples/simple.css b/docs/examples/simple.css deleted file mode 100644 index cf9a4a448..000000000 --- a/docs/examples/simple.css +++ /dev/null @@ -1,14 +0,0 @@ -Screen { - background: darkblue; - color: white; - layout: vertical; - align: center middle; -} -Static { - height: auto; - padding: 2; - margin: 2; - border: white; - background: #ffffff 30%; - content-align: center middle; -} diff --git a/docs/examples/simple.py b/docs/examples/simple.py deleted file mode 100644 index b4784ccd5..000000000 --- a/docs/examples/simple.py +++ /dev/null @@ -1,11 +0,0 @@ -from textual.app import App, ComposeResult -from textual.widgets import Static - - -class TextApp(App): - def compose(self) -> ComposeResult: - yield Static("Hello") - yield Static("[b]World![/b]") - - -app = TextApp(css_path="simple.css") diff --git a/docs/examples/tutorial/stopwatch.py b/docs/examples/tutorial/stopwatch.py index 2fae5fa7f..72e9e7139 100644 --- a/docs/examples/tutorial/stopwatch.py +++ b/docs/examples/tutorial/stopwatch.py @@ -71,6 +71,8 @@ class Stopwatch(Static): class StopwatchApp(App): """A Textual app to manage stopwatches.""" + CSS_PATH = "stopwatch.css" + BINDINGS = [ ("d", "toggle_dark", "Toggle dark mode"), ("a", "add_stopwatch", "Add"), @@ -100,6 +102,6 @@ class StopwatchApp(App): self.dark = not self.dark -app = StopwatchApp(css_path="stopwatch.css") if __name__ == "__main__": + app = StopwatchApp() app.run() diff --git a/docs/examples/tutorial/stopwatch01.py b/docs/examples/tutorial/stopwatch01.py index dd1940332..9f9a76043 100644 --- a/docs/examples/tutorial/stopwatch01.py +++ b/docs/examples/tutorial/stopwatch01.py @@ -17,6 +17,6 @@ class StopwatchApp(App): self.dark = not self.dark -app = StopwatchApp() if __name__ == "__main__": + app = StopwatchApp() app.run() diff --git a/docs/examples/tutorial/stopwatch02.py b/docs/examples/tutorial/stopwatch02.py index f76e4e8d1..ab1e843e1 100644 --- a/docs/examples/tutorial/stopwatch02.py +++ b/docs/examples/tutorial/stopwatch02.py @@ -34,6 +34,6 @@ class StopwatchApp(App): self.dark = not self.dark -app = StopwatchApp() if __name__ == "__main__": + app = StopwatchApp() app.run() diff --git a/docs/examples/tutorial/stopwatch03.py b/docs/examples/tutorial/stopwatch03.py index 5b390a087..7b879673a 100644 --- a/docs/examples/tutorial/stopwatch03.py +++ b/docs/examples/tutorial/stopwatch03.py @@ -21,6 +21,7 @@ class Stopwatch(Static): class StopwatchApp(App): """A Textual app to manage stopwatches.""" + CSS_PATH = "stopwatch03.css" BINDINGS = [("d", "toggle_dark", "Toggle dark mode")] def compose(self) -> ComposeResult: @@ -34,6 +35,6 @@ class StopwatchApp(App): self.dark = not self.dark -app = StopwatchApp(css_path="stopwatch03.css") if __name__ == "__main__": + app = StopwatchApp() app.run() diff --git a/docs/examples/tutorial/stopwatch04.py b/docs/examples/tutorial/stopwatch04.py index 536fd7d6a..8ad6e7cc3 100644 --- a/docs/examples/tutorial/stopwatch04.py +++ b/docs/examples/tutorial/stopwatch04.py @@ -28,6 +28,7 @@ class Stopwatch(Static): class StopwatchApp(App): """A Textual app to manage stopwatches.""" + CSS_PATH = "stopwatch04.css" BINDINGS = [("d", "toggle_dark", "Toggle dark mode")] def compose(self) -> ComposeResult: @@ -41,6 +42,6 @@ class StopwatchApp(App): self.dark = not self.dark -app = StopwatchApp(css_path="stopwatch04.css") if __name__ == "__main__": + app = StopwatchApp() app.run() diff --git a/docs/examples/tutorial/stopwatch05.py b/docs/examples/tutorial/stopwatch05.py index 3bdba5cd8..b2281515b 100644 --- a/docs/examples/tutorial/stopwatch05.py +++ b/docs/examples/tutorial/stopwatch05.py @@ -48,6 +48,7 @@ class Stopwatch(Static): class StopwatchApp(App): """A Textual app to manage stopwatches.""" + CSS_PATH = "stopwatch04.css" BINDINGS = [("d", "toggle_dark", "Toggle dark mode")] def compose(self) -> ComposeResult: @@ -61,6 +62,6 @@ class StopwatchApp(App): self.dark = not self.dark -app = StopwatchApp(css_path="stopwatch04.css") if __name__ == "__main__": + app = StopwatchApp() app.run() diff --git a/docs/examples/tutorial/stopwatch06.py b/docs/examples/tutorial/stopwatch06.py index 260a287c2..04a609322 100644 --- a/docs/examples/tutorial/stopwatch06.py +++ b/docs/examples/tutorial/stopwatch06.py @@ -71,6 +71,7 @@ class Stopwatch(Static): class StopwatchApp(App): """A Textual app to manage stopwatches.""" + CSS_PATH = "stopwatch04.css" BINDINGS = [("d", "toggle_dark", "Toggle dark mode")] def compose(self) -> ComposeResult: @@ -84,6 +85,6 @@ class StopwatchApp(App): self.dark = not self.dark -app = StopwatchApp(css_path="stopwatch04.css") if __name__ == "__main__": + app = StopwatchApp() app.run() diff --git a/docs/examples/widgets/button.py b/docs/examples/widgets/button.py index f32602579..aa152a921 100644 --- a/docs/examples/widgets/button.py +++ b/docs/examples/widgets/button.py @@ -3,7 +3,9 @@ from textual.app import App, ComposeResult from textual.widgets import Button, Static -class ButtonsApp(App): +class ButtonsApp(App[str]): + CSS_PATH = "button.css" + def compose(self) -> ComposeResult: yield layout.Horizontal( layout.Vertical( @@ -24,11 +26,11 @@ class ButtonsApp(App): ), ) - def on_button_pressed(self, _event: Button.Pressed) -> None: + def on_button_pressed(self, event: Button.Pressed) -> None: self.app.bell() + self.exit(str(event.button)) -app = ButtonsApp(css_path="button.css") - if __name__ == "__main__": - result = app.run() + app = ButtonsApp() + print(app.run()) diff --git a/docs/getting_started.md b/docs/getting_started.md index 0962c18c2..c2a4f3dab 100644 --- a/docs/getting_started.md +++ b/docs/getting_started.md @@ -2,7 +2,7 @@ All you need to get started building Textual apps. ## Requirements -Textual requires Python 3.7 or later. Textual runs on Linux, MacOS, Windows and probably any OS where Python also runs. +Textual requires Python 3.7 or later (if you have a choice, pick the most recent Python). Textual runs on Linux, MacOS, Windows and probably any OS where Python also runs. !!! info inline end "Your platform" diff --git a/docs/guide/CSS.md b/docs/guide/CSS.md index 610bb5176..ded358811 100644 --- a/docs/guide/CSS.md +++ b/docs/guide/CSS.md @@ -111,7 +111,7 @@ Both Header and Footer are children of the Screen object. To further explore the DOM, we're going to build a simple dialog with a question and two buttons. To do this we're going import and use a few more builtin widgets: -- `texual.layout.Container` For our top-level dialog. +- `textual.layout.Container` For our top-level dialog. - `textual.layout.Horizontal` To arrange widgets left to right. - `textual.widgets.Static` For simple content. - `textual.widgets.Button` For a clickable button. @@ -140,13 +140,13 @@ You may recognize some of the elements in the above screenshot, but it doesn't q ## CSS files -To add a stylesheet we pass the path to the app with the `css_path` parameter: +To add a stylesheet set the `CSS_PATH` classvar to a relative path: -```python hl_lines="23" +```python hl_lines="9" --8<-- "docs/examples/guide/dom4.py" ``` -You may have noticed that some of the constructors have additional keyword argument: `id` and `classes`. These are used by the CSS to identify parts of the DOM. We will cover these in the next section. +You may have noticed that some of the constructors have additional keyword arguments: `id` and `classes`. These are used by the CSS to identify parts of the DOM. We will cover these in the next section. Here's the CSS file we are applying: diff --git a/docs/guide/app.md b/docs/guide/app.md index d90da56e8..7e828cf4e 100644 --- a/docs/guide/app.md +++ b/docs/guide/app.md @@ -10,6 +10,7 @@ The first step in building a Textual app is to import the [App][textual.app.App] --8<-- "docs/examples/app/simple01.py" ``` + ### The run method To run an app we create an instance and call [run()][textual.app.App.run]. @@ -153,9 +154,9 @@ Textual apps can reference [CSS](CSS.md) files which define how your app and wid The chapter on [Textual CSS](CSS.md) describes how to use CSS in detail. For now lets look at how your app references external CSS files. -The following example sets the `css_path` attribute on the app: +The following example enables loading of CSS by adding a `CSS_PATH` class variable: -```python title="question02.py" hl_lines="15" +```python title="question02.py" hl_lines="6" --8<-- "docs/examples/app/question02.py" ``` @@ -172,7 +173,9 @@ When `"question02.py"` runs it will load `"question02.css"` and update the app a ### Classvar CSS -While external CSS files are recommended for most applications, and enable some cool features like *live editing* (see below), you can also specify the CSS directly within the Python code. To do this you can set the `CSS` class variable on the app which contains the CSS content. +While external CSS files are recommended for most applications, and enable some cool features like *live editing*, you can also specify the CSS directly within the Python code. + +To do this set a `CSS` class variable on the app to a string containing your CSS. Here's the question app with classvar CSS: diff --git a/docs/guide/devtools.md b/docs/guide/devtools.md index 140554268..e6bb72ac6 100644 --- a/docs/guide/devtools.md +++ b/docs/guide/devtools.md @@ -118,9 +118,8 @@ class LogApp(App): def on_mount(self): self.log(self.tree) -app = LogApp() if __name__ == "__main__": - app.run() + LogApp.run() ``` diff --git a/docs/guide/events.md b/docs/guide/events.md index 1eea90333..2098f5cfe 100644 --- a/docs/guide/events.md +++ b/docs/guide/events.md @@ -1,13 +1,189 @@ -## Events +# Events and Messages -TODO: events docs +We've used event handler methods in many of the examples in this guide. This chapter explores [events](../events/index.md) and messages (see below) in more detail. -- What are events -- Handling events -- Auto calling base classes -- Event bubbling -- Posting / emitting events +## Messages + +Events are a particular kind of *message* sent by Textual in response to input and other state changes. Events are reserved for use by Textual but you can also create custom messages for the purpose of coordinating between widgets in your app. + +More on that later, but for now keep in mind that events are also messages, and anything that is true of messages is true of events. + +## Message Queue + +Every [App][textual.app.App] and [Widget][textual.widget.Widget] object contains a *message queue*. You can think of a message queue as orders at a restaurant. The chef takes an order and makes the dish. Orders that arrive while the chef is cooking are placed in a line. When the chef has finished a dish they pick up the next order in the line. + +Textual processes messages in the same way. Messages are picked off a queue and processed (cooked) by a handler method. This guarantees messages and events are processed even if your code can not handle them right way. + +This processing of messages is done within an asyncio Task which is started when you mount the widget. The task monitors a queue for new messages and dispatches them to the appropriate handler when they arrive. + +!!! tip + + The FastAPI docs have an [excellent introduction](https://fastapi.tiangolo.com/async/) to Python async programming. + +By way of an example, let's consider what happens if you were to type "Text" in to a `TextInput` widget. When you hit the ++t++ key, Textual creates a [key][textual.events.Key] event and sends it to the widget's message queue. Ditto for ++e++, ++x++, and ++t++. + +The widget's task will pick the first message from the queue (a key event for the ++t++ key) and call the `on_key` method with the event as the first argument. In other words it will call `TextInput.on_key(event)`, which updates the display to show the new letter.
---8<-- "docs/images/test.excalidraw.svg" +--8<-- "docs/images/events/queue.excalidraw.svg"
+ +When the `on_key` method returns, Textual will get the next event from the the queue and repeat the process for the remaining keys. At some point the queue will be empty and the widget is said to be in an *idle* state. + +!!! note + + This example illustrates a point, but a typical app will be fast enough to have processed a key before the next event arrives. So it is unlikely you will have so many key events in the message queue. + +
+--8<-- "docs/images/events/queue2.excalidraw.svg" +
+ + +## Default behaviors + +You may be familiar with Python's [super](https://docs.python.org/3/library/functions.html#super) function to call a function defined in a base class. You will not have to use this in event handlers as Textual will automatically call handler methods defined in a widget's base class(es). + +For instance, let's say we are building the classic game of Pong and we have written a `Paddle` widget which extends [Static][textual.widgets.Static]. When a [Key][textual.events.Key] event arrives, Textual calls `Paddle.on_key` (to respond to ++left++ and ++right++ keys), then `Static.on_key`, and finally `Widget.on_key`. + +### Preventing default behaviors + +If you don't want this behavior you can call [prevent_default()][textual.message.Message.prevent_default] on the event object. This tells Textual not to call any more handlers on base classes. + +!!! warning + + You won't need `prevent_default` very often. Be sure to know what your base classes do before calling it, or you risk disabling some core features builtin to Textual. + +## Bubbling + +Messages have a `bubble` attribute. If this is set to `True` then events will be sent to a widget's parent after processing. Input events typically bubble so that a widget will have the opportunity to respond to input events if they aren't handled by their children. + +The following diagram shows an (abbreviated) DOM for a UI with a container and two buttons. With the "No" button [focused](#), it will receive the key event first. + +
+--8<-- "docs/images/events/bubble1.excalidraw.svg" +
+ +After Textual calls `Button.on_key` the event _bubbles_ to the button's parent and will call `Container.on_key` (if it exists). + +
+--8<-- "docs/images/events/bubble2.excalidraw.svg" +
+ +As before, the event bubbles to it's parent (the App class). + +
+--8<-- "docs/images/events/bubble3.excalidraw.svg" +
+ +The App class is always the root of the DOM, so there is no where for the event to bubble to. + +### Stopping bubbling + +Event handlers may stop this bubble behavior by calling the [stop()][textual.message.Message.stop] method on the event or message. You might want to do this if a widget has responded to the event in an authoritative way. For instance when a text input widget responds to a key event it stops the bubbling so that the key doesn't also invoke a key binding. + +## Custom messages + +You can create custom messages for your application that may be used in the same way as events (recall that events are simply messages reserved for use by Textual). + +The most common reason to do this is if you are building a custom widget and you need to inform a parent widget about a state change. + +Let's look at an example which defines a custom message. The following example creates color buttons which—when clicked—send a custom message. + +=== "custom01.py" + + ```python title="custom01.py" hl_lines="10-15 27-29 42-43" + --8<-- "docs/examples/events/custom01.py" + ``` +=== "Output" + + ```{.textual path="docs/examples/events/custom01.py"} + ``` + + +Note the custom message class which extends [Message][textual.message.Message]. The constructor stores a [color][textual.color.Color] object which handler methods will be able to inspect. + +The message class is defined within the widget class itself. This is not strictly required but recommended, for these reasons: + +- It reduces the amount of imports. If you import `ColorButton`, you have access to the message class via `ColorButton.Selected`. +- It creates a namespace for the handler. So rather than `on_selected`, the handler name becomes `on_color_button_selected`. This makes it less likely that your chosen name will clash with another message. + + +## Sending events + +In the previous example we used [emit()][textual.message_pump.MessagePump.emit] to send an event to it's parent. We could also have used [emit_no_wait()][textual.message_pump.MessagePump.emit_no_wait] for non async code. Sending messages in this way allows you to write custom widgets without needing to know in what context they will be used. + +There are other ways of sending (posting) messages, which you may need to use less frequently. + +- [post_message][textual.message_pump.MessagePump.post_message] To post a message to a particular widget. +- [post_message_no_wait][textual.message_pump.MessagePump.post_message_no_wait] The non-async version of `post_message`. + + +## Message handlers + +Most of the logic in a Textual app will be written in message handlers. Let's explore handlers in more detail. + +### Handler naming + +Textual uses the following scheme to map messages classes on to a Python method. + +- Start with `"on_"`. +- Add the messages namespace (if any) converted from CamelCase to snake_case plus an underscore `"_"` +- Add the name of the class converted from CamelCase to snake_case. + +
+--8<-- "docs/images/events/naming.excalidraw.svg" +
+ +### Handler arguments + +Message handler methods can be written with or without a positional argument. If you add a positional argument, Textual will call the handler with the event object. The following handler (taken from custom01.py above) contains a `message` parameter. The body of the code makes use of the message to set a preset color. + +```python + def on_color_button_selected(self, message: ColorButton.Selected) -> None: + self.screen.styles.animate("background", message.color, duration=0.5) +``` + +If the body of your handler doesn't require any information in the message you can omit it from the method signature. If we just want to play a bell noise when the button is clicked, we could write our handler like this: + +```python + def on_color_button_selected(self) -> None: + self.app.bell() +``` + +This pattern is a convenience that saves writing out a parameter that may not be used. + +### Async handlers + +Message handlers may be coroutines. If you prefix your handlers with the `async` keyword, Textual will `await` them. This lets your handler use the `await` keyword for asynchronous APIs. + +If your event handlers are coroutines it will allow multiple events to be processed concurrently, but bear in mind an individual widget (or app) will not be able to pick up a new message from its message queue until the handler has returned. This is rarely a problem in practice; as long has handlers return within a few milliseconds the UI will remain responsive. But slow handlers might make your app hard to use. + +!!! info + + To re-use the chef analogy, if an order comes in for beef wellington (which takes a while to cook), orders may start to pile up and customers may have to wait for their meal. The solution would be to have another chef work on the wellington while the first chef picks up new orders. + +Network access is a common cause of slow handlers. If you try to retrieve a file from the internet, the message handler may take anything up to a few seconds to return, which would prevent the widget or app from updating during that time. The solution is to launch a new asyncio task to do the network task in the background. + +Let's look at an example which looks up word definitions from an [api](https://dictionaryapi.dev/) as you type. + +!!! note + + You will need to install [httpx](https://www.python-httpx.org/) with `pip install httpx` to run this example. + +=== "dictionary.py" + + ```python title="dictionary.py" hl_lines="28" + --8<-- "docs/examples/events/dictionary.py" + ``` +=== "dictionary.css" + + ```python title="dictionary.css" + --8<-- "docs/examples/events/dictionary.css" + ``` + +=== "Output" + + ```{.textual path="docs/examples/events/dictionary.py" press="tab,t,e,x,t,_,_,_,_,_,_,_,_,_,_,_"} + ``` + +Note the highlighted line in the above code which calls `asyncio.create_task` to run coroutine in the background. Without this you would find typing in to the text box to be unresponsive. diff --git a/docs/guide/styles.md b/docs/guide/styles.md index ecf337bbe..f2b12e39a 100644 --- a/docs/guide/styles.md +++ b/docs/guide/styles.md @@ -206,7 +206,7 @@ The same units may also be used to set limits on a dimension. The following styl - [min-width](../styles/min_width.md) sets a minimum width. - [max-width](../styles/max_width.md) sets a maximum width. - [min-height](../styles/min_height.md) sets a minimum height. -- [max-height](../styles/max_hright.md) sets a maximum height. +- [max-height](../styles/max_height.md) sets a maximum height. ### Padding diff --git a/docs/images/events/bubble1.excalidraw.svg b/docs/images/events/bubble1.excalidraw.svg new file mode 100644 index 000000000..f4b79d101 --- /dev/null +++ b/docs/images/events/bubble1.excalidraw.svg @@ -0,0 +1,16 @@ + + + eyJ2ZXJzaW9uIjoiMSIsImVuY29kaW5nIjoiYnN0cmluZyIsImNvbXByZXNzZWQiOnRydWUsImVuY29kZWQiOiJ4nO1bbVPa2lx1MDAxNv7ur3C4X3pnarrfX85M54yioFSxVk+tPZ5xYlx1MDAxMiElJDRcdCDt9L/fXHUwMDE1UFx1MDAxMt5cdTAwMDIqcHBu80Eh2eysvfZ6nv2slZ2fW9vbhbjXclxuf2xcdTAwMTece8v0XFw7NLuFt8n5jlx1MDAxM0Zu4MMl0v9cdTAwMWVcdTAwMDXt0Oq3rMdxK/rj3bumXHUwMDE5Npy45ZmWY3TcqG16Udy23cCwguY7N3aa0Z/J36rZdN63gqZcdTAwMWSHRnqTXHUwMDFkx3bjIFx1MDAxY9zL8Zym48dcdTAwMTH0/jd8397+2f+bsc52zWbg2/3m/Vx1MDAwYql5nODxs9XA75uKOUKcMCT1sIVcdTAwMWLtw91ix4bLd2Cxk15JTlx1MDAxNXrRt6vuXHUwMDE34pu8yI/l/snt58reSXrbO9fzzuOeN3CEadXboZNejeIwaDiXrlx1MDAxZNeTu4+dXHUwMDFm/i5cbsBcdTAwMDfpr8KgXav7Tlx1MDAxNI38JmiZllx1MDAxYveSc1xiXHLPmn6t30d65j6ZIcVcciQ0JZprLDVVw6vJ77UhMeJcdTAwMTQrjSTmmo3bVVxmPJhcYrDrP6h/pJbdmlajXHUwMDA25vl22kZcdTAwMTFL48yYu4+jVdRgjFx1MDAxMlwiwVxmqlx1MDAxMeHDJnXHrdXjpFxyIYZCTCjJXHUwMDA3t8qY4vSnhGtFqVx1MDAxNul8JbdvXHUwMDFk2f3Q+GfcoXUzbD04rlx1MDAxMCVfMqYnVlx1MDAxZozHVTa2MpNOxFWl7Fx1MDAxZlQ+fyzvX1rfj3ul8/tw2NdIIMbOfVxcXHUwMDE4Xvj19ne3M7tcdTAwMWRp/XbRXHUwMDFiLmituL+6b1x1MDAxZvPDkPpnJdwrnXlfet3p1pphXHUwMDE4dDP9PnxKo6ndss1cdTAwMDEjYCEoSyiDS8SG1z3Xb8BFv+156bnAaqQkspUxeIK7RsafIS5G0fjZR+JcIohSXHUwMDA0WOApiOZcdTAwMTFX/vRtKnFplENcXFx1MDAwMlx1MDAxOVx1MDAwMlx1MDAxMyBcdTAwMGLBXHUwMDA2zPVcdTAwMTLiikPTj1pmXGJ8MIW85HzyXCJcdTAwMTNkRVx1MDAxMJFMJ3S2fLrKj05O5Vx1MDAxM6IzXHKCwI/P3Vx1MDAxZv2lUVx1MDAxOFx1MDAxYyuGiIBBaI24XHUwMDFjaVUym67XXHUwMDFimdd+XHUwMDE4g+W7rdab/2ZdXHUwMDFkOWDCYLlcdTAwMWRpvOu5tSTOXHUwMDBiXHUwMDE2XGbKXHRHIFx1MDAxMLsgXHUwMDA0hlxymq5te5lwtMBcdTAwMDJcdTAwMTP6XGaPXHUwMDE2WZOD0K25vuldjFx1MDAxOJhcdTAwMGLJXHUwMDAxJUzBpFwiszGJwfGYscyiNVx1MDAwZpP5JLWhmKRSXHUwMDFhhDIsZKJcdTAwMTVENjL6XHUwMDFkMGJwwCsgUilBJScrQyU1XHUwMDE0cCSTQlxugShXelxuKqk2XHUwMDE0xVopLjSGcJ5cdTAwMDAp5lxcwigofjpG+6Y+XHUwMDFio09bQTJ2mGG85/q269fgYrr0ParkRTDRR7HVTqzcXHUwMDAxhlx1MDAwNYBzjlxiU8BcdTAwMWNEZFx1MDAxYdXMVlx1MDAxMvRcdTAwMDZcdTAwMTeKSFx1MDAwNbHNlCZYPDRcdTAwMTiuwFx1MDAwNce355tUvPlcdTAwMDbS8NI8s8t2T/rt3a87++VZJjGsMdZIYyqJXHUwMDEyRLFcdKswg+mHmcNEXHUwMDEzglx1MDAwNPydMMszo7hcdTAwMTg0m25cZs7/XHUwMDE4uH487uS+N3dcdTAwMTO011x1MDAxZNNcdTAwMWW/XG7Dyl5cdTAwMWKnhVbS46h4TD9tp7Dpf1x1MDAxOX7+5+3U1juzozk5JuI47W8r+39cdTAwMTajhY5cdTAwMTVcdTAwMGbwPIXVXGK4eFx1MDAxNq1cdTAwMDGSXHRcdTAwMDaxsbjSyJ/nXHJlNaKUQSVcdTAwMTJIJ1x1MDAwYp5iZIzVNJBcdTAwMWWiSFx1MDAwM2q1TtbF1WlccpHOxZDGVKp8XHUwMDFleFx1MDAwYphVipHVZi2pkGp8iM5kpV5FOLBkLL+dWl9PXp5cXHjNXHUwMDFmn2/+wlx1MDAxZr2DYlxye3Xkur1ytJhcXM/t97LyudM9ZvsnxyG3yz3SJmxfLKFfcmlcdTAwMWZcdTAwMWSWXHUwMDFh1onaZfii6Z1cdTAwMWX4X2tL6HdF7n1d3TbE5VGn1PqEb9pRvdHhJXRXtf/vnPuCXGZ2vebOy+On33BBa0vlxoUon3+7u6yfdSp+3Tv+XHUwMDE27CzBXHUwMDBi91fki/zavjmpoHL5XHUwMDE2k2bN6Z0tqT7AJFx1MDAxMZCOrro+QIhW46dcdTAwMWZXbYq51ELRxXOR/LDY1FVb07xVXHUwMDFiUjJDrmnV5lNW7Uxq9LBqKyk4XHUwMDE4K+g6K1x1MDAwMkxohTR6QjxOr1xiLFpcdTAwMDEoPqbnb6795IJrv79OKvReULsuXFz704tcdTAwMDOZPHGkOOA5d6PR/6TSwFx1MDAxYy06Xlx1MDAxYZhr+fM1NkWKzkIrRlxcI0GzYTFcdTAwMGaunVx1MDAxYoJlLf7c2bPo0W3ZP2qflXv/Llxc+Ty0YkFcZqIxpDmSUsGoXHUwMDFhRSucMrhmSlx1MDAwMVx1MDAxMFx1MDAwNWFMrlx1MDAwZaxcdTAwMTkwpFx1MDAxMluMg5VgjDBkY5lq31o09sVheFOMnfaN3K1Wrq7qny5+XHUwMDFjfvitsZelsVfk3tfV7ao09uvywqo09uvygqf3iuq2XFxkRSGc84tcdTAwMGb3tVJpg72w/JRgXlx1MDAwNjN9IGm3XHUwMDBmn3JcdTAwMTSYwpqwpyiwXFyhMSsjoCSjcMc1XHUwMDA2wVRRgejiXHUwMDFhI3/+NlVjyHyNodelMdRcdTAwMTSNISc0htKYScroXG52NMxcdTAwMGJH/IRwfFlCsNeO48B/k5xcdTAwMWLo6uvClVx1MDAxM11cdTAwMTfeXHUwMDBlvnXM0DX9XHUwMDE4pHbUtixcdTAwMTjd7CxBjna+pCxhjphcdTAwMWXPXHUwMDEynjecXFxE56dcdTAwMGV49lNHjFx1MDAwNYQ8hPvimf7ljYjrxdZt1W+ffqrY9ztcdTAwMDeXZ/VNz/SpVlx1MDAwNoaoXHUwMDE1QkHSz4SczFx1MDAxZJCAbjjTjJOV7lx1MDAwNVgsecCISkQ5ZWtOXHUwMDFl0MfK4Un7qnL48axcdTAwMTL39lx1MDAwZXo8OPF/J1x1MDAwZstKXHUwMDFlVuTe19XtqpKH1+WFVSVcdTAwMGavy1x1MDAwYqtKXHUwMDFlXpdcdTAwMTde8DjhmTnJ9IGk3T58yntKwUEkp09cdTAwMTBWlpPgmTlcdFGCXHUwMDEzQcjie1x1MDAwYvKnb0O1XHUwMDBiQzRfu+i1aZdcdTAwMDWTXHUwMDEypSmiXHUwMDAyr0C6LDNcdTAwMWWXnpRUgylcIt5cdTAwMDG8huvOSOZo9Fx1MDAwNTKSeWPJXHUwMDA188z9j1jJmc9cdTAwMWMx0kJLxjPhPVx1MDAwZs75tLmhcKaKXHUwMDE5QiCtklx1MDAwMoLi2YpK/6Gjklx1MDAwNlx1MDAxNZJizYHeOFErrDFgXGaWXGJGXHUwMDE4p5RQwtkkulx1MDAwNTe45lopRGjyglx1MDAwN1x1MDAxZFx1MDAwNztnyXNi8ZyNRM/fXHUwMDAw+Vx1MDAwMrAvuFx1MDAwMXLh3YbIYJgqrFx1MDAwNeVIJvOVaTPYaUhcZlxmPoZlilxuLlx1MDAxNOTakztcclx1MDAxN9pcdTAwMDCZXHUwMDBm6lx1MDAxMZO4XHUwMDEwyVx1MDAwZUBcdTAwMDSrXHUwMDA1pJFcbk/YXHUwMDA0M4+0XHUwMDA0vIE9SMBcZuNcdJte0+7H2ZGcXHUwMDFjXHUwMDEzMZx2t5X9/1xmOpstTmBcdTAwMDKoktn8fVx1MDAxZZvlXHUwMDE3pjeVzSQxINDAXHUwMDEzXGYpxHXqj1x1MDAwMZkpQzCMOaeKXHUwMDBi/qJXw+ZQXHUwMDE5NVx1MDAxOMijxFx1MDAwNM4kKKUpVEZcZlx1MDAwMcJcdTAwMDR0iVJcdTAwMTIxltnv/Vh0oUpcYs1AvKyXzJgmXHUwMDE5sfQvktlcdTAwMGVQXHUwMDA3lVx1MDAwMCTMQEpKJsgkdYCjKbhZUVxuLCM0aM7n0Vl+1XTMqMQmXHUwMDA07UEkSEz0hFEw/UQgcCeiXHUwMDE45CdWr5rOdmaHc3JMXHUwMDA28lx1MDAxM1x0LbdcXCwzr7OOcVx1MDAxYeeYwaLCXHUwMDE3L1x1MDAxNvNcdTAwMWatfetL7XDvwlx1MDAxM7FC3S46vmttOqdcdEZcckWJgHDjXHUwMDEyKzZZK9ZUKFhQYGXNvlT2nPddmSWcO87YJKVcdTAwMTGR9pxcdTAwMTaKM1vQXHUwMDFlOEtCqqVhTp7xXGJoXHUwMDFlZ1xyw2pKyaLt69L9j6/V71cq+u53j3ixcVJ9eSWkKE87ptM+/G7+1Y0vT2k1qsYzXHUwMDFl+i6pXHUwMDEyMn0gabePiJrN36BcdTAwMDKUeMrjsFxccM6qhEiSkzrBIVx1MDAwNVx1MDAxNotcdTAwMDMzf/o2XHUwMDE2mCpcdTAwMGaYmsHStCRg5qpccsKnQJNMpEZcdTAwMThcdTAwMDNXcs7Uup/OPjFcdTAwMWPTWU9cdTAwMGIhmUeGI4WQdJCPhVx1MDAxMKeT2GR8cHpvXHUwMDFhTu/9deHiujDjXHUwMDA1Tj3y46W9wDlnkVx1MDAxOa92TDd4gMmtXHUwMDA3oFx1MDAxN8xW6zxcdTAwMDa/XHUwMDBlXHUwMDA1XGZMnWs/OCf1ZaHjOt29Kbx+1z+SXvs4T1x1MDAwMOUkXHUwMDEz9/PX1q//XHUwMDAxXHUwMDA3vCMgIn0= + + + + App()Container( id="dialog")Button( "Yes", variant="success")Button( "No", variant="error")events.Key(key="T") \ No newline at end of file diff --git a/docs/images/events/bubble2.excalidraw.svg b/docs/images/events/bubble2.excalidraw.svg new file mode 100644 index 000000000..e3e4d2079 --- /dev/null +++ b/docs/images/events/bubble2.excalidraw.svg @@ -0,0 +1,16 @@ + + + eyJ2ZXJzaW9uIjoiMSIsImVuY29kaW5nIjoiYnN0cmluZyIsImNvbXByZXNzZWQiOnRydWUsImVuY29kZWQiOiJ4nO1cXG1T4spcdTAwMTL+7q+wOF/2Vq3ZeX85VVu3XHUwMDE01PXdVVddr6e2YohcdTAwMTBcdFx0Jlx1MDAwMcSt/e+ngyxJeFx0iODi3U1ZXHUwMDAymaHT09P9zNOdXHTfV1ZXXHUwMDBiUadhXHUwMDE3/l4t2Fx1MDAwZpbpOuXAbFx1MDAxN97H51t2XHUwMDEwOr5cdTAwMDdNpPs59JuB1e1ZjaJG+PeHXHUwMDBmdTOo2VHDNS3baDlh03TDqFl2fMPy61x1MDAxZpzIrof/jf9cdTAwMWaadftjw6+Xo8BILrJml53IXHUwMDBmnq5lu3bd9qJcdTAwMTCk/1x1MDAwZj6vrn7v/k9pV3bMuu+Vu927XHKJekKiwbOHvtdVVWpMJNOc9js4YVx0Llx1MDAxNtllaL1cdTAwMDWF7aQlPlVwS+dccr0vNre3qvdRdHrepHf1teSqt47rnkZcdTAwMWT3yVx1MDAwZaZVbVx1MDAwNnbSXHUwMDFhRoFfsy+cclSFdjxwvv+90Fx1MDAwN1x1MDAxMyTfXG78ZqXq2WGY+Y7fMC0n6sTnUDI+06t0ZSRnXHUwMDFl4lx1MDAxZVx1MDAxOFx1MDAxYlgozjiTQlLBkvF2es1cXCiKNSWSQC86oFnRd2EmQLO/UPdIdLsxrVpcdTAwMDVcdTAwMTT0yklcdTAwMWZFLI1To27/XHUwMDFjr6JcdTAwMDZjlFx1MDAxMEmJplx1MDAxYVx1MDAxMd7vUrWdSjWK+1x1MDAxMGIoxISS/OlSKSPZ3UlRQlDCiEh0jK/f2Cl3neOfQZtWzaDRs10hjD+kdI/V3lx1MDAxY/SstHel5t1sX3ok2tza31x1MDAxMZfhiSutVl3gvqyMK0b2Q1ToN/x4nyf24XBcdTAwMTe7Zpl9uSi192osujQv9uhosWZcdTAwMTD47WnlLkjd31xcbKb3+2kvmIjtvUuctNkom09Yg8GtXHUwMDE54kRwOPrtruPVoNFrum5yzrdqXHQ8raT0XHUwMDFkXHUwMDAyxYyeKUTkaixcIjKlkYbwTHSYhIj5Vl5aRFx1MDAxNLmIKIjBJII5QfLliFx1MDAxOFx1MDAwNaZcdTAwMTc2zFx1MDAwMHBmXHUwMDA0KsrJqEiGUJAqzVxilkLPXHUwMDFmXHUwMDA15+mdiVx1MDAxN/hedOo82l1ZXHUwMDA2x4ohXCJcdTAwMTCRWiMuM722zLrjdjJcdTAwMTPbdWPQfL3RePeftKVDXHUwMDFiVOjK5JnO665Tif28YMGg7CBcdTAwMTNcdTAwMDKRXHUwMDAzXGaj36HulMtuylx1MDAxZi3QwFx1MDAwNJnBzjSrvVx1MDAxZjhcdTAwMTXHM92zjIK5IfmE4iNiUlx1MDAwYjYuJqmG6eaYTc9S8peVJY1JgpBBXHUwMDE0xKRElFx0hjHLxCSh2kCEMM41XHUwMDA355dcXCwsJpGhpeSKgzaMyVx1MDAxMVx1MDAwMcm4QVx1MDAxNVx1MDAxMlxuaU0wk1SKwVx1MDAwMMVUUIlcdTAwMTVHM/CUrqazRiggXGKZJULDyFxmolxyxys7Xlx1MDAwNVx1MDAxYZN17yf5niZcIroxbDXDrlxyXHUwMDExo1xu0JMpXHUwMDAwUoKFZDzVrWI24oXIoFx1MDAxOMGUY1x1MDAwNeingIj3OvRcdTAwMTfggu2VJyvFOo9cdTAwMWN92l5v75OrWqd0XCK+XFw0ySil1kArXHJTg5HATFxizaRcdTAwMWVWXG5TQ1x1MDAxMVx1MDAwNViHOcFYa4yHtHLNMCr69bpcdTAwMTOB9Y99x4tcdTAwMDat3DXnelx1MDAxY+xV2yxcdTAwMGa2wqjSbYOo0IglZilp8m41XHSb7of++3/ej+492pnjY9iNXHUwMDEzYSvp13FoXHUwMDE22Fb0XHUwMDE0zCNcdTAwMTCNUDpcdTAwMTbSMIQvl1qpXHUwMDA0KiZhWv4kLymmQXppYIUhX0GUUKF1lmdcdTAwMTCtXGZCMSyGXHUwMDE4QStTfECzOfJcZpFgVFx1MDAxZseUXHUwMDFhwi2CtITVJoV6r5Jfbd7W6N3mbadxb53csk7rlG6ffVre/Opi97zV3melg/2Al7c7pElYScxBLrko73zaqllcdTAwMDdqneGzunu06V1V5iB3QeZ9W2Jr4mKntdU4wd+aYbXW4lvo9rD8x7hLLfaRblx1MDAxZu/fsiNyXiu5XHUwMDFi9p44q1x1MDAxZOzOo0Bycllj1YOz/a/0+HHnq/ulxYLSi+ROKlx1MDAwZYw2UFwi9ueCm0PuuEB44cVcdTAwMDFC2fhlWyhcdTAwMTmTXGKS5J2Tlu18v1jWZZuSvGWbXHUwMDAyRZSvtGzzXHUwMDExy3YqZe4v20RLyqRIxvtcblx1MDAwNVx1MDAwMaZcdTAwMTTCXHUwMDFhP8MjR1x1MDAxN1x1MDAwNKYtXHUwMDAwXHUwMDE0f2bn7669uMEpf7yOK/+uX7kuXFx7o2tcdTAwMDOcZOT0U3/Xvs36/7MqXHUwMDAzXHUwMDEz2OhgZWCi5rPTbHDG8fc3XGLTXGLy0OnD9ZN9ZNPHc+fh6/bxSXX7xrNcdTAwMWXto19cdTAwMWKufGK0XHUwMDFhXHUwMDE4XHUwMDExXHUwMDAx2CgohFx1MDAwMYCTyEQrXHUwMDEz3Fx1MDAxMMCyIVx1MDAxOedap1x1MDAwYlhzXHUwMDBmVo2Gg1VcctdcdTAwMDY0xZhS9dr3ME7XnMvS/tq3b0FJ31xir3VPXHUwMDAzbP3h2PPi2Fx1MDAwYjLv21x1MDAxMrsojv22rOBeXHUwMDE2vfXO1n2FXHUwMDE3afXIosXjqIh+PyvojaK62S6yolx1MDAxMPbp2d5DZWurvbxWWFSqMXd1J2VcdTAwMWGjL5iI7b2bJ6/LpS/jMlxySphcdTAwMWE8nTBcdTAwMTeluKY0YbqTmEu+mZeTuYgsc8lmXHUwMDE5TKLX4i1qXHUwMDA0b1x1MDAxOXFPQ1NcdTAwMWRXilOT8n+YZGw0o8j33sXnnrj6deGrXHUwMDFkXlx1MDAxN94/fWqZgWN6XHUwMDEx0PewaVkwuvGZh8xcbp9T5jGBoVx1MDAwZmZcdTAwMWWzXHInN54npCNCjlx1MDAwYmrOXHUwMDE44/g5NzLXLiufxVWntLPjXHUwMDFjuvbnzm7n7mHpq1x1MDAwN4RcbkNThFx1MDAxNCVcXGlAuYG4hnxcdTAwMDTBeYw4U9BXysVcdTAwMDX2dFx0XHSDMVx0qVx1MDAxN1A7yKWK+uiIq8+HzZ3L5teaf2Fe3W3JP+nIvNKRXHUwMDA1mfeNiV1QOvK2rLCodOSNWWFB6cjbssL8b3wsSN1JWc7oXHUwMDBiJmJ775Ygy+Fjs1x1MDAxY6KB4Ovn3E7JN/OyXHUwMDEyXCKGc1x0XHUwMDExJDqvRYimzHRcdTAwMDRcdTAwMTJUKM5cdTAwMTdQoV3qTOfQXHUwMDFmkVx1MDAxOdiAXHUwMDAzwWunOVx1MDAxM5j/XHUwMDE0ac6kseRG89h9mlx1MDAwNOHxt0fBwbHkWj5j93QuXHUwMDFjL2s8XHUwMDEzajBcdLFEhGSMZm+3UKVcZsA0QZiIN/nSXHUwMDA1XHUwMDA2M8aGXHUwMDEwglx1MDAxMcYpJYAtbDi2IdeK94tCZFx1MDAwMdBcIonpUKgrgCNGOZmhqDH7Rs1cdTAwMTeE+pRcdTAwMWI1p95cdTAwMTOJXGaGYfhgXHUwMDAyKjhHhKhUp6dcdTAwMWSRxMBgZULiXHUwMDFlQilGSa/HM/dp5sd0RicuXHUwMDA0LFx1MDAxNTzeXHRMJUpcdTAwMTC6r1x1MDAxM8w90lJoXHT6IFx1MDAwMXP8tndpjvfl+Fx1MDAxOPLiRNxK+vXZaIY104Onkz2aSkpYtNn0ezTzS+jLWYMlYHkpkFx1MDAwNk+iUjCW2lx1MDAxM/lcdTAwMDRn2oh3XG5cdTAwMGLEqKZcdTAwMDIrNqDYPPFcZmBVXHUwMDExrVx1MDAxMEw2k0IlO1x1MDAxN1x1MDAxMjwjhlx1MDAwMColMFdKXCLGdKoq3Fx1MDAwMzREXHUwMDAwk1x1MDAxNVEzlHNmXHUwMDA3NPjHuUx86Vx1MDAxN1x1MDAwMtpcdTAwMWGgXHUwMDA3zKRgmDGAdSZIqtNcdTAwMTN4gJ0pWFlRXG44I7RmM248z6/FXHUwMDBl6Fx1MDAxNKuEgFx1MDAxZmDALZxQ/tXUvnNcIrrPXHUwMDFjUayUxupNXHUwMDAz2tp4b46PYT9+JqTlXHUwMDE2oWFix6NcdTAwMWFnXHUwMDA0ol1PX4Qu31x1MDAxY1/c3947l6XPx7e6yuT5oW3+WlSjk1BccixvSLA6XHUwMDAx6ytcdTAwMDbeNLwnRlx1MDAwYlx1MDAwZcu6XHUwMDEyWCP2omdp/mKWsG85Y8OQRkSCpklcdTAwMDE6wbVcdTAwMWVmcZhcdTAwMTNccvrMsOl8XHUwMDEyZPXdakTNorTl7IR8XHUwMDE37Z5cdTAwMWNcdTAwMWY+3lhHlebGWvHlJZaiPGqZdvPTvfmlXHUwMDFkXVx1MDAxY9HD8DDam0OJZe7qTiqxjL7glNo6n3evLm4qdrBn1qnliK90s/FtOiv8XHUwMDA0gDz6XGZ/iWstqHQj5djKXHJGgoLLajZ9qpc/fctcbiMyXHUwMDE3RjQ3WFx1MDAxYUZcdTAwMTaX7KWraMmDscPpXHUwMDFjQLtcdTAwMDI6J39B5Wam5+5SlVx1MDAxYoIyZ/uVm2QoPys3divWydizO+9qdufjdeHsujDmyVid+fLcnoydsCZcdTAwMGWWZ0YrPPtcdTAwMDKvUyvWYE1cdTAwMTWmgrDnZC3ty9ZR5+BTZJ5vr31ztrfq7EBtLntcclx1MDAwNlJcdTAwMTFDQqIo4u0jXFxcdTAwMTA+UIVBkDJcbowhhWNAhNGLXHUwMDAy8+VcdTAwMGI8dIOo1LM8r/6SXHUwMDA13lx1MDAxNlx1MDAxYid3ev2uuVtad+W3dus4OKsv71x1MDAwMr8gdecudlx1MDAxMm9cdTAwMTh9wd+HNyg9dkc+iZ+Fxlx1MDAxMLfT3/LJn76lhSeRXHUwMDBiT5RcdTAwMWJoXvA0XHUwMDE33iBjXHUwMDEywyVdwHOvf3hDwlx1MDAxYiastXPgXHJja52pZ6NcdTAwMDb3pXFcdTAwMDSrXHUwMDEzXHUwMDE208dkPkg9KybJq8UkV8JAkGjHv66VpfFcdTAwMWNcdTAwMTkqrktROX6TqS3iavDsgSjhXHUwMDFhXHUwMDA0UTzqXHUwMDA3brgwQC/IXHUwMDFmXHUwMDA0RfG2XzlcXNVkQmtMkX7d2zRwSZz6XHUwMDE1g/lXNfN59Gr6llxiXHUwMDAxnGRIi/hX0SBcdTAwMTVcdTAwMWLxc1x1MDAxYVx1MDAxOEBVXHUwMDAzmGI4YmuyXodnVjXzY3RAJ+B1Or6nT1x1MDAwNJNsSCNhXHUwMDAwwnVnlOk4W6ZDXHUwMDFhvama5rBcdTAwMGZ3T1x1MDAwZrtvXCJpJf36bFwiMb6MyblShKR/X2ZcdTAwMTJmSeteXHUwMDFkXFzV/eKRf3/X1vqiendcdTAwMTUuP2ZJXHUwMDAz+Fx1MDAwM9aKgWdjNlx1MDAwMFxcSFx1MDAxYZpJQYVWWDGxuC3yPFlcdTAwMWJcdTAwMTJcdTAwMTYxjFI0vlx1MDAxZFx0gfeqv8slXHUwMDA00UrNhFJTsIjhfSM3zZub9Fx1MDAxMp+mXHIq03vavSCR31x1MDAxOMdcdTAwMTgyo1x1MDAxOKRcdTAwMDc9TZ5ia6VcdTAwMTe3XHUwMDA1s9E4jcBCfYiDSXDKvWEm8lxuLcdub4zIdm+7Ryy1XHUwMDFir3Fk2PFcdTAwMTR8/7Hy419iJnwqIn0= + + + + App()Container( id="dialog")Button( "Yes", variant="success")Button( "No", variant="error")events.Key(key="T")events.Key(key="T")bubble \ No newline at end of file diff --git a/docs/images/events/bubble3.excalidraw.svg b/docs/images/events/bubble3.excalidraw.svg new file mode 100644 index 000000000..afc97dc2f --- /dev/null +++ b/docs/images/events/bubble3.excalidraw.svg @@ -0,0 +1,16 @@ + + + eyJ2ZXJzaW9uIjoiMSIsImVuY29kaW5nIjoiYnN0cmluZyIsImNvbXByZXNzZWQiOnRydWUsImVuY29kZWQiOiJ4nO1cXGtT4lhcdTAwMTP+7q+w2C/zVlxy2XO/bNXWW4p3XHUwMDFkXHUwMDFkXHUwMDA1dZzXLStAhFxmgWBcdTAwMTK8zNb+97dcdTAwMGYqXHS3XHUwMDEwlTgwO1QpkFx1MDAxYzqdPt1Pnu7Tyd8rq6uF6KHrXHUwMDE0/lgtOPc123PrgX1X+Gi23zpB6PpcdTAwMWTYRfrfQ79cdTAwMTfU+iObUdRccv/4/fe2XHUwMDFktJyo69k1x7p1w57thVGv7vpWzW//7kZOO/yv+X9ot50/u367XHUwMDFlXHUwMDA1VnyQolN3Iz94PJbjOW2nXHUwMDEzhSD9f/B9dfXv/v+EdnXXbvuden94f0esXHUwMDFl13p066Hf6auKmWBMak3jXHUwMDExbrhcdTAwMDFHi5w67L5cdTAwMDaNnXiP2VRAZVxc/LZ3vr7+5UpUrtTa3XkobuPDXrueV45cdTAwMWW8R0PYtWYvcOK9YVx1MDAxNPgt59ytR01z9JHtg9+FPtgg/lXg91x1MDAxYc2OXHUwMDEzhkO/8bt2zY1cdTAwMWXMNoRcdTAwMDZb7U6jLyPeclx1MDAwZt+KmEhLIaQ5ZZxJitRgd19cdTAwMDDllmJKI0a1YFxu61x1MDAxMcVKvlx1MDAwNzNcdTAwMDGK/Yb6r1i1ql1rNUC/Tj1cdTAwMWWjSE3jxEnfPZ+uolx1MDAxNmOUXHUwMDEwSVx0WFx1MDAxY1x1MDAxMT5cdTAwMTjSdNxGMzJjXGJcdTAwMDE9mVCSP1x1MDAxZSphI6c/J1hJolx05yreY1x1MDAxNOju1vve8deoTZt20H2yXSE0X1x1MDAxMspcdTAwMWK9N0ddK+leiXnvKSEu9q/0fveb+vL15vtR8M0hXHUwMDAzWUO+XHUwMDE4OfdRYbDjn4+/xP4kYodGf8x6wKzaXHUwMDFlRrf35Vx1MDAwYreoP92cVnfOTlx1MDAxZZwvXHUwMDA3k7W1g8C/S8h9+lx1MDAxNPt+r1u3XHUwMDFmIVxmXHUwMDBiQVx1MDAxOeJEUarkYL/ndlqws9PzvHibX2vFqLeSUHhcZmyHzj+JtEhMRVrEXHUwMDE4w0igOOhnIW369C0u0pI0pFXCklx1MDAxY1x1MDAxM1x1MDAwMFn2ZqSNXHUwMDAyu1x1MDAxM3btXHUwMDAw4GtcdTAwMDLaytloS8bRXHUwMDE1SSFcYvxcIlZsbug6T/eMvcDvRGX3e9/FhMWxYohcYkTgmo64XHUwMDFjXHUwMDFhtWW3Xe9haGL7flxmmq91u1x1MDAxZv6TNHXogFxufZl8aPCa5zaMo1x1MDAxN2pwUk4wXHUwMDE0XHUwMDAzkVx1MDAwYtRlMKDt1utewlx1MDAxZmuggVxyMoPdLCzCXHUwMDBm3Ibbsb3KkIKpMfmIXHRcdTAwMTOCXHUwMDEyI6KmRaVcIkozJjDOXHUwMDFllKkotahBSYVFXGJFhHCFNNA9OVx1MDAxNJREUPBcdTAwMWNcdTAwMDAnJoFYYIJZflFpSawxVlxcXHRkXFyejFx1MDAwNyUjXHUwMDE2XHUwMDE1lFJcYlxcRVx1MDAxNUpQ0+dcdTAwMTiVmFx1MDAxMcpwwjczx2hf1dfG6Fx1MDAxMJq9IEbDyFx1MDAwZaJ1t1N3O1xy2Fx1MDAxOV/7nnl9lpjoR3GtZ7QsXCJcdTAwMGJcIlxcMiVcdTAwMTUgLONcdTAwMWMmViXGNeyusaOFsWCYXHUwMDFhsFVgcfI0YHBcdTAwMTUuOJ36bK22909Pd13S+7z9cNw624nOTsrlL5O0XHUwMDAypVx1MDAwMDypQDA/iiNcdTAwMDPwMeZcdTAwMGW00lx1MDAxNlKUXHUwMDBiialWiFA5ppRnh1HJb7fdXGKs/9l3O9GolfvmXFwz4d507ProXjip5L5RXFzoXHUwMDFhicNkN/60XHUwMDFhx03/y+DzX1x1MDAxZieOLk51Z/NcdTAwMWFz5FjcSvJ9XHUwMDFholx1MDAwNU4teoznXHSoRijlo5ufUY0gpYngmtLMsJY+y4tcbmuYUEsyXG54QJnJ31hsXHUwMDEyI4FiZmkuIaWD2Vx1MDAxMZrlSDZETPxcdTAwMDZApmKweEIuXHKhylx1MDAxMCM5kIs0Zu2fXHUwMDE3T2+6p9WOOjhu3n1cdTAwMGbsi1wiZ29PL7pF50SSXHLt7jKt9nuHLba9s5eNsKfKPd87u707YFx1MDAxYp9cdTAwMGVcdTAwMDJe334gPcI2xFx1MDAxY+SS8/ruzlar9kmtMVxcaXtHm52vjTnIzcm8yyW2Jc53b7e6J/iqXHUwMDE3Nlu3fFx1MDAwYl1cdTAwMWbW/3XGfUNcdTAwMGX7XHUwMDEzWSHqXu00Nq+0s1x1MDAxOVRxsX5cdTAwMWKG3l4wXHUwMDA3KyCnsvnJ82XjqHm/s394sulT725cdTAwMTGtO6tOMvmAsdhnejCVjDLNgcfH5Dmnelx1MDAwNrDsqSRcdTAwMDNcdTAwMGItXHT8yewkI93OXHUwMDBiSzKwSiVcdTAwMTlcdTAwMTRZ7H1IXHUwMDA2n0AyXHUwMDEySf5cdTAwMTPJgFx1MDAxY85cdTAwMTQxWDwv71DBeHRI/Fx1MDAwMoecXFzByFqxKD2XXHUwMDEzPlxcdsxcdTAwMGW3/uelWVx1MDAwM/H8xmXhsjO5mMHJkJxBrcJzrofd/0WljFx1MDAxOdR5tJQxU/PUSE3NXHQopmRauCpIXyVjQmaO1kP3XHUwMDA2bzU66/dcdTAwMDeoev39SFKvVKr/2GjlM4OVMG0pXHUwMDAyXHUwMDE5L1wiWFxuotVwsDJcdTAwMDU5XHUwMDE505JJzjWwcZFfsGo0XHUwMDFlrEqMXHUwMDA2K1NcdTAwMDIyYczeOSNwTnmVVuAlO8Xt1s3DWsA3rn5lXHUwMDA088pcYnIy73KJzSsjWC4r5JVcdTAwMTEsl1x1MDAxNTy9XlLV7Vx1MDAxMitcdOGUK/v3ja2teTD3nNTNK4FZlkmblb9MPmAs9unTXHUwMDBmz18oYdNbXySmlFx1MDAwYqqzM6J0Oy8sI2LpjEi+XHUwMDE3I1JcdTAwMTNcdTAwMTiRXHUwMDFjY0RKaES1UD91+rLei1wiv/PBbHvMXHUwMDAyLlx1MDAwYlx1MDAxN054Wfj4+O3WXHUwMDBlXFy7XHUwMDEzQWJcdTAwMTD2ajU4u+k5jVx1MDAxY1x1MDAxNj6nnGZcdTAwMDb3XHUwMDFmzWledzqpIT0j0Vx1MDAxMVPjmmjNMKTj2fss1Oej3fXjXHUwMDBi965q22F5u/LlU/PsfvHLXHUwMDEy1IJ4RVxcYoI1XHUwMDExmqmRuMaWwtysWULSQ4XKL64zZjpCaa6QeOe2tWtSo7h3Ujyon8pcdTAwMTLueC1ug9Bfmc6cMp2czLtcXGLzynSWy1xueWU6y2WFvDKd5bJCXis1y2KFWVx01ORcdTAwMDPGYp8+LUBcdTAwMDLFU1x1MDAxMijJJWGSZb93IN3Oi8q01FxmoiXei2hlS6BcdTAwMTjTjCgt/m1cdNShPyHhcFx1MDAwMF2C986eZiRcdTAwMTRcdTAwMTmyp1nnklx1MDAxYcxTO2FcdMJpy7mYMcp59rwpXHUwMDFk5Fx1MDAxNzWaibRcdTAwMTinlEqJXHUwMDA0I5QmXG5ccv1wRtzChGAlsemkppLnXHUwMDE3z1x1MDAxOFtCgFx1MDAxMkZcdTAwMWZcdTAwMDJQy8bDW3CLa66V6ZXUSGI6XHUwMDFh7Vx1MDAwMExCICXly6P99b2wL7/6JPSY1lx1MDAwYlx1MDAxYveRMkw5XHUwMDAxX6RiSmsrsTCYjVx1MDAxMDNCKMVoou8yS/fq0+DZnbCxTmBlXHUwMDBlXHQsolxmfFx1MDAwMsWoO9BcdCZcdTAwMTNpKbRcdTAwMDR9kIBJw9N0mlxmXHUwMDBmYzotUyPsdFc2rzEnjsWtJN9f3tqvp9d3KTiQubsxO56lV/1cdTAwMTdcdTAwMTXPqDbBgFx1MDAxOdicXHUwMDEygHBcdTAwMWRfQ1x1MDAxZvFMWFRcdTAwMGJcYiNNNVx1MDAxNXnecIOpXHUwMDA1XGZIK1x1MDAwNJPNpFBcdTAwMTN6+1x1MDAwNbGEpkhcdTAwMDBfUlx1MDAxMoGyXHR0fWIvXFxcIlx1MDAwZVx1MDAwMPOKXHUwMDA18Vx1MDAwNcWzXCKAXHUwMDA3NVxyOTA5nEgmkmD1iFx1MDAxZGA4XG5mU2ZBQlxinWgxylx0z4xORiWzJoBcdTAwMDG2cNySXHUwMDFjXHUwMDAzXHUwMDFhtYhAYFx1MDAxZkSxUlx1MDAxYatpOk0uXHUwMDE2LzWeXHUwMDE1pzuzeY278Vx1MDAwYlx1MDAxMS21uq3o9LtcYvshTjDJjmqVXHUwMDA3t1k+uHPuSifOt/Jaw1x0i9/2fyyq0VmgRihcdTAwMWVes1x1MDAxYcm4jPmxJNLgXHUwMDE5SvY0veZ2bVZcdTAwMTPONWdsXHUwMDFj0UhcIpmLK9sxTDzfj4SVuWmKklx1MDAxY+5HXHUwMDFh+NWEqkXt+vz4QNb3mq1cdTAwMWLvXHUwMDBivjj8fmJvbb29XHUwMDE4UpJHt7bT27mxT++i8yN6XHUwMDE4XHUwMDFlRvuTxb6odpOTunNcdTAwMTc7q3Yz+YCx2GdcdTAwMDBIudpcdTAwMDDyJlx1MDAxNk1yqt1IOb10g1x1MDAwMdZcdTAwMTBcdTAwMDeyllx1MDAxOUbSzbyoMFwiUmBcdTAwMDRi1sJcdFx1MDAxOHlcdTAwMTOKpDIjwifgXGJcdTAwMTlL5bBkXFzBgX5A4eZV1CdRuCFoaOugcFx1MDAxM5/Kc+HGuTU6WfvOw4eW8/DnZaFyWZhy67FcdTAwMWX68dxuPZ5xQVx1MDAxY63OTFb49Vd3nUjzx8KSYE2xTjzaY1ZYejdl9nnz/qHZ3tpu672d43DXX1/wsFx1MDAwNPSxuGKacHPNXHUwMDE0hI801Fx1MDAxM2KZZmVI/Vx1MDAxOXBmJN90N/LbL+8ms9LoVVx1MDAwYtdvubpfXHR0UdtZP946p3vVs/2Tln/8eWNxr+45qbssYmeRhslcdTAwMDfMqG2vWj/fYdXKzV6RrYn2UbVabspsc5aBjEhNaO5PRlE65W5lSLA4ZSp7TpM+fYuKejxcdTAwMTX1OLbk3FBvXHUwMDFldISYslx1MDAwMEf8XZ+EXHUwMDAy7kg5euuTUJaJjsy4gudNR8wjiaZGJqZKcYNcdTAwMGaZI3N9jbZcdTAwMTTfaWzfn5XOfMlC7yxoLXpcclx1MDAxNZtcdTAwMWGpXHUwMDEwXHUwMDFjklx1MDAwMY20XHUwMDEymlxyhSbm3JJcXHJwTZO64eRcIsyPICRcXDNO2KtcdTAwMTZ430JIPt/qYD3c6V03v29ffN3arGzc3PdcdTAwMTaXkOSk7nKJ3f3aq5xViN495Vx1MDAxN2frd07P35XeXCJcdTAwMWF3XHUwMDE2f5p8wFx1MDAxZs+fKFVEXHUwMDEynHsxXHUwMDA3J59cdTAwMDQ5XG7TXHUwMDE0XHUwMDAwQSRJ3CyUTp++RUVpjFNRWnGLzFxypedSz4G0kSMk87i5c55cdTAwMGW57Fxmalx1MDAwNueYXHUwMDAzg0p5ttz09WdJXHRcdTAwMTOcveDRcqkw9aKoJO9cdTAwMTaV5vZcItPywKnCiGAx0lx1MDAxZEeRtFx1MDAwNMdSIVxykavV9NuLXHUwMDFjIeVbgtI8fkxRhDnlXGaSK8YxmfC4XHUwMDA0XHUwMDAxWVx1MDAxNoP9XHUwMDE0eC2nVNCx9jmTnUlcdTAwMDRcdTAwMTDznlx1MDAxZDVPUfuq/rmMT5dLzzNWh5/jXHUwMDA2zF9rJMCI2DzCLNHN8bw4zCxBuVx1MDAxNppIhVx1MDAxOWj+3NPxwqfLpcfu6tCKNaJEKTgq4qbpR3MxrpayXHUwMDAwdDVkrlxcKUSVYGNaLdUqdJpP91x1MDAwN4y7cyxzJfn+Yr6RuJyNXHUwMDAwXHUwMDFiU5pcIk1Zdrpx4GyfXpVON4vnVcq/ke1cdTAwMTLZrp0sPLBJYVx1MDAxMbP2jzhcdTAwMDZGQYZxjUjz5DlOzJ2KXG6ihOXXJpgowMRkY6xvxviAIFi9a7VcdTAwMDbYXHUwMDE45TSvxaPxrt9qr1pNXHUwMDEygSS5UEOjs3byRn53XHUwMDFhr1x1MDAxODqLUVx1MDAxMvGkyWNsrTxFcMHudstcdTAwMTFYaFx1MDAwMHgwXHRu/ek0Y3mFW9e5W59QXHUwMDFhuO6/jNR+vJrIcMxcdTAwMTT8/c/KP/9cdTAwMDeoXHUwMDAzMlx1MDAwNiJ9 + + + + App()Container( id="dialog")Button( "Yes", variant="success")Button( "No", variant="error")events.Key(key="T")events.Key(key="T")events.Key(key="T")bubble \ No newline at end of file diff --git a/docs/images/events/naming.excalidraw.svg b/docs/images/events/naming.excalidraw.svg new file mode 100644 index 000000000..5a9a2fb4c --- /dev/null +++ b/docs/images/events/naming.excalidraw.svg @@ -0,0 +1,16 @@ + + + eyJ2ZXJzaW9uIjoiMSIsImVuY29kaW5nIjoiYnN0cmluZyIsImNvbXByZXNzZWQiOnRydWUsImVuY29kZWQiOiJ4nNVaa0/byFx1MDAxYf7eX1x1MDAxMeV8OStcdTAwMTV37pdKq1x1MDAxNbC0hZSKXHUwMDE2SludripjT1x1MDAxMlx1MDAxN8c29oTLVvz3845cdLGdXHUwMDFiJFx1MDAwNJaNXHUwMDA0iWcm9ut3nud5L86vXHUwMDE3rVbbXmWm/brVNpeBXHUwMDFmR2HuX7RfuvFzk1x1MDAxN1GawFx1MDAxNCmPi3SYXHUwMDA35cq+tVnx+tWrgZ+fXHUwMDFhm8V+YLzzqFx1MDAxOPpxYYdhlHpBOnhcdTAwMTVZMyj+cP8/+Fx1MDAwM/N7llx1MDAwZUKbe9VFNkxcdTAwMTjZNL+5lonNwCS2gLP/XHUwMDBmjlutX+X/mnW5XHSsn/RiU36hnKpcZqSMT45+SJPSWEyEIEghQcYrouJPuJ41IUx3wWZTzbih9uHRWXbGf36Sxu/wY3HOWYfH1WW7UVx1MDAxY1x1MDAxZtqruDSrSOFuqrnC5ump+Vx1MDAxMoW27649MT7+VuhcdTAwMTd9U/tanlx1MDAwZXv9xFx1MDAxNO7+0Xg0zfwgslfuRKhcdTAwMWG9cUJ93WXpXHUwMDAx5mkqJEOSY0mVqlx1MDAxY+JOQFx1MDAxNfVcdTAwMTRiWlx1MDAxMy2xkpLwXHTTttNcdTAwMTj2XHUwMDAyTPtcdTAwMGYqX5VtJ35w2lx1MDAwM1x1MDAwM5OwWtP1OeHg2GrVxeiWufaI1FIqxqjQRHAxXtI3Ua9vYVxymMqphlx1MDAxZKlcdTAwMTlhyt2QREmMqVx1MDAxYY+7XHUwMDBiZ7thiYu/Jr3Z9/Ns5LR2aWDNaHe4U1x1MDAwM1X15WFcdTAwMTb6N3uPhaCMYiYwl3Q8XHUwMDFmR8kpTCbDOK7G0uC0gks5ev1yXHUwMDA1nHIh5uGUaoKpVETcXHUwMDFiprvKbH3K2LtT8/VL9mZjiFx1MDAwZnW8/8xhypDwsFx1MDAwMjcgXHUwMDAxb0hKOVx1MDAwMVPmwYZIqplmgmPxIJRicqKUmIVSgpCHXHUwMDA1lkpywrRAWC2DUsw1sEgyjNaP09FEXHUwMDA1rNqGZ2pPXHUwMDA1vv3z8it786M3/FZcdTAwMWO9XHUwMDFkRuNzNVDo53l60Vx1MDAxZc9cXI8+zWdcdTAwMDHilMHNPlx0XHUwMDBiXHUwMDE0V/NYoCRBVFx1MDAwYszuzYKtg86eke92XHUwMDBlXHUwMDA2W+Kk0z00XHUwMDE355vZM2eBQMqTXHUwMDFjIaEoXHUwMDA1KFwiPEVcdTAwMDLFXGIjXHUwMDFhlNyJwsNYwFx1MDAwMmG6fFx1MDAxNlx1MDAwYjDhXHUwMDFlgFx1MDAxOPM6xu+Bf65cdTAwMTQhgj6GTC+C//bnz2FHXuxcdTAwMDdcdTAwMWb3tnl+2T/svDtGa4M/k6qGulx1MDAwN8Lfmks7XHUwMDBi+Vx1MDAxOOm5XHUwMDAxXHUwMDAwXHUwMDEyXHUwMDE1XGKcXGYtgX1fXHUwMDFl51x1MDAwN/tZxFx1MDAwZtOf4uJIbnx7n+C1Yn/iW3Xo45WgT1x1MDAxMfVcdTAwMTjSWiHIWIRqyj+XIMtcdTAwMWMxqTlnXHUwMDFhXHUwMDA06bGAr+g03jmaxLnETElIY8TyOC/cwYo4XHUwMDE3Nk63szOqTj7GfPPqfNOc7H5dXHUwMDEzzlx0oYIqslx1MDAwNM4rNKWJPYz+NmX4bIy+8Vx1MDAwN1F81YBESVx1MDAwMDBw3z81Rcv2TWtgbD9ccr8nPnwqXG6/Z1p9P1x0Y5PXN7EwYJC7XHUwMDAyo41TbcZRz/GnXHUwMDFkm26TWDaCemI8bdOa01x1MDAwMzDNh9Plu+HkLaZ51ItcdTAwMTI/PlrCzJVcYi/lXFy+Q6AjIFx1MDAwN7yWRdzF9zefd97KLOb9y1x1MDAxZPb+7eCg8377p37efGeMe1x1MDAwNFx1MDAwM6khmDHBVDPUQcrhQSjhXHUwMDA0SSYg4j1apNOVqC4gPKFgiUtcdTAwMGKflvCPmddcdTAwMTFcdTAwMDI7oKpcdTAwMWJ6dMKPWJNAzV9cdTAwMDBOzPfkv+nQmrxcdTAwMTXEflH8tlx1MDAxNNtcdTAwMDPwXl0g1sf3u6xcXInsXHUwMDAyycnRMdlcdTAwMTXVUNjo+3M97n56XHUwMDFmn3X2985+fOufpztcdTAwMWaO9o7X24RYO9dcdTAwMDUlnlx1MDAwMFx1MDAxYbuyTihBmlxc54J6RFx1MDAxMq2g2Fx1MDAwNtFTXHUwMDBm60As4DqrrruA61hLXHJ/XHUwMDFjVcHwScj+mFksRHdcdTAwMDVC+2Rkd429Vtr9ntzGypI9z4Pic2xbSOxcdTAwMWKHz6pYiZ5cdTAwMWO9ZTaTpKyH7t9eXFyc3y3BbDKJ0Vx1MDAxNZkt70zahfa05sQ1ypieiOGcS09Csq6ohDBcdTAwMGbEnsvrUDOFuqtXq641XHUwMDA0nlaUKC2FnNFZxIR6XHUwMDFhMSpcdTAwMTVcdTAwMThcdTAwMDJcdTAwMDU0q1x1MDAwNPm2duVQ5nGxXHUwMDAy6VfvMN4k3ct0XHUwMDE4a3b4ud2KkjBKejBZ6cltx3z3XHUwMDFlhWBJ5GDorNxAXHUwMDFlRYxzjClcdTAwMTJQ84Jtsras52cjT3NcdTAwMDFcdTAwMWJcdTAwMGVBS1x1MDAxM4bxaMH12CyThHdcdTAwMWLV/Vx1MDAxNvTzqyP68biTXHUwMDExxTa2gy8mnmVcdTAwMTTyXHUwMDE0XHUwMDE4xFx1MDAxMFx1MDAxNH1cdTAwMTIkWVA9bVx1MDAxMvdcdTAwMTBsLFx1MDAxM6497HrYesomoLfdTlx1MDAwN4PIgu9cdTAwMGbSKLGTPi6duek43jf+lIDAPdXnJsUgc2dsqnv1qVVcdTAwMTGmPFx1MDAxOH/+6+XM1fOx7F5cdTAwMWLTMK5O+KL+vrSQQVx1MDAxMEeTw5WSXHTYdCnv339YnLg+RyXjWHuuv4ggzVx1MDAwN6+z6sJlOaKQx6FcIlx1MDAwM4oghvWChyQ80FxmhatKXHUwMDE5XHUwMDA1XHUwMDFiXHUwMDE4p5hcbsY10bXYUXXfqMcoXHUwMDE0RIpgxFx1MDAxMVx1MDAxMzVVXHUwMDFk5S+YKIFcdTAwMTnI8dNKXHUwMDE5g1x1MDAwZlUwXFy/lC2ucZtS5kpoTDjDXG70SkheY9FINzQkpJhqXHUwMDA0rlx1MDAwNDditpqSLX7S0rRcdEmCXHUwMDA1lLRKYoqRXHUwMDE0fMomXHUwMDA1abBEXHUwMDAyYVxydkGWPG3Uv0nKNuaCuZydwvHalIyrudVcdTAwMTZWIJ5Y1blxl5QtTsv/XHUwMDAxKVN3VltaeKrsW0OgRnDHXHUwMDEzWZlcdTAwMDAoUijFXHUwMDFj7sX8xlxubFs3kKsqXHUwMDE5cTVcdTAwMWRkN1x1MDAxYVx1MDAwNFWDINVcdTAwMTKuKinDwnNSi7iCilx1MDAwYik5lZRp95iB1DvfT5OVrVos3VPKXHUwMDE2l/CNXHUwMDA0XGLCsqZcXFNcbuVcdTAwMDSkZOCQXHUwMDFhjUa6IT1QXGbwn1x1MDAwMGAzwlx1MDAxOF1NzFx1MDAxNj8wa1olmGBaXHUwMDBipIWSkFxyztJXXHL7XHUwMDBmlTSDRIVCMf3v1rL5cC6np5G8pJrN61x1MDAxY1x1MDAxMTz3iSiBbFx1MDAwNMKJXFyidbQ48W5qWd9cdTAwMGb6w9zMU7N1NY/0nSUmV56mXHUwMDAwJii1QdpcdTAwMTVrylx1MDAxOVXSQ1gypLSm5IE/XGawuZ9cdTAwMTSZn1x1MDAwMyVm5GZcdTAwMTJcIlx1MDAxNilcdTAwMDFfnmlGbkaxJ1x1MDAxNSbAjNGrZs2oyoRbgJJ4lVx1MDAxZlxiPNcnR5hJcEu1tyv2loTHXHUwMDE0XHUwMDE0Nje+hZdsrFx1MDAxYfeamt1cImdwmvxcYtxcdTAwMDb+OFx1MDAxOVpcdTAwMGJcdTAwMDdcdTAwMDVQILCmkYOPu02Ez92hp3icNNfWXHUwMDE3t74u/dz2s+zQgpfHalxyMInCkauqK7TPI3OxNetnWOXLnbVcdTAwMTRcdTAwMWPHbONA8uv6xfX/XHUwMDAx2ibQXHUwMDAzIn0= + + + + Makes the methoda message handlerMessage namespace(outer class)Name ofmessage classon_color_button_selected \ No newline at end of file diff --git a/docs/images/events/queue.excalidraw.svg b/docs/images/events/queue.excalidraw.svg new file mode 100644 index 000000000..45230f41b --- /dev/null +++ b/docs/images/events/queue.excalidraw.svg @@ -0,0 +1,16 @@ + + + eyJ2ZXJzaW9uIjoiMSIsImVuY29kaW5nIjoiYnN0cmluZyIsImNvbXByZXNzZWQiOnRydWUsImVuY29kZWQiOiJ4nO1cXGtT28hcdTAwMTL9zq+g2C97q4Iyj57XVm3dXG6Eh8NcdTAwMWJCSPbuXHUwMDE2JWzZViw/sGRcZknlv99cdTAwMWVcdTAwMDGWLEu2McaYutdcdFx1MDAxOEujUVvTp/ucnpF+rqyurkV3XHUwMDFkb+2P1TXvtuxcdTAwMDZ+pev2197Z7TdeN/TbLdzF4s9hu9ctxy3rUdRcdP94/77pdlx1MDAxYl7UXHTcsufc+GHPXHLCqFfx20653XzvR14z/Lf9feg2vT877WYl6jrJSda9ilx1MDAxZrW79+fyXHUwMDAyr+m1olx1MDAxMHv/XHUwMDBmfl5d/Vx1MDAxOf9OWVx1MDAxN/gtL25cdTAwMWJvTWzjhGW3XHUwMDFltluxnYxpJYFcbjlo4IdcdTAwMWbxTJFXwb1VtNZL9thNa3ew7a9v1GuNw6P92uXn453d/r5Mzlr1g+Asulx1MDAwYu4vgluu97opm8Ko2254XHUwMDE3fiWqP16z1PbBcVx1MDAxNTeso1x1MDAwMYPd3XavVm95of3udLC13XHLfnRnt1x1MDAxMTLY6rZqcSfJllv8XHUwMDA0TDlcXFFiuFx1MDAxMoNcdTAwMWT2UC7AoZRRZncxo1x1MDAxNM9cdTAwMTi12Vx1MDAwZXBcdTAwMDTQqN9I/EqsunLLjVx1MDAxYZrWqlxm2kRdt1x1MDAxNXbcLo5T0q7/+HVcdTAwMWRJQSpcbmBwREApXHUwMDE4NKl7fq1cdTAwMWVZczRzXHUwMDE4lZRcbs2pXHUwMDAyloxL6MVDXCK0XHUwMDA2LiE51FrQKVVit/gne0HrbrfzcN3WYktT1tuPWymfSlx1MDAwZe51Ku69XHUwMDAzUCk5XHUwMDEzaCmXLLmg6GdcctzZ6lx1MDAwNUGyrV1u5PhMXHUwMDE4ud1ow29V/FYte4jXqlx1MDAxNOxcdNww2mw3m36EZlx1MDAxY7f9VpRtXHUwMDEx9/uh2233655byem5cF/HdpeAyL6Sv1ZcdTAwMTO3iT9cZv7+511u6+Ihta+RwUy6W0m//3r3RDxLkt36iGdcdTAwMDVUXHUwMDEyTVJccibhueyT7cMvnXWz8dm/8b5cdTAwMDU7p+ftT0uPZ0Ul4llcdTAwMWJcIllcdTAwMTbP3MGQxlx0XHUwMDA3/Mf0y8HZOIRxjfiQglBcbjRcdTAwMGbNyjhMMcE5XHUwMDA1wVjyVVx1MDAxZsBMNTWMS6lcdTAwMTKY/1x1MDAxZs6vXGLnwiG1r+xgPlx1MDAxMcxdr1x1MDAxY937clx1MDAwZaKFVEWIplxuXHUwMDA3jFx1MDAwYlx1MDAwNXpqSJ9/b1xis8v5XHUwMDA1bFx1MDAxZVx1MDAxZV1Hd5dHSjZngzTNuuDjcWFcdTAwMWIpylxcMzRwR2mBVCSDaClExognYfg3KEuvKlx1MDAwMHJcdTAwMTKyTK7pXHUwMDAwszpcdTAwMTXFXHUwMDFlUMqBMMFcdTAwMDQkXHUwMDA2z1xypVx1MDAwMyf6mfK0gc9E3m1cdTAwMTJ4Ulx1MDAwM1xcPWq4ncjb0Xe1T0dbknxcdTAwMDH6w19cdTAwMWK0+/Uuv9v7gzfV0Y3r9Xav3fN+dHHEXHUwMDBmw8Nob/gsj+d3LepS/T46+lx1MDAxY0PLWMxcZn3/NFxcaCFcXDDVcmGQ1k6NlvyLufRo0Vx1MDAwNWjR4DxcdTAwMGIv4ymsyEFcZuNZxFx1MDAwMKXKMMlnSGuh/bDotFZtt6Iz/0csiMjQ1m236Vx1MDAwNzGvXHUwMDE4bI6d0mrBXHUwMDFia5Oz59393vDu/vx77fPfa/9KX9rQi1x0XHUwMDFj2meGXHUwMDBl/lx1MDAxMPi1Vky9sFx1MDAwM6875OCRj9pv0KDpVyrphFFGi1xc7LNbmibOt7t+zW+5weexXHUwMDA2z560kPNcdTAwMTYmLcGUXCKYJNnUMCTVjdb2xkWTXHUwMDFk7PbPvm9dnVx1MDAxZJWbfPlhSFx1MDAxZKo5Q6bJjaaSXHUwMDBmYVFcYuEg61dcdTAwMDb5qFx1MDAwNinUc3A5hzymKCVcblxy0U+H5Wx57H5kw89cdTAwMDcnXHUwMDFmLjpy0z24U7J1XHUwMDFhfe3fVvNcdTAwMTNOjK2JeWxSesw/4fKlMfSeQlx1MDAwMCHTXHUwMDA0LZWeXsiNv8xLXHUwMDBiIDlcdTAwMGVAmMzMvFx1MDAwMDSPxEa1llx1MDAwNNW+nIFcbr7hzOYtOrNNSFx1MDAwNlx1MDAxMzObNzGz3VPbXHUwMDFjUFwiqSpcdTAwMDIlXHUwMDAwXHUwMDAzxSVMXHLJ8VR7SSEpNHU4IZwrKrVG2TNcdTAwMDRJhTnN4GZNWTHNxGtULavx6azqoqRiUo5iXHUwMDExUypcdTAwMDDmKq2I1Pa/XHUwMDE4hSaAY00kWnMlXHUwMDA1g5HSikBcdTAwMWLwXHUwMDFi0DdaWUny3WPdf1x1MDAxYcpcdTAwMTdDu9yzVq5cdTAwMTNcdTAwMDdcdTAwMDNcdTAwMTWOlK3uXHUwMDBiW1xiXHUwMDAzwVPtam4njmeDwXzYNci5w/WcXCJ7dvrkR61xcvDtU/PM6NBcdTAwMWNdnlx1MDAxZbM8e9BcdTAwMWPCLP1AUqRMbFx1MDAxNchcdTAwMTF7XHUwMDE4sVU9Jlx1MDAwNGZcdTAwMDKQXHUwMDFj4/6IWXMuJmVcdTAwMDPBXFzrScWebF8jPpx0t5J+n4mcayOzW1x1MDAxM26BmVRSdIqpXHUwMDAz2aHZuNBcdTAwMDY2TrpcdTAwMDem8uV6//r6Q+922Vx1MDAwM1x1MDAxOVx1MDAwMHFQgiB70KhGbVx1MDAxMW0okiFcdTAwMWVcdTAwMWNFiFx1MDAxMdxcdTAwMDBcdTAwMGVcdTAwMDFJz7W8XHUwMDBlPVx1MDAxN1x1MDAxOHpcdTAwMTFcdTAwMWJcdTAwMGIrM92Prdzp175931xc3708//bps/6q6mqDPYeev1C3k1h//lx0p7T2W2f/ekdvVIOvXHUwMDE3f7ntvV23tHnWfltFMVxyxTVkQe0sr2HTU5fxw7e0iFx1MDAxN2NcdTAwMTGvucPmhvh56Fx0rVx1MDAwNDpH+ov9L8iJ20XLiVx06WuinLidKCdcbivVKchlQGlcYqXUwPRcdTAwMDJfbrPaycc72DpcdTAwMTW9nql978nLzt2yQ1JcdTAwMTnioGRcdTAwMWWpU1x1MDAwYtxupFYvNbeD3DdcdTAwMDeAXCJcdTAwMGJANEzb4MhcdTAwMTZcXFx1MDAxM1uufPNcdTAwMTR80yGIWlx1MDAwM1x1MDAwZvB6uDVv9brn9bx8XFzroYNcdTAwMDawXHK8ajRcdTAwMDbVUbtTXHUwMDA06aEvk8XvsEFjcVtYXHUwMDA2oHRMOqXcIJtcdTAwMTdPwO748V5S7GqgXHUwMDBlXHUwMDAwXHUwMDE4SbmmXFyZXGaCNThcZlx1MDAxOH1BXGZT7lCFSoZcYsZcdTAwMDQjyYBcZlx1MDAxMG2UwzhcdTAwMDGJTYhSSo+sl1x1MDAwMkzzgmj2XHUwMDAypPo161x1MDAwMONzwWq2XHUwMDBlgNFXgWGUaaF5stZg9VF3S0ehKJSzVlx1MDAwMcbn12FrcDhccjNKcCEwL+SWXHUwMDAwXGJcdTAwMDAj2MagXHUwMDFlXHUwMDAypkdsekslgPVCJ473jvhv0t9K+r0oflV8t9lOe2lqdkFcdTAwMTSuXHUwMDEyY4Rb5snp9Ms+x1x1MDAxN3qWNIBh8HK0XHUwMDE0dnEnXHUwMDE1SpiMXHUwMDFlwKjgMGUwglx1MDAwMTJcdTAwMTHgJmPY0+LYfUEzt1x1MDAwMKByuFxiZcaRoCG9IPUhZiFOXHUwMDE5oF2zyILnkJJnrFxmeZff7yTNLi5PXCLYgNOrvd3u7dFx+aJeOjmeVrP/pc7Pt672zlx1MDAwZvC6d3+cd8PN2+rB/DiUVjzh7i+k2XnxQlx1MDAxNiaBaOtPU0M0/2IuPUTNWIgqjvKBXHUwMDAzkZZoPFx1MDAxN6LjanR5cmF0/lx1MDAwZrRWXHUwMDEyg/lbWX89k2Bvty5R9/5cdTAwMWXL4MVcbvVcdFkmS/SHXHKdXHSBjFx1MDAxNM/BI/9QWpjpk+TJlemTm6PNXHUwMDEyLdPti7vatquDcNlcdTAwMTGokIMgK2RcXFKquExcdTAwMTWm4/k+TVx1MDAxZGOsXG5cdTAwMDDQ3OiXypGU58zyjep1ZVxiVUy/XHUwMDAw/F4x0yxUrW9ZsKzW3Vx1MDAxNuKwm1x1MDAwZu7FqvVhg8aCuFCtKz6O6zKM2IRNL9bHXHUwMDBm97LCWHNcdTAwMDcpP1hcdTAwMWOPwlhcdTAwMTPqXGKhha1+XHUwMDEzolPMZr4wNlxmo1x1MDAwNWpNlN2a4agksXNcdTAwMDBqQVx1MDAxZFwiXHUwMDA0xWCj8Vx1MDAwN1LceLDIRtgpU/1cdTAwMDIludeU7OOTw2p6qlxcoTI2wOyEoFxyeCzV6GHeXHUwMDFlXHUwMDFjylx1MDAxNzNtz/GyKM5cdGpx1KlKiFFjhMM1XHUwMDAwupZUWinJzYhRb0qxXHUwMDE3+rB9jXhv0t1K+n2mSXtKivVcdTAwMDBcdTAwMDVcdTAwMTTtXHUwMDA0zZk+jqldz5elXm1cdTAwMDM2LkNZ+Ytz9/Ro2eNcdTAwMThyfMdII6XAK0+0XHUwMDFjjmNcXChcdTAwMDe4jitIhEry2ktqhTBcdTAwMDQlXHUwMDAxWfD0Qalx2bioXHUwMDA2/CvtnqhcdTAwMGa3lZ0621x1MDAwZZ4/Z/9Wup1UVsg/4YuSsrGgL1x1MDAxMlx1MDAxZkZcdTAwMTXSXHUwMDE2VJqc2rtKp7+RZfxlXla4XHUwMDAzjIO7lo6ZXHUwMDE33OcxYc+IXHUwMDE0KJhmwftcdTAwMWKesI9cdTAwMTY9YT8hc02csI+ed2eLLr6zhVx1MDAxOUzDVlx1MDAwZk9ccstcdTAwMDNSql5cdTAwMWNdRKWQ7ZQvvG+eOP9SKoBludtcdTAwMGXD9bpcdTAwMWKV669cdTAwMGZNpHNcdTAwMGUyPs24Xb+YWmJcdTAwMWJ7XHJoh1x1MDAxMW0pIVx1MDAxNUSl65TzhqZQXGbZruFcdTAwMDaZJSbr1PrsoVx1MDAxYq1cdMdcdTAwMTbI2URcXLdcdTAwMTlcdTAwMDUuoFx1MDAwZeTmXHUwMDE1bkmjT1x1MDAwMO7sPitk4UM+7O3wXHUwMDFhuez0qaTSb7tl3W5tXHUwMDA3VyGr1Fp998dOUSrJ+N2Uj1x1MDAwNHhcdTAwMTFvxcG3t0pcdTAwMWJOhcy6q33+XHUwMDA3XHUwMDExhkrQRKpcdTAwMTdcXPolXHUwMDE0cVx1MDAwMKhRQJhGRZ6TVzhx7FJoSbhBXHUwMDExh/pqhFcqXHUwMDAzXHUwMDAyMM+8wsKwubmrXHUwMDE3XHUwMDA0fifMd1ZerHNcYlx1MDAxN1ZdmelXJ1+VTndcci25n8pcdTAwMDErl1x1MDAwM6M/qkZvXHUwMDE2b11gbMWAhY5cbkQwpDU8VVa9VzlcdTAwMWElNXqytM8jXHUwMDAwMY9qTd5cdTAwMTIphyiD0TteXHUwMDFmQSCnVkPtgklbXHUwMDE2tus8XHUwMDE4KtBRXHUwMDA1JCVSXCLD2VxmJdk34ammcH5AKo5xRD1hXHUwMDEyvXlrbrauv3/8us+jq1x1MDAxYrfqXHUwMDFk7+1cdTAwMTXd47okjootlIP5X2AsI4qAyD5uRWEoI1xc2ck5JVKqeTZPvVwiRLyQp1x1MDAwMrpcdTAwMGXG2te4dW9cdTAwMTGOKkFcdTAwMTQ5KqPx04fQW6f21HOXlEo/tpplJk5O9XW9XFzz5e6yeyrHXHUwMDFjT1x1MDAxOUFMYlx1MDAwZeFcIsNcdTAwMDCEdOzDkYjUklx1MDAxMmDPm8ii7ErrvHvX5lx1MDAxMlNcdTAwMDHiqDpLXHUwMDA1fGlcXHX8o1x1MDAwM3Rx4UNrJGmM8enDqiq3dvfDm1x1MDAxZF1vymr3MvhQqvpmtsLH4vgqRUnlUKGZNMo+XHUwMDA3avg2S8GIozVFSYNcdTAwMTRcdTAwMDFkXHUwMDE2RfNjq9xcdTAwMTBHWSdcdTAwMTSA0VvTvFx0XHUwMDFi7iBcdTAwMTNcdTAwMDVqn+oh7TrQrL9yaiTmhtd43Fx1MDAwN1+Iu45Zxc9cdTAwMDE4t3Cd2lt31zuNnb1bV1x1MDAxZl/pfr9zXHUwMDFjnFx1MDAxZpr9ZVx1MDAwZq2KO0rZKVx1MDAxMeuvOlWHi52VY9RcdTAwMDP0JFx1MDAwZZpcdTAwMTIqnuWtXHUwMDBmRfmc0KpcdTAwMWNcdTAwMTR3qGONQHVl1ySPuirTjp2HQkuJoExcdTAwMTgyqqwk2FuDXHUwMDA0vEJsfbqzrjxcdTAwMTSp19xO5yzCLtdcdTAwMWXn9NBqv/JQ2Uu6Wbvxvf5GXHUwMDFls4pftiRcdTAwMTZcdTAwMDPAeplnbf75a+XXf1x1MDAwMfpa2G0ifQ== + + + + events.Key(key="T")events.Key(key="e")events.Key(key="x")Message queueon_key(event)Event handlerevents.Key(key="t") \ No newline at end of file diff --git a/docs/images/events/queue2.excalidraw.svg b/docs/images/events/queue2.excalidraw.svg new file mode 100644 index 000000000..d4ed6be00 --- /dev/null +++ b/docs/images/events/queue2.excalidraw.svg @@ -0,0 +1,16 @@ + + + eyJ2ZXJzaW9uIjoiMSIsImVuY29kaW5nIjoiYnN0cmluZyIsImNvbXByZXNzZWQiOnRydWUsImVuY29kZWQiOiJ4nO1daXPbOLb93r9cIpX+8l5Vi1xy3Fx1MDAwYlxcXHUwMDAwUzX1yrvlxI5cdTAwMTfF25splyxRiy1LskSvXf3f50JxLGohJVlL5ExUldgmaVx1MDAxMCbP3Vx1MDAwZi7++u3Dh4/RUzP8+I9cdTAwMGZcdTAwMWbDx0K+Vi228lx1MDAwZlx1MDAxZv/wx+/DVrvaqPMp6Pzcbty1XG6dKytR1Gz/488/b/Kt6zBq1vKFMLivtu/ytXZ0V6w2gkLj5s9qXHUwMDE03rT/z/+/l79cdP/ZbNxcdTAwMTSjVtC9SSYsVqNG69u9wlp4XHUwMDEz1qM2j/7//POHXHUwMDBmf3X+j82uVq2HnWs7R7tzU6D7j+416p15XCKR4tOye0G1vc53isJcIp8t8WzD7lx1MDAxOX/oY+FY1pu721x1MDAwN42709rGTqV1+bTXyHTvWqrWakfRU+3bQ8hcdTAwMTcqd63YnNpRq3FcdTAwMWSeVItR5fszi1x1MDAxZH/9vWK+XeFcdLyebjXuypV62PZ/u3w92mjmXHUwMDBi1ejJXHUwMDFmXHUwMDEz4vVovl7uXGbSPfLIP2VcdTAwMDBFYFx1MDAxZFx1MDAxOaW1QjSWXk/7XHUwMDAxMnxSKyc0WWONUYawb25rjVx1MDAxYb9cYp7b76Lz6U7uMl+4LvNcZuvF12uiVr7ebuZb/Lq61z18/6tcdTAwMDOSioxUyqFcdTAwMDDFd3u9pFx1MDAxMlbLlci/XHUwMDE2XHUwMDBiXHUwMDAxSJJSW5RGQXe27bDzZow2xlxup8zrXHQ/hWa22IHHv/tcdTAwMWZsJd9qvjy/j52pxqbvf9yIYav7y3fNYv5cdTAwMWJcdTAwMTAkXHUwMDExgjZcdTAwMWFcdTAwMTGlfT3PeLvmk/W7Wq17rFG4XHUwMDFlgp12lG9Fq9V6sVov9/9KWC8mnKnl29Fa4+amXHUwMDFh8TT2XHUwMDFi1XrUf0Vn3JVWq/FQXHTzxSEjJ55r+uG6wuQ/3e8+dOHT+eH1+3//MfTq5HfqP1x1MDAwM2+zO9xv8a9//zGZXFzHxbZPrqU1XHUwMDEy/VvrXHUwMDAyZJRgXHUwMDE3XHUwMDFmt+uHNbm/cqLXilLKp1P8urX0gk1cdTAwMTiAQaeVllx1MDAwNqxm+e5cdTAwMTVsXHUwMDE5KFx1MDAwM1JoaYGUk6J/arOTa1xmLFx0x4IpXHUwMDE0KiMsdoW2K9fGXHUwMDA1pNFJLdFcYsDYbL7LtZaSQHfVzy+5/oFynfxOO2f73+aEct1cblx1MDAwYtE3VFx1MDAwZlx1MDAxMW5cdTAwMGKq/+h34TYgyFkruiBcdTAwMTkl23pcdTAwMTez6vhuf0tcdTAwMWWXXHUwMDBln45WN6urXHUwMDBme2+TbdmPwe+/126w0zJbmy1VQGCsklpb/qe74uJHXHUwMDAwZ1x1MDAwMudcdTAwMDRcdTAwMTFYh85p0zeziUT7d1WgsKSVXHUwMDFhYrCpK1x1MDAxYa+SbFx1MDAwN0TXXHUwMDE5XCJWMNrNXnRfcfVXXGZ9L6/2+jS7cnZcdTAwMWGFZ1x1MDAwZW9Xwp2zbPSw1vxcdTAwMTiH6SveovAx+vh64u8/foZhe67+Y9xcdTAwMWJ2h/0uqDNUjqky3zPPmLhcdTAwMWIjksRdXHUwMDFhUsiuKcmx5T39MS+tvFx1MDAwYpcm71xiJlCzkvd0XHUwMDE3XVx1MDAwZpF4wH6JZ/3EXHUwMDEzVSrmc4wt8m3/w6KtdalRj46qz/7Rg+g5upm/qdY6XHUwMDBm+fVwXHUwMDA3qT7mvfdzXG4+hU//c1x1MDAxZD79819cdTAwMWbDf3383/izbYdcdTAwMWRcdTAwMDeV5+d6fnmlVi3XOyEjXHUwMDBmXHUwMDEwtnpQXHUwMDFmVTnGfb3gplosxq1ggWeU5zFb2XGsV6NVLVfr+VoudcJvt8RSOpckmyDY9+T34cZcdTAwMGagm0BQyX6y95VTKp5+NjuGtnaWXzalXHUwMDBljJLkUKFjV1x1MDAwN/pssVCBs8ZZJVxmsG+ippHN6W0xsVtG1mo5uWBOY4tLXHUwMDE2Tyh7sEVCXHUwMDFlZTZcdTAwMGLbUT17tT290fwvXHUwMDFmdpSJXHUwMDFmfsPlM/FSxtI1/TZeXHUwMDE44jBC4vg+ffpzXl49XCJS9VxiqkDNSo/MxMZrhWTi7+W/wcQ/LtrEjzCKI03845QmXHUwMDFlY2++XzSVcFx1MDAxY+lrM777fWLv7k5LVXyqf3Lbd+XqMUVN/Vx1MDAwZURTXHUwMDA11pJBpYXSZGLa6ttcYi4wXHUwMDE2vOdttXFcdTAwMTLtNLI5vY2X6KQlqWBcdTAwMGU58DT7tpYt3lZutrPQus3kSoXyVrNcdTAwMDJcdTAwMGbTm81fw85j2FG+w/BcdTAwMWIuoe9cdTAwMDAmMVx1MDAxZFxiXHUwMDAyyLDcqq5uXHUwMDFlpaDSn/PSKijWQGlcblxuXVx1MDAwMDNTULNwXHUwMDFlkDg45Hm8ISX4jp2HaNHOw1xiczvSeYimdFx1MDAxZYSEJNmUvqpsSajx81x1MDAwM6JcXCg+fd543nzOrZ6a1np0YrYuXHUwMDEzZLPQarTbmUo+KlQmrsXNXFw+Ob5cdKRcdTAwMDGSTrGEOid7xVNcdTAwMDdWXHUwMDBiw+60clx1MDAwNlx1MDAwNcr5pe/Yq1xiWFx1MDAxMtBnTaWMXHUwMDE1Sbt1OFx1MDAxMoFlh0YpQuzUXHUwMDA2+0WXWMU4K/Fcclx1MDAxOYRpRJescjSB6L5cdTAwMWS1XHUwMDA2XHUwMDEyXHUwMDEzzmA58lwimKB2/PDl7Ph+t+lobbN+vXffzl2VaDdcdTAwMDGzfbj7cWjFwFxuzViUgpW0xD6wXHUwMDAyaTYhPi5nXHUwMDE42XmCXHUwMDE1XHUwMDAzIUn74rU0zlxmMyw2IFx1MDAxMqhYj1x1MDAwMCFcdTAwMDNlXHUwMDAwrdJcIlnygcpyW5pUuIa1WrXZXHUwMDFlXG5W0olMXHUwMDA3p4W39+P7Puu3bq0sXHUwMDFh1fUoV6GV+pdqWTxfvVx1MDAwNauL83wk6MBcYumENlx1MDAwNlx1MDAxND952Vx1MDAwM1apXHUwMDAzjUaQY8xqXHUwMDA2K01Fcvi9lNegYVx1MDAxMKksMEpcdTAwMDBoR+xxgoonZ16hKiHQRMqxUlx1MDAxNYBcYjFcdTAwMTftO1RcdTAwMWRJY1x1MDAxNDtoPydUjUgsXHUwMDE2+EJcdTAwMDJpJeT4Sb6TxtZOY2vvYHf/5jh7lFx1MDAxN7lneX605GDV4K1vJzRX6ND2eekqQKk1Y4RcdTAwMDVcdTAwMTdcZsXM3dvAeimEnlx1MDAxYljRSkOCZe8nXHUwMDA1KyWnvdjYgEOYgGWSoULrRu+F1fPTs8v80VWrjodPS1x1MDAwZVYrXHUwMDAy0pbh4Yz3XHUwMDA2bS9WkVxyL1tV7SyHcYyT6VJeXHUwMDEyLtmvmlx1MDAxN1ZZliSHxPie9Wqqx0o6UbNqUFx1MDAxMlmnjFx1MDAxZmWd5MzVYSV/U9k938k837ab1y6iXHUwMDA0rL6V7ThztIKgXHUwMDAwpFJAXHUwMDA2vVbqJTFLclx1MDAwMTgvs6y1PMV5jlxcRyNcdTAwMDPHYZZX4GRUTD2+XHUwMDAyVstcdTAwMDDNNzWPXG6MjnHQvytX45xcdTAwMDWcS23l5cTQJOP9cVbVVm+fNr82M/fb59tfT7ZKZ/NMMlx1MDAwZb9hd9iX7354klx1MDAxMZO9bClYN1x1MDAxMlx1MDAxODF+TJj+mJc0x1xiUqZJmKFAWWG0L1xisveC81x1MDAwYlx1MDAwYpFGSlx1MDAxOFx1MDAwZZhcdTAwMDBcdTAwMDaLs07rd8hH8sszXHUwMDE4Y2jIXHUwMDAya1x1MDAwYqN7LkpJP+aGplx1MDAxYVH0XFz4mkmshaVe6E+WaEw3XHUwMDFh/YnG3Fx1MDAxNElFJWWSLJJcdTAwMDEhrFx1MDAxNuOHvMeZ6PK2urlXOz0pn12VVk4zN/nscjtmLFuBJasth6LaOWN7ef3SYoDs7CiUgFx1MDAxY/xOtVxc56VcdTAwMTY5xDEzgWGnT7BMKVx1MDAxZrfi8OSMXHUwMDEywnFIKzTH6U5cZjpmyidtOEpZbqlMxWryXHUwMDEylORo11x1MDAxYZRKqFx0XHUwMDAyiIddsV68P195PG89Xrebh1FUeWjN2Cmby9oy1tVWO4UgjZZcdTAwMWPi92BVkVx1MDAwZZBDXGb5Ld6FfiFasqVlUmhfTsS3xLy/1qB0zv1cdTAwMDRryyhZsI2w1lx1MDAxOFx1MDAwYuPzYS42L53UT7BfrFx1MDAxZcv1c7neLlx1MDAxZp4svVxcXHUwMDEz+Fx1MDAxNaPgWIU5xyFMb9LVSzU/dDZR5Dx+xfyoalx1MDAxOEjl2CfloE5rXHUwMDAwXHUwMDE4YoX8UiQgskpY9lx1MDAxNy1cckg1O1fOL2Waw+qUX0LtP5MuLEt4pZ2T/S9zQplcdTAwMWVBdVOJnqVcdTAwMTRoXHUwMDA1mHh9YZRor+7fXVx1MDAxY8r26flDTWy3rlx1MDAwZlx0sVx1MDAwMctcdTAwMWXlZVhjXHUwMDA2noPKVpmkYC+lN84z2lx1MDAwNb6K7UChXHUwMDE22s3Cu5yG6SZYs/ty5IKZboXWYeZi5XRtu1x1MDAwNNW7jWN+zc/H+9OTvH5ccjuPYUcloYbfsDvsd82yqIhcIpnpZm3/4S6bXHUwMDA2lNPG2lx02lWkPufl1U8yVT9ZXHUwMDFi0Kz00yyIbpI9VH415i39KH505uk90eRHWNu50+S1SF7B4pRcdTAwMTakXHUwMDEwx09LRe58y17WWpXN58+5q0+5i82tKImJsUyyyY4/kSSQVkiUvYkpPlx1MDAxMXSWt4DlmExN10dmetfBXGKNPnhcXLDnXHUwMDEwfn740l5dfb4o7aysRcdcdTAwMWKHub3bcHqj+WvYdzTsKIdk+Fxyl9AhUTpR6ZGViJMszE9/ysur8kSaynNcInCzUnkz8Ua01Vx1MDAwNMLJJc+4z9hcdTAwMWJZOO9+hP2eO+9cdTAwMWUokXfv0Fx1MDAxOHJajC+ZT1dP5d3jXG6gK2Tz+0dcctkw2fz7oN3rXHUwMDAwkP1cdTAwMDF2v1x1MDAxZItnf57SYEBWKOUkkmDJmF+eUmtcdTAwMTlcYoNgXHUwMDEwWVx1MDAxM0DM6YhcdTAwMTHvNV9iXHUwMDFjkTZcdTAwMWPokVx1MDAxOFJ+UKCs027BoYRcdTAwMDGn1Fx1MDAwNML7dty6WGewfthKUlx1MDAxYeI07pFd29a/NL9cdTAwMWWph3ZOZa5lTX6+XFy/uFh25r3HXHUwMDAwaWLAcrTvpO1cdTAwMDMsXHUwMDA0YKywXGZcdTAwMDGNen7VMq1cXKDQovJcdTAwMGLGKL6ONF7cdc5cdTAwMDFbXHUwMDEyy3hGUv1oRY7OeziSXHUwMDBiwapcdTAwMDJQM1slkkJcdTAwMGa1NpFcdTAwMWVcboJDPclcbmV8XHL7aaWZrZePi5vnj7uVtdrGp690t+QsXHUwMDA0NjGBdVx1MDAxNlx1MDAwMY10IJXp5TIri1x1MDAwMVx1MDAwZqJQa4NcdTAwMWNo4bRcXOZE4r0mzzpSgr84I4d0XHUwMDE2lFx1MDAxMFx1MDAxOKklq1/tXHUwMDFjuXjrk1dcdTAwMWFcdTAwMDKAdKhcdTAwMTesV1x1MDAxN4VVh8mpXHRcdTAwMTZRYmtcdTAwMDPjpybOro4q2Vx1MDAxM1co1Vx1MDAwYitcdTAwMDeZ3U27+1x1MDAxNZeed69cdTAwMDKPUCNAsONDivqwKlx1MDAwM9ZyymotSKrp8lx1MDAxMims+1x1MDAxOSCVpc5cdTAwMTH/XHUwMDE1uGD/fWFQdYlcdTAwMTU4VEJIXHUwMDAxMD7N8su5OVxcKa1cdTAwMWPU90pfi632Sq7cLN4tOVItXHUwMDA0WmhALaxfx1xyXHUwMDAzQFx1MDAwNb8kz1x1MDAxYlxcS1O2Yk4j3c9cdTAwMDCqRiqrLL2BKrM0QFx1MDAxZOGrJrZcdTAwMWSQmpBgolx1MDAxOOvgYCVcdTAwMTNlbr/uPt6b/U+nlXpNbL+xXHLpXCJJ9zbo8Pek0X49f1/HXCJCXHUwMDFikFGsblx1MDAxOcxg5Pz8VTRcdTAwMTSwl+GZhOBLwkNcdTAwMDCrPVx1MDAxMY1naDtsIVx1MDAxMFx1MDAwM/6qNJZxTKRcdTAwMTbMub+9P6jIkthcdTAwMTD7N7vV0+yXyu7Jp+5b6sHjJEnLmVx1MDAwZjsqaTn8ht1hX75cdTAwMWIlvHNPWpJJ5mVcdTAwMDJcdTAwMTkt0NnxbUz6Y17SrCWbj1S5VTogXCIgwYrMoJnjYlx1MDAxOVx1MDAxYSm38VYlL4LK8bFmV1xyXHUwMDE3767Hqkhv5PLLQFx1MDAxYcdxXHUwMDExsNUkNp+q56o0Mn9cdTAwMTh/zHNm84+wRlx1MDAwM2z+cIpcXKWRid1cdTAwMTaMXHUwMDA1/uBcdTAwMDTiWL86XHUwMDE3XHUwMDBlz8zuZeuomTvcKOWz0cZyu3ygfdHU8lx1MDAxN5IgXHUwMDA0qD5Z9JlcdTAwMThAJdnP8vHJVFx1MDAxZV9cbptcdTAwMWZcYtHPQrGDXHUwMDE505DxfI/hXHUwMDBiNMuqRf5ucNFcdTAwMWFcYt/01yyc6eCthptALlOhmsjmd4lcdTAwMGLAQLKDXHUwMDAziGp8mJrjzY2mOP1aKT2stHdcdTAwMTGuXHUwMDFmSup+6Vm/nZ1iiP/zvTbQ8S/0dlx1MDAwNnHCXHUwMDA1gFKC8ett3Vx1MDAxYzeUmFxym99cdTAwMGbgJP5cIv4uXHUwMDA38fdcdTAwMDex+V1ipYyjXG5jhJ2gJ8Xh5Vx1MDAxNT5cItjbp88n7UyYscfl+vrSyzVh4Fh/WVx1MDAwZehZtEH0eoNeqn3mRYBcdTAwMDZcdTAwMTNfXHUwMDA3O3suv7K+14+z7Fx1MDAxNzlcdTAwMTVPxCWS+c1ghVtpYJy8qS/FL6nunJsxnT/prXbOXHUwMDBlvM9cdMU6vVxmTsmdvKTfzcw5sFx1MDAxM3ScuXiWpcszudW42C192s/WcpWd99G7Vvt9kzjqY1x1MDAwZlxydN/CbemMX4PnwDdQ0qzyZuBhTkHLXHUwMDAz4djnXHUwMDA1WjAtb1/kLteal+p0o3L7eFx1MDAxODZcdTAwMGJPutTtstxcdTAwMDO5SbIwv4b9NeyoxNnwXHUwMDFidof9rlx1MDAwN2dofFJValwi209TYubMt4OUksZffJD+lJdWl7IvlKZLwVx1MDAxN8VnpUtnwvdcdTAwMTNcdTAwMWOzcyxml7xLV/fFv0++31xi12BcdTAwMDF8v+RilFG+i9dcdTAwMDR+XHUwMDBlbd5dXHUwMDE3zvbWqfglX4n29s/3dlx1MDAxM1uWLlx1MDAxN99cdTAwMGZE4FxmXGKjhe9MKmNdsTqRjPeE/Fx1MDAxZbdW+35mMD82rla+RYe0VnC8KmxM+mJ0P1xiXHUwMDFjz5M0XHREgYP1KIlcbv062Fx1MDAwNYuu8f06ZmVL0iuoyV3LJOtQ313WjV9B3dws2Mdy9sneX8rdtdXSefnpxC053Vx1MDAwZnyvZd+e1oKxMr4v6je8YmB8/zZcdTAwMGXBnW9cZjlHvFJcdTAwMDDI01CgXHUwMDFjuWHL6MFcdTAwMDZcdTAwMTZcdTAwMDU4w+FcdTAwMWNcdTAwMDdxclx1MDAxMK+ao1xiJFx0i6amWICZ4TWNmpKywMuT01x1MDAxY6hcdJrsrWx9Pmt8LbSL5nzncdvIjcuzXFz0XHUwMDE2tC6Qm4K+0Vwi61dcdTAwMDPot1x1MDAxMOjrXsp/f1x1MDAwMM5cbuf33o5b/1k32mV/XHUwMDA2pee/alx1MDAxYq9cdTAwMDHGqSmkpG88pFl76njm/rUntFwiYlxys3By6qKgSoksKraBrN7dXHUwMDA0u9qf4Vnt071dWa3uX1x1MDAxZdRcdTAwMWWbd4XjZpKnvixI1a7TXHUwMDE23PBLVtag6stoXHUwMDAyXHUwMDA2orPNXHUwMDE2P1x0RtN0O/KltdmdXHUwMDAxVFx02Vwiszgtmke1IKhKkbJTu2CsXHUwMDAyXHUwMDFim/FcdTAwMGJra7dnj2H2aKNw0FxcvTtcbqN2e+UmKVx1MDAwMb8sYLXsK7K2s8Yho9U521x1MDAwN1ZcYpRU7Eii9WCdikSV2md3XHUwMDA2YDVglVx1MDAxNvGC/ftcdTAwMDNrusuarFn5PVx1MDAwMitcdTAwMWRN41x1MDAwN1rR7v6FuSiXTu7yrvX5oZy5XFw3XHUwMDA3S0/665CHtGVb70j5/d178CqFsYHjqMY3aFx1MDAxMHK69oMjSH8qkMR4XHUwMDA08MyJYYtUtPRcdTAwMGK8wCm/XHUwMDE3sVSDi1RYu0jPXHUwMDFmgDm0hn45MTTJuHef39v7slx1MDAwZke3mYeHwu1D+2v1tjF97vK9XGY7KiU6/IbdYV++XHUwMDFipVx1MDAxM3BWOiFxa3KV2JBcdTAwMDVcdTAwMTjbXHUwMDFjSdP4XHUwMDBiK9Kf8pKmREHadG1gtd9Lxlx1MDAwN4ZcdTAwMWHQzrNcdTAwMTVcdTAwMWONVFx1MDAwN8O4hFx1MDAxY15r86adXHUwMDEyp7NYXHUwMDE4S5a/uS+wY1fW51x1MDAwZXhAXHUwMDE3V7UjuYSPXHUwMDBiJFx1MDAxM46wcoNkwsdp2IRp7F70q7xgXHUwMDAyPkflrPJ8eYqVK5cp5FpHn3dL9XJ5ud1JXHUwMDA2XHUwMDAzXHUwMDA3N563Yp3xLYJVv0D6XHUwMDEyhjWecKuJY/qp/MlcdTAwMTRCIYuWIa2VUsbK2HL0eEZJd1x1MDAxYTmBYdUh41x1MDAxYkl9zyhJQyB/SOwzs/XOibyj5Iy95qjUM9HHhmmzoj+3r0ru6GrroJJTh3hw/by29LSjXGaA8cuZlFx1MDAxM35xiO03XHUwMDFk6L03v+LL75dn58c7mlx0mZA63YTe5EdOyzqahPtcdTAwMWGbx0/NOvoxXFxCflx1MDAxZonuIN/MeUU3vlRHVysnbnPzZrN+9OX86Gz1dOP8aHXppdrIQHg2l187KGz/JvZcdTAwMWShdlxuXHRcdTAwMWRcdTAwMTA//DluxFwi/G5cdTAwMTVcdTAwMWOFalwi8LtFqGE2XGI5WGXH1SpU7Fx1MDAxYmhcdTAwMWOQa09qd7pni/Nfgv1cdTAwMDNcdTAwMDU7k/Ja/WfghU4o2iPK7GmbLfL9/Fx1MDAxMo2x5Xun0ag8rjdk5n5/7aZyer5xXHUwMDFh3W++jzK7XHRYvK1Fllx1MDAwZYfxXHUwMDFkKF9k3O/J6Jv+k1x1MDAxMobN99xk3PcpXHUwMDAxLYxfy2ZcdTAwMDTqYYxhwsDybKzwsZ52XHUwMDAzIaBf1sUgolx1MDAwNW9cdTAwMGVmJbpJXCLAt6PWqcSQXGL4Vfq93cavsl9X7E21JU736qtHxbtnVXu8v3xTgn2xcFx1MDAwNe3/Ut3pKY5cdTAwMDMmSTFcXK3SSrJTXHUwMDAwen6kLU9cdTAwMGLhgFx1MDAwNpTPXHUwMDEzW6GG0EJ8W1x1MDAxZOFcdTAwMTkqwneCwngg8lx1MDAxYVx1MDAxNfl9j1x1MDAwNIpcdTAwMDWnLCa1SKmATeus41x1MDAxMuvsfomCJ++MX1x1MDAwZrpoP118udtsVWBlz62V98rm4K603Fx1MDAwMTzrhYBcdTAwMTHg9SqrWCn7o1wi0lx1MDAwMVjR2fC4t0nYjNvqsL8qXHUwMDFjKE/NxyHrXHUwMDAxfTXIoNDaoensXHQ2WFxyQmfYu47npX4qoDqdXFxcdTAwMGLyPVx1MDAxNk18O4GRXHUwMDFkoGzt881u5ejE1Y+b+TD6VMmJJc808fNcdTAwMGV8Po3YzKPyPn0/Ulx1MDAxNYdcdTAwMDLWOWPQTFu4TGurMz1SwTdcdTAwMDNmQ/iTXCJVxnfY6ocqR8BW9qzaXHUwMDFkzbTbyVx1MDAxZEa3ollcXL9ccq9BrV/Jh+aSY9WpQGnyvo6RxJI7oFUx4JDUNyxjZ9HAdGo1rbHO1GBcdTAwMDVgpLr4XHUwMDFlQ+9cdTAwMGarI2ihKVxcZn5cIuArumOD9TjKStrP5chd01x1MDAxOYX526eVqkhcdTAwMDDrXHUwMDEy1dhd4DpcdTAwMTU1wSGnjL3rb5vag1xiUDFI+Jx05KZSrSNq7DqQ7GyA51OzN+KGRFhaXHUwMDA27KZ4rq5veyjt4EJr3+uCT8/DY305MbRsfV3BXHUwMDFjfcpcdTAwMWTa7fVjzK5uhZtccnszfTX8v3zYUbX74TfsXHUwMDBl+/LdwnRNYlx1MDAxZiCZzOf1IZiRQo+vZtJcdTAwMWbzslx1MDAxNu9BpatcdTAwMTlcdTAwMGWcXHUwMDE1XHUwMDA3rEJcdTAwMTjfXHUwMDFicY5qhkarmSHFe3ROk1Y/YvvQN+Vme1x1MDAxYlx1MDAwMVx0tvNGKfZcdTAwMDaI/1xi6rkqvXhcdTAwMWbFn/Scq/cj7OeQ6n00RfneQvJcdTAwMGVHXHUwMDE2pfKZj/EzrNnzfFttnn2l/f1wd0OYnZvPoV1uR1x1MDAxNYVcbsjvU+1cdTAwMTe/KG1s31xuQ41s+i1pY3zLrFx1MDAxZVx1MDAwZeaM+1x1MDAwMVx0XHUwMDAyo3zlnuLNe+OJKl+0l4o/woe6XHUwMDAzjqpB1Fx1MDAxNlx1MDAxMN5FUPXbi0X6mG82j1wiXHUwMDFlkk9/gy7Pulp8kdruMFx1MDAxZu+r4cPqsEC18/FcItBcdTAwMTFcdTAwMDBcdTAwMGay0M/5r79/+/s/t9XlXHUwMDAwIn0= + + + + events.Key(key="e")events.Key(key="x")events.Key(key="t")Tevents.Key(key="x")events.Key(key="t")Teevents.Key(key="t")TexText \ No newline at end of file diff --git a/docs/images/test.excalidraw.svg b/docs/images/test.excalidraw.svg deleted file mode 100644 index 2e1b19e21..000000000 --- a/docs/images/test.excalidraw.svg +++ /dev/null @@ -1,16 +0,0 @@ - - - eyJ2ZXJzaW9uIjoiMSIsImVuY29kaW5nIjoiYnN0cmluZyIsImNvbXByZXNzZWQiOnRydWUsImVuY29kZWQiOiJ4nO1cXFtz2shcdTAwMTJ+z69weV92q4wy90uqTp3y3Y4vcYJ9nOTslkuRXHUwMDA0yCCJlYSxSeW/n1x1MDAxNnbQXHUwMDA1JFxiXHUwMDE3m+xcdFx1MDAwZlx1MDAwZcxcZjOtnv66v+lp8vXVxsZm/NB1Nt9sbDr3ltlx7dDsb24l7XdOXHUwMDE4uYFcdTAwMGZdZPg5XG56oTVcdTAwMWPZiuNu9Ob1a89cZttO3O2YlmPcuVHP7ERxz3ZcdTAwMDPDXG68127seNG/k7/npuf8q1x1MDAxYnh2XHUwMDFjXHUwMDFh6VwiNcd24yB8XFzL6Tie48dcdTAwMTHM/l/4vLHxdfg3I13oWLHpNzvO8Fx1MDAwYsOujIBaXHUwMDE0W89cdTAwMDN/KCwnjEmmhVx1MDAxY1xycKM9WC52bOhtgMhO2pM0bV5uXHUwMDFmuHyv6+1aonvpfMDdnbdHrXTVhtvp1OOHzqMmTKvVXHUwMDBiMzJFcVx1MDAxOLSda9eOW9CPXHUwMDBi7aPvRVx1MDAwMSgh/VZcdTAwMTj0mi3fiaLcd4KuabnxQ9KG0Kj1UVx0bzbSlnv4pKSBXHUwMDA0RopwgqjGio16k+9cdTAwMGJuXGLOhUBaXHUwMDEwipDSXHUwMDA1uXaDXHUwMDBl7Fx1MDAwNMj1XHUwMDFiXHUwMDFhvlLJvphWu1x04vl2OoZZwmnwdEz/6WlcdOZcdTAwMDaC1ZEgfNTZctxmK4ZeRrChcKYncoZboFx1MDAxMGVcdTAwMTjJVKRkue6xPbSFv4pcbmyZYfdJUZtR8iEjalwi5X7RkLLGlNnk652bz5Z3KFx1MDAwZq/9vVx1MDAwYvfCa+/ti4fRXFw5yzPDMOhvjnq+Pb1LRet1bfPRnDCoXHUwMDE4M0mpRCx9oI7rt6HT73U6aVtgtVNcdTAwMGJcdTAwMWO2ftuaw/I55mWWT5hgiEvFZ7b8zifvuP+f29bhwfZpZHduoqbZqJdYfsGCZ7R7O4iT5Zdo+Fx1MDAxOGEjUTqTXHUwMDE4UUmy+kgmoFJcdTAwMWJMcc1cdTAwMDFcdTAwMWNcdTAwMTgrLVx1MDAxN7L8xvA1bvmAN1x1MDAwM1OSM++R4UOfkmNmjzVcdTAwMDUsaime2fC3z7vyulbf/9gjtUE9Olx1MDAxYSjW6E02/Ni5jzN2v/Vr2tJpc6O3Zl3w5XxKTs6MO2FcdTAwMDJcdTAwMTVbv7tcdTAwMTOssVx1MDAwNDvHJMXpNH9SreY1jaRcdTAwMTiJKofCkDY0oWwpXHUwMDBlJVx1MDAwZU0/6pohXHUwMDAwd4JTkWlcdTAwMTBcdTAwMWY5XHUwMDEzQsdcdTAwMWNcdGNcdTAwMDKEwSztWZojWaY9pttcdTAwMWX4cd1cdTAwMWRcZkNcdTAwMTTKtVx1MDAxZZie23nI7dzQUEHS3Y5rtX//I6vNyIFFh5Ypc8O3O24zseVNXHUwMDBiXHUwMDFlw1x0c2ZcdTAwMWW7QD9HXHUwMDAzPNe2s2HVXHUwMDAyXHUwMDE5TJgzPJ4lXHUwMDFjXHUwMDA2odt0fbNzWVx1MDAxMLFcdTAwMTJ4tmt6gW9Pwp6kpaFcdTAwMWMzpVx04lx1MDAxOM+OvV3zdK/zaad5Ojij5Gj/4vYqeLDWXHUwMDFke4pcdTAwMWFcdTAwMTJcdTAwMTGqIFxcM8SIIDnoccpcclwiXHUwMDE1XHUwMDE1QmHOJCeLQO83zE3zy4RYTjJcdTAwMTBcdTAwMWLBXHUwMDBlc1iaXHUwMDE3qO13XHUwMDAwckIw1oiuXHUwMDAwgFVBjO/Qh1x1MDAwYuo1dunpgWbNt1x1MDAwN/fbf6PFY+PPMu20kDt5wfVcdTAwMGK5gpaGXFzBXGLCcHSlM6O+WsvrinpViXpcdTAwMDVcZlx1MDAxZXGKtYbeXHUwMDA1UV9cdTAwMTlwXHSegHwmingnICvSROLlw3194u1OL45cdTAwMDP/T1x1MDAxZqyh6cRcdTAwMTPDLkO5by0t7E6JXFzFsFuQtFx1MDAxMoOVR2mge6RcZolcdTAwMWN8vNSa6JmReGH3XHUwMDBl6M6gf3c5XHUwMDE43Hw6vYvPXHUwMDFh+4MlI9E2o9ZyT9NMXHUwMDEwQ1x1MDAwYo0pXHUwMDEyXHUwMDE0QizOIVx1MDAxMSNuMKmRhFxijCTYpFhcdTAwMTlcdTAwMTTnOVBDbFx1MDAxNpLoTL7jWcJwYH48OlwiXHUwMDE3ylxud+JQmuYh6tTdxePliqalvcG7XGLdxadcdTAwMTdn9t/xp+7JzUldzpb3elx0cVx1MDAxN0jTvYS4S592XHUwMDFhyZm84PqRXHUwMDFjnUlIXHUwMDE3zzZKXGKqMdKzZ+ir1bymLIdcdFnhWqkwXHUwMDE4XHUwMDE2/DlcXOusaVx1MDAwNU1cdCNcbqXb8lx1MDAwZqQ5L5FWmMJcZuZKK5ThXHUwMDBlk8xdT1x1MDAxMXj0kXLr2UnN/Ye9Njras9TliXN7ftmv+WK3M1x1MDAxZvCKNH6mK1x1MDAwMjJcdTAwMWbyXHUwMDEwMlx1MDAwMDJUTUJcdTAwMWWc6lxy0IKmijA4XyjEXHUwMDE3QV5pVoFiZEglleCMgN7lOFx1MDAwNFx1MDAxOTUoQnLSXHUwMDE1XHUwMDE5ZUpjLl9cdTAwMDCJakEkYmVcdTAwMTBKwMaUhpMspngyMOlcdTAwMTgwbaexXHUwMDEx+DfW0PhcdTAwMDGSja1ccudcdTAwMGWk/uPNn34yMGkyXHUwMDFjz41/f+T/xkVcYo/s2JOhTPW4bnOY7jiNuFx1MDAwMtFx0C2Dc04hRezO/1x1MDAxNJVof6Q6XHUwMDEz4C4zhlVAu6REXG6Wtf5pYK/mXj9cdTAwMDR2Vlx1MDAwNvaKKDtcdTAwMWbW4WRuKFxyXHUwMDA3dCmxUkk2IYd2XHUwMDA2KMNJUoUo0EY26i1cdTAwMTHrcHAxNFx1MDAwMVmFZsOXXHUwMDE4RzvF4HbgtFx1MDAwMkMkXHUwMDE4Jlx1MDAxYsO8IFxmXHUwMDFjNKVznGaGYj53+I1iM4x3XFzfdv0mdKYsXHUwMDE2kG71knVcdTAwMTFsXGbDmHJMmaCY8ZH2k4czu4mRXHUwMDFhikiKYVxcctGU2byNUYnIcUWNxtPgXHUwMDExmd50fHuKSFx1MDAxY3aHMVwiidBcdTAwMTJcXCxcdTAwMWVcdTAwMTOJIFx1MDAwM3OuMIfdSl7p8bIo0+S4PiZTx4zi3cBcdTAwMDPQg+YvXHUwMDAy14+LXHUwMDFhXHUwMDFlqnI7wXjLMcd8XGY8U7av6FxmusmM+UNr+m4jRcvww+j9X1tcdTAwMTNHU2RcYlxim1x1MDAwNKnEXHUwMDE0KeEq+/VcdTAwMWHlXHUwMDA2hm1cdTAwMDKrUYRKjjCfOiE1OOwuelImXHUwMDEy+fmQNFx1MDAxMCFcdTAwMTjiMWKJwqdNV460x/mKIEvne5X994dvSUlpuVx1MDAxMeZCSs4on73q4lx1MDAxM5f1xsByXCJzr/5esr633W/K5zvNzOdnXHUwMDEzzUtNhUZcZiVcdTAwMWEm+VvSXHUwMDFh0Fx1MDAxZMIoQIvDMYLTXHUwMDA172pK6y4yXHUwMDE5u9S1jmVsXHUwMDE52FxiXHUwMDAwWM9xQfNcIr40e5RRudaKo8xcdTAwMTlIbDadaFwiXHUwMDAxembeM5KlXHUwMDEyXpXZWEZKk7FcdTAwMTBcdTAwMThcdTAwMTKvrWZPXHUwMDE4nLv2W7ttdY/fXHUwMDFlXHUwMDFk9z427XpcdTAwMTddX6x7wkBx8L5cXFBEaUJoRFx1MDAxZWFCXHUwMDFhVEhcdTAwMDRndFxyzFbjXCLFesmSPiySolx1MDAwNMnlM6diV5UtXHUwMDFjXHUwMDFjbL/r35xfvcdXTbone6dcdTAwMGY1b8ak6fc4s0Q3UYmpivpcdTAwMDIlyqNcdTAwMTbTXHUwMDEwblx1MDAwNVwis0et41x1MDAwZjuHjasjtN9Q+/zgeF9fb3/21lx1MDAxZVJMXHUwMDFhXHUwMDA0XHUwMDFlXHUwMDE0I4jQmst8lSynwoCDqqSKsmHQWsnp4MfrXHUwMDBiNEXAcTh/5vqCL6fb6KRR+0y9a+fgrFY/uLliavFcdTAwMWP5//m00zL6k1x1MDAxN3w5h1LGgWV5Rp8gXHUwMDAydJyo2VNcctVaXldnwkmFM1x1MDAwMWdqXGLYXHUwMDExiMxCLepMfrxsYTyhT1x04kIh9Y/O59et0HH8Z07oT1x0hUVyPJJxfnJcZiGqXGZ8XHUwMDEwvjjnmMxOju2GXGI+P7iXtzfmg31tXtyG5u1RXHT45qv6Xz70hDKIguMnREyFpc4n+ZKafyUo04pcYqqUWugubak1/5zAyYVKulx1MDAwMlxmVlx1MDAwNbGT5lm/drh31eN3l/37y755f2e+XTw2/pp2XHUwMDE1004jXGKTXHUwMDE3XFxDglCeJKOE0iQszk5cdTAwMTCqtbyuXHUwMDA0QdJcbi/FMEoupfTISy10XHUwMDE5sYwrf1x1MDAwNa5cdM5cdTAwMTl4XHUwMDA1v0haXHUwMDFmhpC/aHtmpjAl1E4ubczIOj9jwFx1MDAxNJVcdTAwMTdcdTAwMDIgzZRcdTAwMTCEzl5nbHnv2uK8fflBvP9cdTAwMTjX1Oll6513+Fx1MDAxM1Q3MoNzklxcXHUwMDA3XGJMeeZcdTAwMTczQ9qguCGRgsM2eKfkyn11eJyDOihcdPRcdTAwMWTrVVx1MDAxNFx1MDAwMVSFN1prvI/FXHSY+cdcdTAwMGb9Qe3Q69LPrcWj5qqmXVF144rEXVW+8ifbtGVPO41BTV5w/Vx1MDAxOFx1MDAxNCa69Fx1MDAwZVx1MDAwNIOL0ljMzqCqtbymXGaKXHRd4bBcdTAwMTlcdTAwMTZcdTAwMDZmXFw9g8OejUBJrSWRmv9cIlCrXCJQU3jHYlx1MDAwNKq0rFxuXHUwMDEzXFxcbkSJwDLZXHUwMDBmUKfqy6Q1LatcdTAwMTKaXHUwMDFiYGZcIvlcdCrwXHUwMDEwVKyqwlx1MDAwNsFMSUE5YZyzxTIuK62r4oiQ5P+EmePXW+tQV1UsXHUwMDA1mlLeXHUwMDA0XHUwMDBiI6ZcdTAwMThcdTAwMDFcdTAwMWIlmVx1MDAwM+jGqLqJXHUwMDE4VFx1MDAwMC3mICBcdTAwMDVBOctcZslVN02+Qn9cdTAwMWH8q7rpccL1rG569bTCptnt1mMwzJG1gO279lNcdTAwMDRIt2HzznX6O+Wp0FdPXHUwMDFinvgqJ9mMr99efftcdTAwMWZFQFx1MDAxMlx1MDAxYyJ9 - - - - Click()ButtonWidgetClick()def on_click(self, event): self.emit(Button.Pressed)MessagesScreen()Button.Pressed()Button.Pressed() \ No newline at end of file diff --git a/docs/index.md b/docs/index.md index 37a32dd30..a8b17e54f 100644 --- a/docs/index.md +++ b/docs/index.md @@ -59,7 +59,7 @@ Textual is a framework for building applications that run within your terminal.
-```{.textual path="examples/calculator.py" columns=100 lines=40} +```{.textual path="examples/calculator.py" columns=100 lines=41 press="3,.,1,4,5,9,2,_,_"} ``` @@ -70,6 +70,9 @@ Textual is a framework for building applications that run within your terminal. ```{.textual path="docs/examples/tutorial/stopwatch.py" press="tab,enter,_,_"} ``` +```{.textual path="docs/examples/guide/layout/combining_layouts.py"} +``` + ```{.textual path="docs/examples/app/widgets01.py"} ``` diff --git a/docs/reference/message.md b/docs/reference/message.md new file mode 100644 index 000000000..fcb6f76c3 --- /dev/null +++ b/docs/reference/message.md @@ -0,0 +1 @@ +::: textual.message.Message diff --git a/docs/reference/static.md b/docs/reference/static.md new file mode 100644 index 000000000..709b442ef --- /dev/null +++ b/docs/reference/static.md @@ -0,0 +1 @@ +::: textual.widgets.Static diff --git a/docs/tutorial.md b/docs/tutorial.md index 86cb2ee1a..413826c2f 100644 --- a/docs/tutorial.md +++ b/docs/tutorial.md @@ -6,7 +6,7 @@ By the end of this page you should have a solid understanding of app development !!! quote - I've always thought the secret sauce in making a popular framework is for it to be fun. + If you want people to build things, make it fun. — **Will McGugan** (creator of Rich and Textual) @@ -200,11 +200,11 @@ While it's possible to set all styles for an app this way, it is rarely necessar Let's add a CSS file to our application. -```python title="stopwatch03.py" hl_lines="37" +```python title="stopwatch03.py" hl_lines="24" --8<-- "docs/examples/tutorial/stopwatch03.py" ``` -Adding the `css_path` attribute to the app constructor tells Textual to load the following file when it starts the app: +Adding the `CSS_PATH` class variable tells Textual to load the following file when it starts the app: ```sass title="stopwatch03.css" --8<-- "docs/examples/tutorial/stopwatch03.css" @@ -329,7 +329,7 @@ The `on_button_pressed` method is an *event handler*. Event handlers are methods If you run "stopwatch04.py" now you will be able to toggle between the two states by clicking the first button: -```{.textual path="docs/examples/tutorial/stopwatch04.py" title="stopwatch04.py" press="tab,tab,tab,enter,_,_"} +```{.textual path="docs/examples/tutorial/stopwatch04.py" title="stopwatch04.py" press="tab,tab,tab,_,enter,_,_,_"} ``` ## Reactive attributes @@ -423,7 +423,7 @@ To add a new child widget call `mount()` on the parent. To remove a widget, call Let's use these to implement adding and removing stopwatches to our app. -```python title="stopwatch.py" hl_lines="76-77 86-90 92-96" +```python title="stopwatch.py" hl_lines="78-79 88-92 94-98" --8<-- "docs/examples/tutorial/stopwatch.py" ``` diff --git a/e2e_tests/test_apps/basic.py b/e2e_tests/test_apps/basic.py index a81cdbf46..3391e68e5 100644 --- a/e2e_tests/test_apps/basic.py +++ b/e2e_tests/test_apps/basic.py @@ -104,9 +104,11 @@ class Success(Widget): return Text("This is a success message", justify="center") -class BasicApp(App, css_path="basic.css"): +class BasicApp(App): """A basic app demonstrating CSS""" + CSS_PATH = "basic.css" + def on_load(self): """Bind keys here.""" self.bind("s", "toggle_class('#sidebar', '-active')", description="Sidebar") @@ -210,9 +212,8 @@ class BasicApp(App, css_path="basic.css"): self.bell() -app = BasicApp() - if __name__ == "__main__": + app = BasicApp() app.run(quit_after=2) # from textual.geometry import Region diff --git a/examples/borders.py b/examples/borders.py deleted file mode 100644 index b3f8ece6d..000000000 --- a/examples/borders.py +++ /dev/null @@ -1,29 +0,0 @@ -from itertools import cycle - -from textual.app import App -from textual.color import Color -from textual.constants import BORDERS -from textual.widgets import Static - - -class BorderApp(App): - """Displays a pride flag.""" - - COLORS = ["red", "orange", "yellow", "green", "blue", "purple"] - - def compose(self): - self.dark = True - for border, color in zip(BORDERS, cycle(self.COLORS)): - static = Static(f"border: {border} {color};") - static.styles.height = 7 - static.styles.background = Color.parse(color).with_alpha(0.2) - static.styles.margin = (1, 2) - static.styles.border = (border, color) - static.styles.content_align = ("center", "middle") - yield static - - -app = BorderApp() - -if __name__ == "__main__": - app.run() diff --git a/examples/calculator.py b/examples/calculator.py index 2174f7f9b..a1f1061f9 100644 --- a/examples/calculator.py +++ b/examples/calculator.py @@ -10,6 +10,8 @@ from textual.widgets import Button, Static class CalculatorApp(App): """A working 'desktop' calculator.""" + CSS_PATH = "calculator.css" + numbers = var("0") show_ac = var(True) left = var(Decimal("0")) @@ -137,6 +139,5 @@ class CalculatorApp(App): do_math() -app = CalculatorApp(css_path="calculator.css") if __name__ == "__main__": - app.run() + CalculatorApp().run() diff --git a/examples/code_browser.css b/examples/code_browser.css index aca48c127..e342b7a00 100644 --- a/examples/code_browser.css +++ b/examples/code_browser.css @@ -16,10 +16,6 @@ CodeBrowser.-show-tree #tree-view { background: $surface; } -CodeBrowser{ - background: $background; -} - DirectoryTree { padding-right: 1; padding-right: 1; diff --git a/examples/code_browser.py b/examples/code_browser.py index 1b434d487..4d1c4ee97 100644 --- a/examples/code_browser.py +++ b/examples/code_browser.py @@ -12,6 +12,7 @@ from textual.widgets import DirectoryTree, Footer, Header, Static class CodeBrowser(App): """Textual code browser app.""" + CSS_PATH = "code_browser.css" BINDINGS = [ ("f", "toggle_files", "Toggle Files"), ("q", "quit", "Quit"), @@ -56,6 +57,5 @@ class CodeBrowser(App): self.show_tree = not self.show_tree -app = CodeBrowser(css_path="code_browser.css") if __name__ == "__main__": - app.run() + CodeBrowser().run() diff --git a/examples/pride.py b/examples/pride.py index d6da93797..5253e0851 100644 --- a/examples/pride.py +++ b/examples/pride.py @@ -15,7 +15,5 @@ class PrideApp(App): yield stripe -app = PrideApp() - if __name__ == "__main__": - app.run() + PrideApp().run() diff --git a/mkdocs.yml b/mkdocs.yml index ee8bb75cc..92829cf76 100644 --- a/mkdocs.yml +++ b/mkdocs.yml @@ -92,16 +92,20 @@ nav: - "widgets/text_input.md" - "widgets/tree_control.md" - Reference: - - "reference/index.md" - "reference/app.md" - "reference/button.md" - "reference/color.md" - "reference/dom_node.md" - "reference/events.md" - "reference/geometry.md" + - "reference/index.md" - "reference/message_pump.md" - - "reference/timer.md" + - "reference/message.md" - "reference/query.md" + - "reference/reactive.md" + - "reference/screen.md" + - "reference/static.md" + - "reference/timer.md" - "reference/widget.md" diff --git a/old examples/README.md b/old examples/README.md deleted file mode 100644 index 0a60ffba4..000000000 --- a/old examples/README.md +++ /dev/null @@ -1,11 +0,0 @@ -These examples probably don't rub. We will be back-porting them to the examples dir - -# Examples - -Run any of these examples to demonstrate a Textual features. - -The example code will generate a log file called "textual.log". Tail this file to gain insight in to what Textual is doing. - -``` -tail -f textual -``` diff --git a/old examples/animation.py b/old examples/animation.py deleted file mode 100644 index 1fbff9e9d..000000000 --- a/old examples/animation.py +++ /dev/null @@ -1,38 +0,0 @@ -from textual.app import App -from textual.reactive import Reactive -from textual.widgets import Footer, Placeholder - - -class SmoothApp(App): - """Demonstrates smooth animation. Press 'b' to see it in action.""" - - async def on_load(self) -> None: - """Bind keys here.""" - await self.bind("b", "toggle_sidebar", "Toggle sidebar") - await self.bind("q", "quit", "Quit") - - show_bar = Reactive(False) - - def watch_show_bar(self, show_bar: bool) -> None: - """Called when show_bar changes.""" - self.bar.animate("layout_offset_x", 0 if show_bar else -40) - - def action_toggle_sidebar(self) -> None: - """Called when user hits 'b' key.""" - self.show_bar = not self.show_bar - - async def on_mount(self) -> None: - """Build layout here.""" - footer = Footer() - self.bar = Placeholder(name="left") - - await self.screen.dock(footer, edge="bottom") - await self.screen.dock(Placeholder(), Placeholder(), edge="top") - await self.screen.dock(self.bar, edge="left", size=40, z=1) - - self.bar.layout_offset_x = -40 - - # self.set_timer(10, lambda: self.action("quit")) - - -SmoothApp.run(log_path="textual.log") diff --git a/old examples/big_table.py b/old examples/big_table.py deleted file mode 100644 index 7bfc428d7..000000000 --- a/old examples/big_table.py +++ /dev/null @@ -1,33 +0,0 @@ -from rich.table import Table - -from textual import events -from textual.app import App -from textual.widgets import ScrollView - - -class MyApp(App): - """An example of a very simple Textual App""" - - async def on_load(self, event: events.Load) -> None: - await self.bind("q", "quit", "Quit") - - async def on_mount(self, event: events.Mount) -> None: - - self.body = body = ScrollView(auto_width=True) - - await self.screen.dock(body) - - async def add_content(): - table = Table(title="Demo") - - for i in range(20): - table.add_column(f"Col {i + 1}", style="magenta") - for i in range(100): - table.add_row(*[f"cell {i},{j}" for j in range(20)]) - - await body.update(table) - - await self.call_later(add_content) - - -MyApp.run(title="Simple App", log_path="textual.log") diff --git a/old examples/borders.css b/old examples/borders.css deleted file mode 100644 index f27374927..000000000 --- a/old examples/borders.css +++ /dev/null @@ -1,59 +0,0 @@ -Screen { - /* text-background: #212121; */ -} - -#borders { - layout: vertical; - background: #212121; - overflow-y: scroll; -} - -Lorem.border { - height: 12; - margin: 2 4; - background: #303f9f; -} - -Lorem.round { - border: round #8bc34a; -} - -Lorem.solid { - border: solid #8bc34a; -} - -Lorem.double { - border: double #8bc34a; -} - -Lorem.dashed { - border: dashed #8bc34a; -} - -Lorem.heavy { - border: heavy #8bc34a; -} - -Lorem.inner { - border: inner #8bc34a; -} - -Lorem.outer { - border: outer #8bc34a; -} - -Lorem.hkey { - border: hkey #8bc34a; -} - -Lorem.vkey { - border: vkey #8bc34a; -} - -Lorem.tall { - border: tall #8bc34a; -} - -Lorem.wide { - border: wide #8bc34a; -} diff --git a/old examples/borders.py b/old examples/borders.py deleted file mode 100644 index 62e4d296e..000000000 --- a/old examples/borders.py +++ /dev/null @@ -1,57 +0,0 @@ -from rich.padding import Padding -from rich.style import Style -from rich.text import Text - -from textual.app import App -from textual.renderables.gradient import VerticalGradient -from textual.widget import Widget - -lorem = Text.from_markup( - """[#C5CAE9]Lorem ipsum dolor sit amet, consectetur adipiscing elit. In velit libero, volutpat nec hendrerit at, faucibus in odio. Aliquam hendrerit nibh sed quam volutpat maximus. Nullam suscipit convallis lorem quis sodales. In tristique lobortis ante et dictum. Ut at finibus ipsum. In urna dolor, placerat et mi facilisis, congue sollicitudin massa. Phasellus felis turpis, cursus eu lectus et, porttitor malesuada augue. Sed feugiat volutpat velit, sollicitudin fringilla velit bibendum faucibus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In velit libero, volutpat nec hendrerit at, faucibus in odio. Aliquam hendrerit nibh sed quam volutpat maximus. Nullam suscipit convallis lorem quis sodales. In tristique lobortis ante et dictum. Ut at finibus ipsum. In urna dolor, placerat et mi facilisis, congue sollicitudin massa. Phasellus felis turpis, cursus eu lectus et, porttitor malesuada augue. Sed feugiat volutpat velit, sollicitudin fringilla velit bibendum faucibus. """, - justify="full", -) - - -class Lorem(Widget): - def render(self) -> Text: - return Padding(lorem, 1) - - -class Background(Widget): - def render(self): - return VerticalGradient("#212121", "#212121") - - -class BordersApp(App): - """Sandbox application used for testing/development by Textual developers""" - - def on_load(self): - self.bind("q", "quit", "Quit") - - def on_mount(self): - """Build layout here.""" - - borders = [ - Lorem(classes={"border", border}) - for border in ( - "round", - "solid", - "double", - "dashed", - "heavy", - "inner", - "outer", - "hkey", - "vkey", - "tall", - "wide", - ) - ] - borders_view = Background(*borders) - borders_view.show_vertical_scrollbar = True - - self.mount(borders=borders_view) - - -app = BordersApp(css_path="borders.css", log_path="textual.log") -app.run() diff --git a/old examples/calculator.py b/old examples/calculator.py deleted file mode 100644 index 7f4bbe3cc..000000000 --- a/old examples/calculator.py +++ /dev/null @@ -1,216 +0,0 @@ -""" - -A Textual app to create a fully working calculator, modelled after MacOS Calculator. - -""" - -from decimal import Decimal - -from rich.align import Align -from rich.console import Console, ConsoleOptions, RenderResult, RenderableType -from rich.padding import Padding -from rich.style import Style -from rich.text import Text - -from textual.app import App -from textual.reactive import Reactive -from textual.views import GridView -from textual.widget import Widget -from textual.widgets import Button - -try: - from pyfiglet import Figlet -except ImportError: - print("Please install pyfiglet to run this example") - raise - - -class FigletText: - """A renderable to generate figlet text that adapts to fit the container.""" - - def __init__(self, text: str) -> None: - self.text = text - - def __rich_console__( - self, console: Console, options: ConsoleOptions - ) -> RenderResult: - """Build a Rich renderable to render the Figlet text.""" - size = min(options.max_width / 2, options.max_height) - if size < 4: - yield Text(self.text, style="bold") - else: - if size < 7: - font_name = "mini" - elif size < 8: - font_name = "small" - elif size < 10: - font_name = "standard" - else: - font_name = "big" - font = Figlet(font=font_name, width=options.max_width) - yield Text(font.renderText(self.text).rstrip("\n"), style="bold") - - -class Numbers(Widget): - """The digital display of the calculator.""" - - value = Reactive("0") - - def render(self) -> RenderableType: - """Build a Rich renderable to render the calculator display.""" - return Padding( - Align.right(FigletText(self.value), vertical="middle"), - (0, 1), - style="white on rgb(51,51,51)", - ) - - -class Calculator(GridView): - """A working calculator app.""" - - DARK = "white on rgb(51,51,51)" - LIGHT = "black on rgb(165,165,165)" - YELLOW = "white on rgb(255,159,7)" - - BUTTON_STYLES = { - "AC": LIGHT, - "C": LIGHT, - "+/-": LIGHT, - "%": LIGHT, - "/": YELLOW, - "X": YELLOW, - "-": YELLOW, - "+": YELLOW, - "=": YELLOW, - } - - display = Reactive("0") - show_ac = Reactive(True) - - def watch_display(self, value: str) -> None: - """Called when self.display is modified.""" - # self.numbers is a widget that displays the calculator result - # Setting the attribute value changes the display - # This allows us to write self.display = "100" to update the display - self.numbers.value = value - - def compute_show_ac(self) -> bool: - """Compute show_ac reactive value.""" - # Condition to show AC button over C - return self.value in ("", "0") and self.display == "0" - - def watch_show_ac(self, show_ac: bool) -> None: - """When the show_ac attribute change we need to update the buttons.""" - # Show AC and hide C or vice versa - self.c.display = not show_ac - self.ac.display = show_ac - - def on_mount(self) -> None: - """Event when widget is first mounted (added to a parent view).""" - - # Attributes to store the current calculation - self.left = Decimal("0") - self.right = Decimal("0") - self.value = "" - self.operator = "+" - - # The calculator display - self.numbers = Numbers() - self.numbers.style_border = "bold" - - def make_button(text: str, style: str) -> Button: - """Create a button with the given Figlet label.""" - return Button(FigletText(text), style=style, name=text) - - # Make all the buttons - self.buttons = { - name: make_button(name, self.BUTTON_STYLES.get(name, self.DARK)) - for name in "+/-,%,/,7,8,9,X,4,5,6,-,1,2,3,+,.,=".split(",") - } - - # Buttons that have to be treated specially - self.zero = make_button("0", self.DARK) - self.ac = make_button("AC", self.LIGHT) - self.c = make_button("C", self.LIGHT) - self.c.display = False - - # Set basic grid settings - self.grid.set_gap(2, 1) - self.grid.set_gutter(1) - self.grid.set_align("center", "center") - - # Create rows / columns / areas - self.grid.add_column("col", max_size=30, repeat=4) - self.grid.add_row("numbers", max_size=15) - self.grid.add_row("row", max_size=15, repeat=5) - self.grid.add_areas( - clear="col1,row1", - numbers="col1-start|col4-end,numbers", - zero="col1-start|col2-end,row5", - ) - # Place out widgets in to the layout - self.grid.place(clear=self.c) - self.grid.place( - *self.buttons.values(), clear=self.ac, numbers=self.numbers, zero=self.zero - ) - - def handle_button_pressed(self, message: ButtonPressed) -> None: - """A message sent by the button widget""" - - assert isinstance(message.sender, Button) - button_name = message.sender.name - - def do_math() -> None: - """Does the math: LEFT OPERATOR RIGHT""" - self.log(self.left, self.operator, self.right) - try: - if self.operator == "+": - self.left += self.right - elif self.operator == "-": - self.left -= self.right - elif self.operator == "/": - self.left /= self.right - elif self.operator == "X": - self.left *= self.right - self.display = str(self.left) - self.value = "" - self.log("=", self.left) - except Exception: - self.display = "Error" - - if button_name.isdigit(): - self.display = self.value = self.value.lstrip("0") + button_name - elif button_name == "+/-": - self.display = self.value = str(Decimal(self.value or "0") * -1) - elif button_name == "%": - self.display = self.value = str(Decimal(self.value or "0") / Decimal(100)) - elif button_name == ".": - if "." not in self.value: - self.display = self.value = (self.value or "0") + "." - elif button_name == "AC": - self.value = "" - self.left = self.right = Decimal(0) - self.operator = "+" - self.display = "0" - elif button_name == "C": - self.value = "" - self.display = "0" - elif button_name in ("+", "-", "/", "X"): - self.right = Decimal(self.value or "0") - do_math() - self.operator = button_name - elif button_name == "=": - if self.value: - self.right = Decimal(self.value) - do_math() - - -class CalculatorApp(App): - """The Calculator Application""" - - async def on_mount(self) -> None: - """Mount the calculator widget.""" - await self.screen.dock(Calculator()) - - -CalculatorApp.run(title="Calculator Test", log_path="textual.log") diff --git a/old examples/code_viewer.py b/old examples/code_viewer.py deleted file mode 100644 index 6c9e4ce91..000000000 --- a/old examples/code_viewer.py +++ /dev/null @@ -1,70 +0,0 @@ -import os -import sys -from rich.console import RenderableType - -from rich.syntax import Syntax -from rich.traceback import Traceback - -from textual.app import App -from textual.widgets import Header, Footer, FileClick, ScrollView, DirectoryTree - - -class MyApp(App): - """An example of a very simple Textual App""" - - async def on_load(self) -> None: - """Sent before going in to application mode.""" - - # Bind our basic keys - await self.bind("b", "view.toggle('sidebar')", "Toggle sidebar") - await self.bind("q", "quit", "Quit") - - # Get path to show - try: - self.path = sys.argv[1] - except IndexError: - self.path = os.path.abspath( - os.path.join(os.path.basename(__file__), "../../") - ) - - async def on_mount(self) -> None: - """Call after terminal goes in to application mode""" - - # Create our widgets - # In this a scroll view for the code and a directory tree - self.body = ScrollView() - self.directory = DirectoryTree(self.path, "Code") - - # Dock our widgets - await self.screen.dock(Header(), edge="top") - await self.screen.dock(Footer(), edge="bottom") - - # Note the directory is also in a scroll view - await self.screen.dock( - ScrollView(self.directory), edge="left", size=48, name="sidebar" - ) - await self.screen.dock(self.body, edge="top") - - async def handle_file_click(self, message: FileClick) -> None: - """A message sent by the directory tree when a file is clicked.""" - - syntax: RenderableType - try: - # Construct a Syntax object for the path in the message - syntax = Syntax.from_path( - message.path, - line_numbers=True, - word_wrap=True, - indent_guides=True, - theme="monokai", - ) - except Exception: - # Possibly a binary file - # For demonstration purposes we will show the traceback - syntax = Traceback(theme="monokai", width=None, show_locals=True) - self.app.sub_title = os.path.basename(message.path) - await self.body.update(syntax) - - -# Run our app class -MyApp.run(title="Code Viewer", log_path="textual.log") diff --git a/old examples/colours.txt b/old examples/colours.txt deleted file mode 100644 index c96d59ffd..000000000 --- a/old examples/colours.txt +++ /dev/null @@ -1,10 +0,0 @@ -header blue white on #173f5f - -sidebar #09312e on #3caea3 -sidebar border #09312e - -content blue white #20639b -content border #0f2b41 - -footer border #0f2b41 -footer yellow #3a3009 on #f6d55c; diff --git a/old examples/easing.py b/old examples/easing.py deleted file mode 100644 index e70620e05..000000000 --- a/old examples/easing.py +++ /dev/null @@ -1,45 +0,0 @@ -from textual._easing import EASING -from textual.app import App -from textual.reactive import Reactive - -from textual.views import DockView -from textual.widgets import Placeholder, TreeControl, ScrollView, TreeClick - - -class EasingApp(App): - """An app do demonstrate easing.""" - - side = Reactive(False) - easing = Reactive("linear") - - def watch_side(self, side: bool) -> None: - """Animate when the side changes (False for left, True for right).""" - width = self.easing_view.outer_size.width - animate_x = (width - self.placeholder.outer_size.width) if side else 0 - self.placeholder.animate( - "layout_offset_x", animate_x, easing=self.easing, duration=1 - ) - - async def on_mount(self) -> None: - """Called when application mode is ready.""" - - self.placeholder = Placeholder() - self.easing_view = DockView() - self.placeholder.style = "white on dark_blue" - - tree = TreeControl("Easing", {}) - for easing_key in sorted(EASING.keys()): - await tree.add(tree.root.id, easing_key, {"easing": easing_key}) - await tree.root.expand() - - await self.screen.dock(ScrollView(tree), edge="left", size=32) - await self.screen.dock(self.easing_view) - await self.easing_view.dock(self.placeholder, edge="left", size=32) - - async def handle_tree_click(self, message: TreeClick[dict]) -> None: - """Called in response to a tree click.""" - self.easing = message.node.data.get("easing", "linear") - self.side = not self.side - - -EasingApp().run(log_path="textual.log") diff --git a/old examples/example.css b/old examples/example.css deleted file mode 100644 index 2ccd53034..000000000 --- a/old examples/example.css +++ /dev/null @@ -1,34 +0,0 @@ -App > View { - layout: dock; - docks: side=left/1; -} - -#header { - text: on #173f5f; - height: 3; - border: hkey white; -} - -#content { - text: on #20639b; -} - -#footer { - height: 3; - border-top: hkey #0f2b41; - text: #3a3009 on #f6d55c; -} - -#sidebar { - text: #09312e on #3caea3; - dock: side; - width: 30; - border-right: outer #09312e; - offset-x: -100%; - transition: offset 400ms in_out_cubic; -} - -#sidebar.-active { - offset-x: 0; - transition: offset 400ms in_out_cubic; -} diff --git a/old examples/grid.py b/old examples/grid.py deleted file mode 100644 index 23873c406..000000000 --- a/old examples/grid.py +++ /dev/null @@ -1,34 +0,0 @@ -from textual.app import App -from textual.widgets import Placeholder - - -class GridTest(App): - async def on_mount(self) -> None: - """Make a simple grid arrangement.""" - - grid = await self.screen.dock_grid(edge="left", name="left") - - grid.add_column(fraction=1, name="left", min_size=20) - grid.add_column(size=30, name="center") - grid.add_column(fraction=1, name="right") - - grid.add_row(fraction=1, name="top", min_size=2) - grid.add_row(fraction=2, name="middle") - grid.add_row(fraction=1, name="bottom") - - grid.add_areas( - area1="left,top", - area2="center,middle", - area3="left-start|right-end,bottom", - area4="right,top-start|middle-end", - ) - - grid.place( - area1=Placeholder(name="area1"), - area2=Placeholder(name="area2"), - area3=Placeholder(name="area3"), - area4=Placeholder(name="area4"), - ) - - -GridTest.run(title="Grid Test", log_path="textual.log") diff --git a/old examples/grid_auto.py b/old examples/grid_auto.py deleted file mode 100644 index 7a738670a..000000000 --- a/old examples/grid_auto.py +++ /dev/null @@ -1,22 +0,0 @@ -from textual.app import App -from textual import events -from textual.widgets import Placeholder - - -class GridTest(App): - async def on_mount(self, event: events.Mount) -> None: - """Create a grid with auto-arranging cells.""" - - grid = await self.screen.dock_grid() - - grid.add_column("col", fraction=1, max_size=20) - grid.add_row("row", fraction=1, max_size=10) - grid.set_repeat(True, True) - grid.add_areas(center="col-2-start|col-4-end,row-2-start|row-3-end") - grid.set_align("stretch", "center") - - placeholders = [Placeholder() for _ in range(20)] - grid.place(*placeholders, center=Placeholder()) - - -GridTest.run(title="Grid Test", log_path="textual.log") diff --git a/old examples/richreadme.md b/old examples/richreadme.md deleted file mode 100644 index 880d2544d..000000000 --- a/old examples/richreadme.md +++ /dev/null @@ -1,444 +0,0 @@ -[![Downloads](https://pepy.tech/badge/rich/month)](https://pepy.tech/project/rich) -[![PyPI version](https://badge.fury.io/py/rich.svg)](https://badge.fury.io/py/rich) -[![codecov](https://codecov.io/gh/willmcgugan/rich/branch/master/graph/badge.svg)](https://codecov.io/gh/willmcgugan/rich) -[![Rich blog](https://img.shields.io/badge/blog-rich%20news-yellowgreen)](https://www.willmcgugan.com/tag/rich/) -[![Twitter Follow](https://img.shields.io/twitter/follow/willmcgugan.svg?style=social)](https://twitter.com/willmcgugan) - -![Logo](https://github.com/willmcgugan/rich/raw/master/imgs/logo.svg) - -[中文 readme](https://github.com/willmcgugan/rich/blob/master/README.cn.md) • [Lengua española readme](https://github.com/willmcgugan/rich/blob/master/README.es.md) • [Deutsche readme](https://github.com/willmcgugan/rich/blob/master/README.de.md) • [Läs på svenska](https://github.com/willmcgugan/rich/blob/master/README.sv.md) • [日本語 readme](https://github.com/willmcgugan/rich/blob/master/README.ja.md) • [한국어 readme](https://github.com/willmcgugan/rich/blob/master/README.kr.md) - -Rich is a Python library for _rich_ text and beautiful formatting in the terminal. - -The [Rich API](https://rich.readthedocs.io/en/latest/) makes it easy to add color and style to terminal output. Rich can also render pretty tables, progress bars, markdown, syntax highlighted source code, tracebacks, and more — out of the box. - -![Features](https://github.com/willmcgugan/rich/raw/master/imgs/features.png) - -For a video introduction to Rich see [calmcode.io](https://calmcode.io/rich/introduction.html) by [@fishnets88](https://twitter.com/fishnets88). - -See what [people are saying about Rich](https://www.willmcgugan.com/blog/pages/post/rich-tweets/). - -## Compatibility - -Rich works with Linux, OSX, and Windows. True color / emoji works with new Windows Terminal, classic terminal is limited to 16 colors. Rich requires Python 3.6.1 or later. - -Rich works with [Jupyter notebooks](https://jupyter.org/) with no additional configuration required. - -## Installing - -Install with `pip` or your favorite PyPi package manager. - -``` -pip install rich -``` - -Run the following to test Rich output on your terminal: - -``` -python -m rich -``` - -## Rich Print - -To effortlessly add rich output to your application, you can import the [rich print](https://rich.readthedocs.io/en/latest/introduction.html#quick-start) method, which has the same signature as the builtin Python function. Try this: - -```python -from rich import print - -print("Hello, [bold magenta]World[/bold magenta]!", ":vampire:", locals()) -``` - -![Hello World](https://github.com/willmcgugan/rich/raw/master/imgs/print.png) - -## Rich REPL - -Rich can be installed in the Python REPL, so that any data structures will be pretty printed and highlighted. - -```python ->>> from rich import pretty ->>> pretty.install() -``` - -![REPL](https://github.com/willmcgugan/rich/raw/master/imgs/repl.png) - -## Using the Console - -For more control over rich terminal content, import and construct a [Console](https://rich.readthedocs.io/en/latest/reference/console.html#rich.console.Console) object. - -```python -from rich.console import Console - -console = Console() -``` - -The Console object has a `print` method which has an intentionally similar interface to the builtin `print` function. Here's an example of use: - -```python -console.print("Hello", "World!") -``` - -As you might expect, this will print `"Hello World!"` to the terminal. Note that unlike the builtin `print` function, Rich will word-wrap your text to fit within the terminal width. - -There are a few ways of adding color and style to your output. You can set a style for the entire output by adding a `style` keyword argument. Here's an example: - -```python -console.print("Hello", "World!", style="bold red") -``` - -The output will be something like the following: - -![Hello World](https://github.com/willmcgugan/rich/raw/master/imgs/hello_world.png) - -That's fine for styling a line of text at a time. For more finely grained styling, Rich renders a special markup which is similar in syntax to [bbcode](https://en.wikipedia.org/wiki/BBCode). Here's an example: - -```python -console.print("Where there is a [bold cyan]Will[/bold cyan] there [u]is[/u] a [i]way[/i].") -``` - -![Console Markup](https://github.com/willmcgugan/rich/raw/master/imgs/where_there_is_a_will.png) - -You can use a Console object to generate sophisticated output with minimal effort. See the [Console API](https://rich.readthedocs.io/en/latest/console.html) docs for details. - -## Rich Inspect - -Rich has an [inspect](https://rich.readthedocs.io/en/latest/reference/init.html?highlight=inspect#rich.inspect) function which can produce a report on any Python object, such as class, instance, or builtin. - -```python ->>> my_list = ["foo", "bar"] ->>> from rich import inspect ->>> inspect(my_list, methods=True) -``` - -![Log](https://github.com/willmcgugan/rich/raw/master/imgs/inspect.png) - -See the [inspect docs](https://rich.readthedocs.io/en/latest/reference/init.html#rich.inspect) for details. - -# Rich Library - -Rich contains a number of builtin _renderables_ you can use to create elegant output in your CLI and help you debug your code. - -Click the following headings for details: - -
-Log - -The Console object has a `log()` method which has a similar interface to `print()`, but also renders a column for the current time and the file and line which made the call. By default Rich will do syntax highlighting for Python structures and for repr strings. If you log a collection (i.e. a dict or a list) Rich will pretty print it so that it fits in the available space. Here's an example of some of these features. - -```python -from rich.console import Console -console = Console() - -test_data = [ - {"jsonrpc": "2.0", "method": "sum", "params": [None, 1, 2, 4, False, True], "id": "1",}, - {"jsonrpc": "2.0", "method": "notify_hello", "params": [7]}, - {"jsonrpc": "2.0", "method": "subtract", "params": [42, 23], "id": "2"}, -] - -def test_log(): - enabled = False - context = { - "foo": "bar", - } - movies = ["Deadpool", "Rise of the Skywalker"] - console.log("Hello from", console, "!") - console.log(test_data, log_locals=True) - - -test_log() -``` - -The above produces the following output: - -![Log](https://github.com/willmcgugan/rich/raw/master/imgs/log.png) - -Note the `log_locals` argument, which outputs a table containing the local variables where the log method was called. - -The log method could be used for logging to the terminal for long running applications such as servers, but is also a very nice debugging aid. - -
-
-Logging Handler - -You can also use the builtin [Handler class](https://rich.readthedocs.io/en/latest/logging.html) to format and colorize output from Python's logging module. Here's an example of the output: - -![Logging](https://github.com/willmcgugan/rich/raw/master/imgs/logging.png) - -
- -
-Emoji - -To insert an emoji in to console output place the name between two colons. Here's an example: - -```python ->>> console.print(":smiley: :vampire: :pile_of_poo: :thumbs_up: :raccoon:") -😃 🧛 💩 👍 🦝 -``` - -Please use this feature wisely. - -
- -
-Tables - -Rich can render flexible [tables](https://rich.readthedocs.io/en/latest/tables.html) with unicode box characters. There is a large variety of formatting options for borders, styles, cell alignment etc. - -![table movie](https://github.com/willmcgugan/rich/raw/master/imgs/table_movie.gif) - -The animation above was generated with [table_movie.py](https://github.com/willmcgugan/rich/blob/master/examples/table_movie.py) in the examples directory. - -Here's a simpler table example: - -```python -from rich.console import Console -from rich.table import Table - -console = Console() - -table = Table(show_header=True, header_style="bold magenta") -table.add_column("Date", style="dim", width=12) -table.add_column("Title") -table.add_column("Production Budget", justify="right") -table.add_column("Box Office", justify="right") -table.add_row( - "Dev 20, 2019", "Star Wars: The Rise of Skywalker", "$275,000,000", "$375,126,118" -) -table.add_row( - "May 25, 2018", - "[red]Solo[/red]: A Star Wars Story", - "$275,000,000", - "$393,151,347", -) -table.add_row( - "Dec 15, 2017", - "Star Wars Ep. VIII: The Last Jedi", - "$262,000,000", - "[bold]$1,332,539,889[/bold]", -) - -console.print(table) -``` - -This produces the following output: - -![table](https://github.com/willmcgugan/rich/raw/master/imgs/table.png) - -Note that console markup is rendered in the same way as `print()` and `log()`. In fact, anything that is renderable by Rich may be included in the headers / rows (even other tables). - -The `Table` class is smart enough to resize columns to fit the available width of the terminal, wrapping text as required. Here's the same example, with the terminal made smaller than the table above: - -![table2](https://github.com/willmcgugan/rich/raw/master/imgs/table2.png) - -
- -
-Progress Bars - -Rich can render multiple flicker-free [progress](https://rich.readthedocs.io/en/latest/progress.html) bars to track long-running tasks. - -For basic usage, wrap any sequence in the `track` function and iterate over the result. Here's an example: - -```python -from rich.progress import track - -for step in track(range(100)): - do_step(step) -``` - -It's not much harder to add multiple progress bars. Here's an example taken from the docs: - -![progress](https://github.com/willmcgugan/rich/raw/master/imgs/progress.gif) - -The columns may be configured to show any details you want. Built-in columns include percentage complete, file size, file speed, and time remaining. Here's another example showing a download in progress: - -![progress](https://github.com/willmcgugan/rich/raw/master/imgs/downloader.gif) - -To try this out yourself, see [examples/downloader.py](https://github.com/willmcgugan/rich/blob/master/examples/downloader.py) which can download multiple URLs simultaneously while displaying progress. - -
- -
-Status - -For situations where it is hard to calculate progress, you can use the [status](https://rich.readthedocs.io/en/latest/reference/console.html#rich.console.Console.status) method which will display a 'spinner' animation and message. The animation won't prevent you from using the console as normal. Here's an example: - -```python -from time import sleep -from rich.console import Console - -console = Console() -tasks = [f"task {n}" for n in range(1, 11)] - -with console.status("[bold green]Working on tasks...") as status: - while tasks: - task = tasks.pop(0) - sleep(1) - console.log(f"{task} complete") -``` - -This generates the following output in the terminal. - -![status](https://github.com/willmcgugan/rich/raw/master/imgs/status.gif) - -The spinner animations were borrowed from [cli-spinners](https://www.npmjs.com/package/cli-spinners). You can select a spinner by specifying the `spinner` parameter. Run the following command to see the available values: - -``` -python -m rich.spinner -``` - -The above command generate the following output in the terminal: - -![spinners](https://github.com/willmcgugan/rich/raw/master/imgs/spinners.gif) - -
- -
-Tree - -Rich can render a [tree](https://rich.readthedocs.io/en/latest/tree.html) with guide lines. A tree is ideal for displaying a file structure, or any other hierarchical data. - -The labels of the tree can be simple text or anything else Rich can render. Run the following for a demonstration: - -``` -python -m rich.tree -``` - -This generates the following output: - -![markdown](https://github.com/willmcgugan/rich/raw/master/imgs/tree.png) - -See the [tree.py](https://github.com/willmcgugan/rich/blob/master/examples/tree.py) example for a script that displays a tree view of any directory, similar to the linux `tree` command. - -
- -
-Columns - -Rich can render content in neat [columns](https://rich.readthedocs.io/en/latest/columns.html) with equal or optimal width. Here's a very basic clone of the (MacOS / Linux) `ls` command which displays a directory listing in columns: - -```python -import os -import sys - -from rich import print -from rich.columns import Columns - -directory = os.listdir(sys.argv[1]) -print(Columns(directory)) -``` - -The following screenshot is the output from the [columns example](https://github.com/willmcgugan/rich/blob/master/examples/columns.py) which displays data pulled from an API in columns: - -![columns](https://github.com/willmcgugan/rich/raw/master/imgs/columns.png) - -
- -
-Markdown - -Rich can render [markdown](https://rich.readthedocs.io/en/latest/markdown.html) and does a reasonable job of translating the formatting to the terminal. - -To render markdown import the `Markdown` class and construct it with a string containing markdown code. Then print it to the console. Here's an example: - -```python -from rich.console import Console -from rich.markdown import Markdown - -console = Console() -with open("README.md") as readme: - markdown = Markdown(readme.read()) -console.print(markdown) -``` - -This will produce output something like the following: - -![markdown](https://github.com/willmcgugan/rich/raw/master/imgs/markdown.png) - -
- -
-Syntax Highlighting - -Rich uses the [pygments](https://pygments.org/) library to implement [syntax highlighting](https://rich.readthedocs.io/en/latest/syntax.html). Usage is similar to rendering markdown; construct a `Syntax` object and print it to the console. Here's an example: - -```python -from rich.console import Console -from rich.syntax import Syntax - -my_code = ''' -def iter_first_last(values: Iterable[T]) -> Iterable[Tuple[bool, bool, T]]: - """Iterate and generate a tuple with a flag for first and last value.""" - iter_values = iter(values) - try: - previous_value = next(iter_values) - except StopIteration: - return - first = True - for value in iter_values: - yield first, False, previous_value - first = False - previous_value = value - yield first, True, previous_value -''' -syntax = Syntax(my_code, "python", theme="monokai", line_numbers=True) -console = Console() -console.print(syntax) -``` - -This will produce the following output: - -![syntax](https://github.com/willmcgugan/rich/raw/master/imgs/syntax.png) - -
- -
-Tracebacks - -Rich can render [beautiful tracebacks](https://rich.readthedocs.io/en/latest/traceback.html) which are easier to read and show more code than standard Python tracebacks. You can set Rich as the default traceback handler so all uncaught exceptions will be rendered by Rich. - -Here's what it looks like on OSX (similar on Linux): - -![traceback](https://github.com/willmcgugan/rich/raw/master/imgs/traceback.png) - -
- -All Rich renderables make use of the [Console Protocol](https://rich.readthedocs.io/en/latest/protocol.html), which you can also use to implement your own Rich content. - -# Rich for enterprise - -Available as part of the Tidelift Subscription. - -The maintainers of Rich and thousands of other packages are working with Tidelift to deliver commercial support and maintenance for the open source packages you use to build your applications. Save time, reduce risk, and improve code health, while paying the maintainers of the exact packages you use. [Learn more.](https://tidelift.com/subscription/pkg/pypi-rich?utm_source=pypi-rich&utm_medium=referral&utm_campaign=enterprise&utm_term=repo) - -# Project using Rich - -Here are a few projects using Rich: - -- [BrancoLab/BrainRender](https://github.com/BrancoLab/BrainRender) - a python package for the visualization of three dimensional neuro-anatomical data -- [Ciphey/Ciphey](https://github.com/Ciphey/Ciphey) - Automated decryption tool -- [emeryberger/scalene](https://github.com/emeryberger/scalene) - a high-performance, high-precision CPU and memory profiler for Python -- [hedythedev/StarCli](https://github.com/hedythedev/starcli) - Browse GitHub trending projects from your command line -- [intel/cve-bin-tool](https://github.com/intel/cve-bin-tool) - This tool scans for a number of common, vulnerable components (openssl, libpng, libxml2, expat and a few others) to let you know if your system includes common libraries with known vulnerabilities. -- [nf-core/tools](https://github.com/nf-core/tools) - Python package with helper tools for the nf-core community. -- [cansarigol/pdbr](https://github.com/cansarigol/pdbr) - pdb + Rich library for enhanced debugging -- [plant99/felicette](https://github.com/plant99/felicette) - Satellite imagery for dummies. -- [seleniumbase/SeleniumBase](https://github.com/seleniumbase/SeleniumBase) - Automate & test 10x faster with Selenium & pytest. Batteries included. -- [smacke/ffsubsync](https://github.com/smacke/ffsubsync) - Automagically synchronize subtitles with video. -- [tryolabs/norfair](https://github.com/tryolabs/norfair) - Lightweight Python library for adding real-time 2D object tracking to any detector. -- [ansible/ansible-lint](https://github.com/ansible/ansible-lint) Ansible-lint checks playbooks for practices and behaviour that could potentially be improved -- [ansible-community/molecule](https://github.com/ansible-community/molecule) Ansible Molecule testing framework -- +[Many more](https://github.com/willmcgugan/rich/network/dependents)! - - diff --git a/old examples/simple.py b/old examples/simple.py deleted file mode 100644 index 0d75c5190..000000000 --- a/old examples/simple.py +++ /dev/null @@ -1,51 +0,0 @@ -from rich.markdown import Markdown - -from textual.app import App -from textual.widgets import Header, Footer, Placeholder, ScrollView - - -class MyApp(App): - """An example of a very simple Textual App""" - - stylesheet = """ - - App > View { - layout: dock - } - - #body { - padding: 1 - } - - #sidebar { - edge left - size: 40 - } - - """ - - async def on_load(self) -> None: - """Bind keys with the app loads (but before entering application mode)""" - await self.bind("b", "view.toggle('sidebar')", "Toggle sidebar") - await self.bind("q", "quit", "Quit") - - async def on_mount(self) -> None: - """Create and dock the widgets.""" - - body = ScrollView() - await self.screen.mount( - Header(), - Footer(), - body=body, - sidebar=Placeholder(), - ) - - async def get_markdown(filename: str) -> None: - with open(filename, "rt") as fh: - readme = Markdown(fh.read(), hyperlinks=True) - await body.update(readme) - - await self.call_later(get_markdown, "richreadme.md") - - -MyApp.run(title="Simple App", log_path="textual.log") diff --git a/old examples/theme.css b/old examples/theme.css deleted file mode 100644 index 3f852c16f..000000000 --- a/old examples/theme.css +++ /dev/null @@ -1,7 +0,0 @@ -Header { - border: solid #122233; -} - -App > View > Widget { - display: none; -} diff --git a/sandbox/align.py b/sandbox/align.py index c9a73a733..f3c3dc0f0 100644 --- a/sandbox/align.py +++ b/sandbox/align.py @@ -11,6 +11,8 @@ class Thing(Widget): class AlignApp(App): + CSS_PATH = "align.css" + def on_load(self): self.bind("t", "log_tree") @@ -23,7 +25,6 @@ class AlignApp(App): self.log(self.screen.tree) -app = AlignApp(css_path="align.css") - if __name__ == "__main__": + app = AlignApp(css_path="align.css") app.run() diff --git a/sandbox/auto_test.py b/sandbox/auto_test.py index 594985a89..c3a071801 100644 --- a/sandbox/auto_test.py +++ b/sandbox/auto_test.py @@ -8,13 +8,14 @@ TEXT = Text.from_markup(" ".join(str(n) * 5 for n in range(12))) class AutoApp(App): + CSS_PATH = "auto_test.css" + def compose(self) -> ComposeResult: yield Vertical( Static(TEXT, classes="test"), Static(TEXT, id="test", classes="test") ) -app = AutoApp(css_path="auto_test.css") - if __name__ == "__main__": + app = AutoApp() app.run() diff --git a/sandbox/borders.py b/sandbox/borders.py index e67456ffa..7dcb2dacd 100644 --- a/sandbox/borders.py +++ b/sandbox/borders.py @@ -61,7 +61,6 @@ class MyTestApp(App): self.bind("q", "quit") -app = MyTestApp() - if __name__ == "__main__": + app = MyTestApp() app.run() diff --git a/sandbox/darren/file_search.py b/sandbox/darren/file_search.py index c008b3d17..ab93b29fb 100644 --- a/sandbox/darren/file_search.py +++ b/sandbox/darren/file_search.py @@ -58,7 +58,7 @@ class FileSearchApp(App): self.mount(file_table_wrapper=Widget(self.file_table)) self.mount(search_bar=self.search_bar) - def on_text_widget_base_changed(self, event: TextWidgetBase.Changed) -> None: + def on_text_input_changed(self, event: TextInput.Changed) -> None: self.file_table.filter = event.value diff --git a/sandbox/input.py b/sandbox/input.py index 5cfba8edc..5b09e1364 100644 --- a/sandbox/input.py +++ b/sandbox/input.py @@ -48,7 +48,7 @@ class InputApp(App[str]): ) self.mount(text_area=TextArea()) - def on_text_widget_base_changed(self, event: TextWidgetBase.Changed) -> None: + def on_text_input_changed_changed(self, event: TextInput.Changed) -> None: try: value = float(event.value) except ValueError: diff --git a/sandbox/will/basic.css b/sandbox/will/basic.css index 88de0d535..e69cdf021 100644 --- a/sandbox/will/basic.css +++ b/sandbox/will/basic.css @@ -13,8 +13,7 @@ } App > Screen { - - background: $background; + color: $text; layers: base sidebar; layout: vertical; @@ -22,10 +21,11 @@ App > Screen { } #tree-container { + background: $panel; overflow-y: auto; height: 20; margin: 1 2; - background: $surface; + padding: 1 2; } @@ -36,13 +36,18 @@ DirectoryTree { } - +#table-container { + background: $panel; + height: auto; + margin: 1 2; +} DataTable { /*border:heavy red;*/ /* tint: 10% green; */ /* text-opacity: 50%; */ - padding: 1; + background: $surface; + padding: 1 2; margin: 1 2; height: 24; } @@ -101,7 +106,7 @@ Tweet { /* border: outer $primary; */ padding: 1; border: wide $panel; - overflow: auto; + /* scrollbar-gutter: stable; */ align-horizontal: center; box-sizing: border-box; @@ -138,8 +143,14 @@ TweetBody { padding: 0 1 0 0; } +Tweet.scroll-horizontal { + + overflow-x: auto; +} + Tweet.scroll-horizontal TweetBody { width: 350; + } .button { @@ -182,7 +193,7 @@ Tweet.scroll-horizontal TweetBody { #sidebar .content { - layout: vertical + layout: vertical; } OptionItem { diff --git a/sandbox/will/basic.py b/sandbox/will/basic.py index 47d9b23a6..a4adb9d76 100644 --- a/sandbox/will/basic.py +++ b/sandbox/will/basic.py @@ -7,7 +7,7 @@ from textual.app import App, ComposeResult from textual.reactive import Reactive from textual.widget import Widget from textual.widgets import Static, DataTable, DirectoryTree, Header, Footer -from textual.layout import Container +from textual.layout import Container, Vertical CODE = ''' from __future__ import annotations @@ -68,38 +68,38 @@ lorem_short_text = Text.from_markup(lorem_short) lorem_long_text = Text.from_markup(lorem * 2) -class TweetHeader(Widget): +class TweetHeader(Static): def render(self) -> RenderableType: return Text("Lorem Impsum", justify="center") -class TweetBody(Widget): +class TweetBody(Static): short_lorem = Reactive(False) def render(self) -> Text: return lorem_short_text if self.short_lorem else lorem_long_text -class Tweet(Widget): +class Tweet(Vertical): pass -class OptionItem(Widget): +class OptionItem(Static): def render(self) -> Text: return Text("Option") -class Error(Widget): +class Error(Static): def render(self) -> Text: return Text("This is an error message", justify="center") -class Warning(Widget): +class Warning(Static): def render(self) -> Text: return Text("This is a warning message", justify="center") -class Success(Widget): +class Success(Static): def render(self) -> Text: return Text("This is a success message", justify="center") @@ -120,17 +120,22 @@ class BasicApp(App, css_path="basic.css"): table = DataTable() self.scroll_to_target = Tweet(TweetBody()) - yield Container( + yield Vertical( Tweet(TweetBody()), - Widget( + Container( Static( - Syntax(CODE, "python", line_numbers=True, indent_guides=True), + Syntax( + CODE, + "python", + line_numbers=True, + indent_guides=True, + ), classes="code", ), classes="scrollable", ), - table, - Widget(DirectoryTree("~/"), id="tree-container"), + Container(table, id="table-container"), + Container(DirectoryTree("~/"), id="tree-container"), Error(), Tweet(TweetBody(), classes="scrollbar-size-custom"), Warning(), @@ -143,12 +148,12 @@ class BasicApp(App, css_path="basic.css"): Tweet(TweetBody(), classes="scroll-horizontal"), ) yield Widget( - Widget(classes="title"), - Widget(classes="user"), + Static("Title", classes="title"), + Static("Content", classes="user"), OptionItem(), OptionItem(), OptionItem(), - Widget(classes="content"), + Static(classes="content"), id="sidebar", ) yield Footer() diff --git a/sandbox/will/scroll.py b/sandbox/will/scroll.py deleted file mode 100644 index d4b102201..000000000 --- a/sandbox/will/scroll.py +++ /dev/null @@ -1,44 +0,0 @@ -from textual import layout, events -from textual.app import App, ComposeResult -from textual.widgets import Button - - -class ButtonsApp(App[str]): - def compose(self) -> ComposeResult: - yield layout.Vertical( - Button("default", id="foo"), - Button("Where there is a Will"), - Button("There is a Way"), - Button("There can be only one"), - Button.success("success", id="bar"), - layout.Horizontal( - Button("Where there is a Will"), - Button("There is a Way"), - Button("There can be only one"), - Button.warning("warning", id="baz"), - Button("Where there is a Will"), - Button("There is a Way"), - Button("There can be only one"), - id="scroll", - ), - Button.error("error", id="baz"), - Button("Where there is a Will"), - Button("There is a Way"), - Button("There can be only one"), - ) - - def on_button_pressed(self, event: Button.Pressed) -> None: - self.app.bell() - - async def on_key(self, event: events.Key) -> None: - await self.dispatch_key(event) - - def key_d(self): - self.dark = not self.dark - - -app = ButtonsApp(log_path="textual.log", css_path="buttons.css", watch_css=True) - -if __name__ == "__main__": - result = app.run() - print(repr(result)) diff --git a/sandbox/will/scrolly.py b/sandbox/will/scrolly.py new file mode 100644 index 000000000..d97c1ea4f --- /dev/null +++ b/sandbox/will/scrolly.py @@ -0,0 +1,32 @@ +from rich.text import Text +from textual.app import App, ComposeResult +from textual.widgets import Static + +text = "\n".join("FOO BAR bazz etc sdfsdf " * 20 for n in range(1000)) + + +class Content(Static): + DEFAULT_CSS = """ + Content { + width: auto; + } + """ + + def render(self): + return Text(text, no_wrap=False) + + +class ScrollApp(App): + CSS = """ + Screen { + overflow: auto; + } + """ + + def compose(self) -> ComposeResult: + yield Content() + + +app = ScrollApp() +if __name__ == "__main__": + app.run() diff --git a/src/textual/_animator.py b/src/textual/_animator.py index 2467b0efe..f4df6089f 100644 --- a/src/textual/_animator.py +++ b/src/textual/_animator.py @@ -117,7 +117,7 @@ class BoundAnimator: def __call__( self, attribute: str, - value: float, + value: float | Animatable, *, final_value: object = ..., duration: float | None = None, diff --git a/src/textual/_cache.py b/src/textual/_cache.py index f025a08b4..2f9bdd49d 100644 --- a/src/textual/_cache.py +++ b/src/textual/_cache.py @@ -45,6 +45,14 @@ class LRUCache(Generic[CacheKey, CacheValue]): self._lock = Lock() super().__init__() + @property + def maxsize(self) -> int: + return self._maxsize + + @maxsize.setter + def maxsize(self, maxsize: int) -> None: + self._maxsize = maxsize + def __bool__(self) -> bool: return bool(self._cache) diff --git a/src/textual/_doc.py b/src/textual/_doc.py index 8c2901dd4..0d1a4b9d8 100644 --- a/src/textual/_doc.py +++ b/src/textual/_doc.py @@ -1,9 +1,12 @@ from __future__ import annotations -import runpy import os +import runpy import shlex from typing import cast, TYPE_CHECKING, Iterable +from typing import TYPE_CHECKING, cast + +from textual._import_app import AppFail, import_app if TYPE_CHECKING: from textual.app import App @@ -51,14 +54,7 @@ def take_svg_screenshot( os.environ["COLUMNS"] = str(columns) os.environ["LINES"] = str(rows) - - app_vars = runpy.run_path(app_path) - if "sys" in app_vars: - cmd: list[str] = shlex.split(app_path) - app_vars["sys"].argv = cmd - - app: App = cast("App", app_vars["app"]) - + app = import_app(app_path) if title is None: title = app.title @@ -76,9 +72,10 @@ def take_svg_screenshot( def rich(source, language, css_class, options, md, attrs, **kwargs) -> str: """A superfences formatter to insert an SVG screenshot.""" - from rich.console import Console import io + from rich.console import Console + title = attrs.get("title", "Rich") console = Console( @@ -94,7 +91,7 @@ def rich(source, language, css_class, options, md, attrs, **kwargs) -> str: exec(source, globals) except Exception: error_console.print_exception() - console.bell() + # console.bell() if "output" in globals: console.print(globals["output"]) diff --git a/src/textual/_import_app.py b/src/textual/_import_app.py new file mode 100644 index 000000000..154fc7198 --- /dev/null +++ b/src/textual/_import_app.py @@ -0,0 +1,101 @@ +from __future__ import annotations + +import os +import runpy +import shlex +from typing import cast, TYPE_CHECKING + + +if TYPE_CHECKING: + from textual.app import App + + +class AppFail(Exception): + pass + + +def import_app(import_name: str) -> App: + """Import an app from a path or import name. + + Args: + import_name (str): A name to import, such as `foo.bar`, or a path ending with .py. + + Raises: + AppFail: If the app could not be found for any reason. + + Returns: + App: A Textual application + """ + + import inspect + import importlib + import sys + + from textual.app import App + + import_name, *argv = shlex.split(import_name) + lib, _colon, name = import_name.partition(":") + + if lib.endswith(".py"): + path = os.path.abspath(lib) + try: + global_vars = runpy.run_path(path, {}) + except Exception as error: + raise AppFail(str(error)) + + if "sys" in global_vars: + global_vars["sys"].argv = [path, *argv] + + if name: + # User has given a name, use that + try: + app = global_vars[name] + except KeyError: + raise AppFail(f"App {name!r} not found in {lib!r}") + else: + # User has not given a name + if "app" in global_vars: + # App exists, lets use that + try: + app = global_vars["app"] + except KeyError: + raise AppFail(f"App {name!r} not found in {lib!r}") + else: + # Find a App class or instance that is *not* the base class + apps = [ + value + for value in global_vars.values() + if ( + isinstance(value, App) + or (inspect.isclass(value) and issubclass(value, App)) + and value is not App + ) + ] + if not apps: + raise AppFail( + f'Unable to find app in {lib!r}, try specifying app with "foo.py:app"' + ) + if len(apps) > 1: + raise AppFail( + f'Multiple apps found {lib!r}, try specifying app with "foo.py:app"' + ) + app = apps[0] + app._BASE_PATH = path + + else: + # Assuming the user wants to import the file + sys.path.append("") + try: + module = importlib.import_module(lib) + except ImportError as error: + raise AppFail(str(error)) + + try: + app = getattr(module, name or "app") + except AttributeError: + raise AppFail(f"Unable to find {name!r} in {module!r}") + + if inspect.isclass(app) and issubclass(app, App): + app = app() + + return cast(App, app) diff --git a/src/textual/_path.py b/src/textual/_path.py index 3a0f5f4bc..28a9ba1bc 100644 --- a/src/textual/_path.py +++ b/src/textual/_path.py @@ -24,7 +24,10 @@ def _make_path_object_relative(path: str | PurePath, obj: object) -> Path: return path # Otherwise (relative path), resolve it relative to obj... - subclass_module = sys.modules[obj.__module__] - subclass_path = Path(inspect.getfile(subclass_module)) + base_path = getattr(obj, "_BASE_PATH", None) + if base_path is not None: + subclass_path = Path(base_path) + else: + subclass_path = Path(inspect.getfile(obj.__class__)) resolved_path = (subclass_path.parent / path).resolve() return resolved_path diff --git a/src/textual/_types.py b/src/textual/_types.py index 7158e31a4..1dd59297c 100644 --- a/src/textual/_types.py +++ b/src/textual/_types.py @@ -17,7 +17,7 @@ class MessageTarget(Protocol): async def post_message(self, message: "Message") -> bool: ... - async def post_priority_message(self, message: "Message") -> bool: + async def _post_priority_message(self, message: "Message") -> bool: ... def post_message_no_wait(self, message: "Message") -> bool: diff --git a/src/textual/app.py b/src/textual/app.py index de4a90ac0..44d073362 100644 --- a/src/textual/app.py +++ b/src/textual/app.py @@ -151,6 +151,7 @@ class App(Generic[ReturnType], DOMNode): SCREENS: dict[str, Screen] = {} + _BASE_PATH: str | None = None CSS_PATH: str | None = None focused: Reactive[Widget | None] = Reactive(None) @@ -231,12 +232,6 @@ class App(Generic[ReturnType], DOMNode): ) self._screenshot: str | None = None - def __init_subclass__( - cls, css_path: str | None = None, inherit_css: bool = True - ) -> None: - super().__init_subclass__(inherit_css=inherit_css) - cls.CSS_PATH = css_path - title: Reactive[str] = Reactive("Textual") sub_title: Reactive[str] = Reactive("") dark: Reactive[bool] = Reactive(True) @@ -579,7 +574,7 @@ class App(Generic[ReturnType], DOMNode): filename (str | None, optional): Filename of SVG screenshot, or None to auto-generate a filename with the date and time. Defaults to None. path (str, optional): Path to directory for output. Defaults to current working directory. - time_format(str, optional): Time format to use if filename is None. Defaults to "%Y-%m-%d %X %f". + time_format (str, optional): Time format to use if filename is None. Defaults to "%Y-%m-%d %X %f". Returns: str: Filename of screenshot. @@ -1209,6 +1204,8 @@ class App(Generic[ReturnType], DOMNode): apply_stylesheet = self.stylesheet.apply for widget_id, widget in name_widgets: + if not isinstance(widget, Widget): + raise AppError(f"Can't register {widget!r}; expected a Widget instance") if widget not in self._registry: if widget_id is not None: widget.id = widget_id @@ -1299,21 +1296,6 @@ class App(Generic[ReturnType], DOMNode): self._end_update() console.file.flush() - def measure(self, renderable: RenderableType, max_width=100_000) -> int: - """Get the optimal width for a widget or renderable. - - Args: - renderable (RenderableType): A renderable (including Widget) - max_width ([type], optional): Maximum width. Defaults to 100_000. - - Returns: - int: Number of cells required to render. - """ - measurement = Measurement.get( - self.console, self.console.options.update(max_width=max_width), renderable - ) - return measurement.maximum - def get_widget_at(self, x: int, y: int) -> tuple[Widget, Region]: """Get the widget under the given coordinates. diff --git a/src/textual/cli/cli.py b/src/textual/cli/cli.py index d83275b47..7b856b689 100644 --- a/src/textual/cli/cli.py +++ b/src/textual/cli/cli.py @@ -1,15 +1,11 @@ from __future__ import annotations -import os -import runpy -import shlex -from typing import cast, TYPE_CHECKING - -from importlib_metadata import version +from typing import TYPE_CHECKING import click - +from importlib_metadata import version from textual.devtools.server import _run_devtools +from textual._import_app import import_app, AppFail if TYPE_CHECKING: from textual.app import App @@ -36,96 +32,6 @@ def console(verbose: bool, exclude: list[str]) -> None: console.show_cursor(True) -class AppFail(Exception): - pass - - -def import_app(import_name: str) -> App: - """Import an app from it's import name. - - Args: - import_name (str): A name to import, such as `foo.bar` - - Raises: - AppFail: If the app could not be found for any reason. - - Returns: - App: A Textual application - """ - - import inspect - import importlib - import sys - - from textual.app import App - - import_name, *argv = shlex.split(import_name) - lib, _colon, name = import_name.partition(":") - - if lib.endswith(".py"): - path = os.path.abspath(lib) - try: - global_vars = runpy.run_path(path, {}) - except Exception as error: - raise AppFail(str(error)) - - if "sys" in global_vars: - global_vars["sys"].argv = [path, *argv] - - if name: - # User has given a name, use that - try: - app = global_vars[name] - except KeyError: - raise AppFail(f"App {name!r} not found in {lib!r}") - else: - # User has not given a name - if "app" in global_vars: - # App exists, lets use that - try: - app = global_vars["app"] - except KeyError: - raise AppFail(f"App {name!r} not found in {lib!r}") - else: - # Find a App class or instance that is *not* the base class - apps = [ - value - for value in global_vars.values() - if ( - isinstance(value, App) - or (inspect.isclass(value) and issubclass(value, App)) - and value is not App - ) - ] - if not apps: - raise AppFail( - f'Unable to find app in {lib!r}, try specifying app with "foo.py:app"' - ) - if len(apps) > 1: - raise AppFail( - f'Multiple apps found {lib!r}, try specifying app with "foo.py:app"' - ) - app = apps[0] - - else: - # Assuming the user wants to import the file - sys.path.append("") - try: - module = importlib.import_module(lib) - except ImportError as error: - raise AppFail(str(error)) - - try: - app = getattr(module, name or "app") - except AttributeError: - raise AppFail(f"Unable to find {name!r} in {module!r}") - - if inspect.isclass(app) and issubclass(app, App): - app = app() - - return cast(App, app) - - @run.command( "run", context_settings={ diff --git a/src/textual/cli/previews/borders.py b/src/textual/cli/previews/borders.py index d2d4123fe..53772d754 100644 --- a/src/textual/cli/previews/borders.py +++ b/src/textual/cli/previews/borders.py @@ -18,6 +18,7 @@ class BorderButtons(layout.Vertical): BorderButtons { dock: left; width: 24; + overflow-y: scroll; } BorderButtons > Button { @@ -34,8 +35,8 @@ class BorderButtons(layout.Vertical): class BorderApp(App): """Demonstrates the border styles.""" - DEFAULT_CSS = """ - Static { + CSS = """ + #text { margin: 2 4; padding: 2 4; border: solid $secondary; @@ -47,7 +48,7 @@ class BorderApp(App): def compose(self): yield BorderButtons() - self.text = Static(TEXT) + self.text = Static(TEXT, id="text") yield self.text def on_button_pressed(self, event: Button.Pressed) -> None: diff --git a/src/textual/cli/previews/easing.css b/src/textual/cli/previews/easing.css index 3f602b656..83277d566 100644 --- a/src/textual/cli/previews/easing.css +++ b/src/textual/cli/previews/easing.css @@ -3,7 +3,7 @@ EasingButtons > Button { } EasingButtons { dock: left; - overflow: auto auto; + overflow-y: scroll; width: 20; } diff --git a/src/textual/cli/previews/easing.py b/src/textual/cli/previews/easing.py index a8703fce1..56399ddde 100644 --- a/src/textual/cli/previews/easing.py +++ b/src/textual/cli/previews/easing.py @@ -111,7 +111,7 @@ class EasingApp(App): self.animated_bar.position = value self.opacity_widget.styles.opacity = 1 - value / END_POSITION - def on_text_widget_base_changed(self, event: TextWidgetBase.Changed): + def on_text_input_changed(self, event: TextInput.Changed): if event.sender.id == "duration-input": new_duration = _try_float(event.value) if new_duration is not None: diff --git a/src/textual/css/styles.py b/src/textual/css/styles.py index 64c636501..0c94e445c 100644 --- a/src/textual/css/styles.py +++ b/src/textual/css/styles.py @@ -10,8 +10,8 @@ from typing import TYPE_CHECKING, Any, Iterable, NamedTuple, cast import rich.repr from rich.style import Style -from textual._types import CallbackType -from .._animator import Animation, EasingFunction +from .._types import CallbackType +from .._animator import Animation, EasingFunction, BoundAnimator from ..color import Color from ..geometry import Offset, Spacing from ._style_properties import ( @@ -850,6 +850,7 @@ class RenderStyles(StylesBase): self.node = node self._base_styles = base self._inline_styles = inline_styles + self._animate: BoundAnimator | None = None @property def base(self) -> Styles: @@ -867,6 +868,23 @@ class RenderStyles(StylesBase): assert self.node is not None return self.node.rich_style + @property + def animate(self) -> BoundAnimator: + """Get an animator to animate style. + + Example: + ```python + self.animate("brightness", 0.5) + ``` + + Returns: + BoundAnimator: An animator bound to this widget. + """ + if self._animate is None: + self._animate = self.node.app.animator.bind(self) + assert self._animate is not None + return self._animate + def __rich_repr__(self) -> rich.repr.Result: for rule_name in RULE_NAMES: if self.has_rule(rule_name): diff --git a/src/textual/design.py b/src/textual/design.py index 9a3749b1d..36b01a622 100644 --- a/src/textual/design.py +++ b/src/textual/design.py @@ -174,8 +174,6 @@ class ColorSystem: for name, color in COLORS: is_dark_shade = dark and name in DARK_SHADES spread = luminosity_spread - if name == "panel": - spread /= 2 for shade_name, luminosity_delta in luminosity_range(spread): if is_dark_shade: dark_background = background.blend(color, 0.15) @@ -188,8 +186,8 @@ class ColorSystem: colors[f"{name}{shade_name}"] = shade_color.hex colors["text"] = "auto 95%" - colors["text-muted"] = "auto 80%" - colors["text-disabled"] = "auto 60%" + colors["text-muted"] = "auto 50%" + colors["text-disabled"] = "auto 30%" return colors diff --git a/src/textual/events.py b/src/textual/events.py index d58c9c649..a110fd142 100644 --- a/src/textual/events.py +++ b/src/textual/events.py @@ -20,13 +20,12 @@ if TYPE_CHECKING: @rich.repr.auto class Event(Message): + """The base class for all events.""" + def __rich_repr__(self) -> rich.repr.Result: return yield - def __init_subclass__(cls, bubble: bool = True, verbose: bool = False) -> None: - super().__init_subclass__(bubble=bubble, verbose=verbose) - @rich.repr.auto class Callback(Event, bubble=False, verbose=True): diff --git a/src/textual/message.py b/src/textual/message.py index 63be90749..237874a1a 100644 --- a/src/textual/message.py +++ b/src/textual/message.py @@ -6,7 +6,7 @@ import rich.repr from . import _clock from .case import camel_to_snake -from ._types import MessageTarget +from ._types import MessageTarget as MessageTarget @rich.repr.auto @@ -36,7 +36,7 @@ class Message: def __init__(self, sender: MessageTarget) -> None: self.sender = sender - self.name = camel_to_snake(self.__class__.__name__.replace("Message", "")) + self.name = camel_to_snake(self.__class__.__name__) self.time = _clock.get_time_no_wait() self._forwarded = False self._no_default_action = False @@ -71,10 +71,11 @@ class Message: @property def handler_name(self) -> str: + """The name of the handler associated with this message.""" # Property to make it read only return self._handler_name - def set_forwarded(self) -> None: + def _set_forwarded(self) -> None: """Mark this event as being forwarded.""" self._forwarded = True @@ -90,7 +91,8 @@ class Message: return False def prevent_default(self, prevent: bool = True) -> Message: - """Suppress the default action. + """Suppress the default action(s). This will prevent handlers in any base classes + from being called. Args: prevent (bool, optional): True if the default action should be suppressed, diff --git a/src/textual/message_pump.py b/src/textual/message_pump.py index 664546c79..c53a68373 100644 --- a/src/textual/message_pump.py +++ b/src/textual/message_pump.py @@ -364,7 +364,7 @@ class MessagePump(metaclass=MessagePumpMeta): if isinstance(message, Event): await self.on_event(message) else: - await self.on_message(message) + await self._on_message(message) def _get_dispatch_methods( self, method_name: str, message: Message @@ -390,9 +390,9 @@ class MessagePump(metaclass=MessagePumpMeta): Args: event (events.Event): An Event object. """ - await self.on_message(event) + await self._on_message(event) - async def on_message(self, message: Message) -> None: + async def _on_message(self, message: Message) -> None: """Called to process a message. Args: @@ -444,7 +444,7 @@ class MessagePump(metaclass=MessagePumpMeta): # TODO: This may not be needed, or may only be needed by the timer # Consider removing or making private - async def post_priority_message(self, message: Message) -> bool: + async def _post_priority_message(self, message: Message) -> bool: """Post a "priority" messages which will be processes prior to regular messages. Note that you should rarely need this in a regular app. It exists primarily to allow @@ -494,6 +494,14 @@ class MessagePump(metaclass=MessagePumpMeta): await invoke(event.callback) def emit_no_wait(self, message: Message) -> bool: + """Send a message to the _parent_, non async version. + + Args: + message (Message): A message object. + + Returns: + bool: True if the message was posted successfully. + """ if self._parent: return self._parent._post_message_from_child_no_wait(message) else: @@ -506,7 +514,7 @@ class MessagePump(metaclass=MessagePumpMeta): message (Message): A message object. Returns: - bool: _True if the message was posted successfully. + bool: True if the message was posted successfully. """ if self._parent: return await self._parent._post_message_from_child(message) diff --git a/src/textual/messages.py b/src/textual/messages.py index e744e19c2..2b1ff4792 100644 --- a/src/textual/messages.py +++ b/src/textual/messages.py @@ -30,7 +30,7 @@ class Update(Message, verbose=True): def can_replace(self, message: Message) -> bool: # Update messages can replace update for the same widget - return isinstance(message, Update) and self == message + return isinstance(message, Update) and self.widget == message.widget @rich.repr.auto diff --git a/src/textual/reactive.py b/src/textual/reactive.py index 7859ec784..53694076a 100644 --- a/src/textual/reactive.py +++ b/src/textual/reactive.py @@ -94,8 +94,9 @@ class Reactive(Generic[ReactiveType]): for key in obj.__class__.__dict__.keys(): if startswith(key, "_init_"): name = key[6:] - default = getattr(obj, key) - setattr(obj, name, default() if callable(default) else default) + if not hasattr(obj, name): + default = getattr(obj, key) + setattr(obj, name, default() if callable(default) else default) def __set_name__(self, owner: Type[MessageTarget], name: str) -> None: diff --git a/src/textual/render.py b/src/textual/render.py new file mode 100644 index 000000000..5de558857 --- /dev/null +++ b/src/textual/render.py @@ -0,0 +1,21 @@ +from rich.console import Console, RenderableType +from rich.protocol import rich_cast + + +def measure(console: Console, renderable: RenderableType, default: int) -> int: + """Measure a rich renderable. + + Args: + console (Console): A console object. + renderable (RenderableType): Rich renderable. + default (int): Default width to use if renderable does not expose dimensions. + + Returns: + int: Width in cells + """ + renderable = rich_cast(renderable) + get_console_width = getattr(renderable, "__rich_measure__", None) + if get_console_width is not None: + render_width = get_console_width(console, console.options).normalize().maximum + return max(0, render_width) + return default diff --git a/src/textual/screen.py b/src/textual/screen.py index eab12c4f1..c1a1e66e5 100644 --- a/src/textual/screen.py +++ b/src/textual/screen.py @@ -220,6 +220,7 @@ class Screen(Widget): self, unclipped_region.size, virtual_size, container_size ) ) + except Exception as error: self.app._handle_exception(error) return @@ -279,13 +280,13 @@ class Screen(Widget): screen_y=event.screen_y, style=event.style, ) - mouse_event.set_forwarded() + mouse_event._set_forwarded() await widget._forward_event(mouse_event) async def _forward_event(self, event: events.Event) -> None: if event.is_forwarded: return - event.set_forwarded() + event._set_forwarded() if isinstance(event, (events.Enter, events.Leave)): await self.post_message(event) @@ -310,7 +311,7 @@ class Screen(Widget): return event.style = self.get_style_at(event.screen_x, event.screen_y) if widget is self: - event.set_forwarded() + event._set_forwarded() await self.post_message(event) else: await widget._forward_event(event.offset(-region.x, -region.y)) diff --git a/src/textual/scroll_view.py b/src/textual/scroll_view.py index 34eb72987..dc0842ce1 100644 --- a/src/textual/scroll_view.py +++ b/src/textual/scroll_view.py @@ -68,6 +68,25 @@ class ScrollView(Widget): """ return self.virtual_size.height + def watch_virtual_size(self, virtual_size: Size) -> None: + self._scroll_update(virtual_size) + + def watch_show_horizontal_scrollbar(self, value: bool) -> None: + """Watch function for show_horizontal_scrollbar attribute. + + Args: + value (bool): Show horizontal scrollbar flag. + """ + self.refresh(layout=True) + + def watch_show_vertical_scrollbar(self, value: bool) -> None: + """Watch function for show_vertical_scrollbar attribute. + + Args: + value (bool): Show vertical scrollbar flag. + """ + self.refresh(layout=True) + def _size_updated( self, size: Size, virtual_size: Size, container_size: Size ) -> None: @@ -78,27 +97,12 @@ class ScrollView(Widget): virtual_size (Size): New virtual size. container_size (Size): New container size. """ + virtual_size = self.virtual_size if self._size != size: self._size = size - self._container_size = container_size - - self._refresh_scrollbars() - width, height = self.container_size - if self.show_vertical_scrollbar: - self.vertical_scrollbar.window_virtual_size = virtual_size.height - self.vertical_scrollbar.window_size = ( - height - self.scrollbar_size_horizontal - ) - if self.show_horizontal_scrollbar: - self.horizontal_scrollbar.window_virtual_size = virtual_size.width - self.horizontal_scrollbar.window_size = ( - width - self.scrollbar_size_vertical - ) - - self.scroll_x = self.validate_scroll_x(self.scroll_x) - self.scroll_y = self.validate_scroll_y(self.scroll_y) - self.refresh(layout=False) + self._container_size = size + self._scroll_update(virtual_size) self.scroll_to(self.scroll_x, self.scroll_y) def render(self) -> RenderableType: diff --git a/src/textual/scrollbar.py b/src/textual/scrollbar.py index c223ca73b..d5b989d32 100644 --- a/src/textual/scrollbar.py +++ b/src/textual/scrollbar.py @@ -225,7 +225,9 @@ class ScrollBar(Widget): scrollbar_style = Style.from_color(color.rich_color, background.rich_color) return ScrollBarRender( virtual_size=self.window_virtual_size, - window_size=self.window_size, + window_size=( + self.window_size if self.window_size < self.window_virtual_size else 0 + ), position=self.position, thickness=self.thickness, vertical=self.vertical, diff --git a/src/textual/timer.py b/src/textual/timer.py index 32edb3886..d99a016da 100644 --- a/src/textual/timer.py +++ b/src/textual/timer.py @@ -167,4 +167,4 @@ class Timer: count=count, callback=self._callback, ) - await self.target.post_priority_message(event) + await self.target._post_priority_message(event) diff --git a/src/textual/widget.py b/src/textual/widget.py index ea5edc37f..dcd079091 100644 --- a/src/textual/widget.py +++ b/src/textual/widget.py @@ -7,8 +7,13 @@ from operator import attrgetter from typing import TYPE_CHECKING, ClassVar, Collection, Iterable, NamedTuple, cast import rich.repr -from rich.console import Console, ConsoleRenderable, JustifyMethod, RenderableType -from rich.measure import Measurement +from rich.console import ( + Console, + ConsoleRenderable, + RichCast, + JustifyMethod, + RenderableType, +) from rich.segment import Segment from rich.style import Style from rich.styled import Styled @@ -30,6 +35,7 @@ from .geometry import Offset, Region, Size, Spacing, clamp from .layouts.vertical import VerticalLayout from .message import Message from .reactive import Reactive +from .render import measure if TYPE_CHECKING: from .app import App, ComposeResult @@ -61,7 +67,9 @@ class RenderCache(NamedTuple): @rich.repr.auto class Widget(DOMNode): """ - A Widget is the base class for Textual widgets. Extent this class (or a sub-class) when defining your own widgets. + A Widget is the base class for Textual widgets. + + See also [static][textual.widgets._static.Static] for starting point for your own widgets. """ @@ -71,7 +79,7 @@ class Widget(DOMNode): scrollbar-background-hover: $panel-darken-2; scrollbar-color: $primary-lighten-1; scrollbar-color-active: $warning-darken-1; - scrollbar-corner-color: $panel-darken-3; + scrollbar-corner-color: $panel-darken-1; scrollbar-size-vertical: 2; scrollbar-size-horizontal: 1; } @@ -80,6 +88,7 @@ class Widget(DOMNode): can_focus: bool = False can_focus_children: bool = True + fluid = Reactive(True) def __init__( self, @@ -338,14 +347,12 @@ class Widget(DOMNode): return self._content_width_cache[1] console = self.app.console - renderable = self.post_render(self.render()) + renderable = self._render() + + width = measure(console, renderable, container.width) + if self.fluid: + width = min(width, container.width) - measurement = Measurement.get( - console, - console.options.update_width(container.width), - renderable, - ) - width = measurement.maximum self._content_width_cache = (cache_key, width) return width @@ -458,6 +465,7 @@ class Widget(DOMNode): self._vertical_scrollbar = scroll_bar = ScrollBar( vertical=True, name="vertical", thickness=self.scrollbar_size_vertical ) + self._vertical_scrollbar.display = False self.app._start_widget(self, scroll_bar) return scroll_bar @@ -475,6 +483,7 @@ class Widget(DOMNode): self._horizontal_scrollbar = scroll_bar = ScrollBar( vertical=False, name="horizontal", thickness=self.scrollbar_size_horizontal ) + self._horizontal_scrollbar.display = False self.app._start_widget(self, scroll_bar) return scroll_bar @@ -846,7 +855,7 @@ class Widget(DOMNode): y (int | None, optional): Y coordinate (row) to scroll to, or None for no change. Defaults to None. animate (bool, optional): Animate to new scroll position. Defaults to True. speed (float | None, optional): Speed of scroll if animate is True. Or None to use duration. - duration (float | None, optional): Duration of animation, if animate is True and speed is False. + duration (float | None, optional): Duration of animation, if animate is True and speed is None. Returns: bool: True if the scroll position changed, otherwise False. @@ -888,8 +897,6 @@ class Widget(DOMNode): scroll_y = self.scroll_y self.scroll_target_y = self.scroll_y = y scrolled_y = scroll_y != self.scroll_y - if scrolled_x or scrolled_y: - self.refresh(repaint=False, layout=True) return scrolled_x or scrolled_y @@ -909,7 +916,7 @@ class Widget(DOMNode): y (int | None, optional): Y distance (rows) to scroll, or ``None`` for no change. Defaults to None. animate (bool, optional): Animate to new scroll position. Defaults to False. speed (float | None, optional): Speed of scroll if animate is True. Or None to use duration. - duration (float | None, optional): Duration of animation, if animate is True and speed is False. + duration (float | None, optional): Duration of animation, if animate is True and speed is None. Returns: bool: True if the scroll position changed, otherwise False. @@ -922,143 +929,258 @@ class Widget(DOMNode): duration=duration, ) - def scroll_home(self, *, animate: bool = True) -> bool: + def scroll_home( + self, + *, + animate: bool = True, + speed: float | None = None, + duration: float | None = None, + ) -> bool: """Scroll to home position. Args: animate (bool, optional): Animate scroll. Defaults to True. + speed (float | None, optional): Speed of scroll if animate is True. Or None to use duration. + duration (float | None, optional): Duration of animation, if animate is True and speed is None. Returns: bool: True if any scrolling was done. """ - return self.scroll_to(0, 0, animate=animate, duration=1) + if speed is None and duration is None: + duration = 1.0 + return self.scroll_to(0, 0, animate=animate, speed=speed, duration=duration) - def scroll_end(self, *, animate: bool = True) -> bool: + def scroll_end( + self, + *, + animate: bool = True, + speed: float | None = None, + duration: float | None = None, + ) -> bool: """Scroll to the end of the container. Args: animate (bool, optional): Animate scroll. Defaults to True. + speed (float | None, optional): Speed of scroll if animate is True. Or None to use duration. + duration (float | None, optional): Duration of animation, if animate is True and speed is None. Returns: bool: True if any scrolling was done. """ - return self.scroll_to(0, self.max_scroll_y, animate=animate, duration=1) + if speed is None and duration is None: + duration = 1.0 + return self.scroll_to( + 0, self.max_scroll_y, animate=animate, speed=speed, duration=duration + ) - def scroll_left(self, *, animate: bool = True) -> bool: + def scroll_left( + self, + *, + animate: bool = True, + speed: float | None = None, + duration: float | None = None, + ) -> bool: """Scroll one cell left. Args: animate (bool, optional): Animate scroll. Defaults to True. + speed (float | None, optional): Speed of scroll if animate is True. Or None to use duration. + duration (float | None, optional): Duration of animation, if animate is True and speed is None. Returns: bool: True if any scrolling was done. """ - return self.scroll_to(x=self.scroll_target_x - 1, animate=animate) + return self.scroll_to( + x=self.scroll_target_x - 1, animate=animate, speed=speed, duration=duration + ) - def scroll_right(self, *, animate: bool = True) -> bool: + def scroll_right( + self, + *, + animate: bool = True, + speed: float | None = None, + duration: float | None = None, + ) -> bool: """Scroll on cell right. Args: animate (bool, optional): Animate scroll. Defaults to True. + speed (float | None, optional): Speed of scroll if animate is True. Or None to use duration. + duration (float | None, optional): Duration of animation, if animate is True and speed is None. Returns: bool: True if any scrolling was done. """ - return self.scroll_to(x=self.scroll_target_x + 1, animate=animate) + return self.scroll_to( + x=self.scroll_target_x + 1, animate=animate, speed=speed, duration=duration + ) - def scroll_down(self, *, animate: bool = True) -> bool: + def scroll_down( + self, + *, + animate: bool = True, + speed: float | None = None, + duration: float | None = None, + ) -> bool: """Scroll one line down. Args: animate (bool, optional): Animate scroll. Defaults to True. + speed (float | None, optional): Speed of scroll if animate is True. Or None to use duration. + duration (float | None, optional): Duration of animation, if animate is True and speed is None. Returns: bool: True if any scrolling was done. """ - return self.scroll_to(y=self.scroll_target_y + 1, animate=animate) + return self.scroll_to( + y=self.scroll_target_y + 1, animate=animate, speed=speed, duration=duration + ) - def scroll_up(self, *, animate: bool = True) -> bool: + def scroll_up( + self, + *, + animate: bool = True, + speed: float | None = None, + duration: float | None = None, + ) -> bool: """Scroll one line up. Args: animate (bool, optional): Animate scroll. Defaults to True. + speed (float | None, optional): Speed of scroll if animate is True. Or None to use duration. + duration (float | None, optional): Duration of animation, if animate is True and speed is None. Returns: bool: True if any scrolling was done. """ - return self.scroll_to(y=self.scroll_target_y - 1, animate=animate) + return self.scroll_to( + y=self.scroll_target_y - 1, animate=animate, speed=speed, duration=duration + ) - def scroll_page_up(self, *, animate: bool = True) -> bool: + def scroll_page_up( + self, + *, + animate: bool = True, + speed: float | None = None, + duration: float | None = None, + ) -> bool: """Scroll one page up. Args: animate (bool, optional): Animate scroll. Defaults to True. + speed (float | None, optional): Speed of scroll if animate is True. Or None to use duration. + duration (float | None, optional): Duration of animation, if animate is True and speed is None. Returns: bool: True if any scrolling was done. """ return self.scroll_to( - y=self.scroll_target_y - self.container_size.height, animate=animate + y=self.scroll_target_y - self.container_size.height, + animate=animate, + speed=speed, + duration=duration, ) - def scroll_page_down(self, *, animate: bool = True) -> bool: + def scroll_page_down( + self, + *, + animate: bool = True, + speed: float | None = None, + duration: float | None = None, + ) -> bool: """Scroll one page down. Args: animate (bool, optional): Animate scroll. Defaults to True. + speed (float | None, optional): Speed of scroll if animate is True. Or None to use duration. + duration (float | None, optional): Duration of animation, if animate is True and speed is None. Returns: bool: True if any scrolling was done. """ return self.scroll_to( - y=self.scroll_target_y + self.container_size.height, animate=animate + y=self.scroll_target_y + self.container_size.height, + animate=animate, + speed=speed, + duration=duration, ) - def scroll_page_left(self, *, animate: bool = True) -> bool: + def scroll_page_left( + self, + *, + animate: bool = True, + speed: float | None = None, + duration: float | None = None, + ) -> bool: """Scroll one page left. Args: animate (bool, optional): Animate scroll. Defaults to True. + speed (float | None, optional): Speed of scroll if animate is True. Or None to use duration. + duration (float | None, optional): Duration of animation, if animate is True and speed is None. Returns: bool: True if any scrolling was done. """ + if speed is None and duration is None: + duration = 0.3 return self.scroll_to( x=self.scroll_target_x - self.container_size.width, animate=animate, - duration=0.3, + speed=speed, + duration=duration, ) - def scroll_page_right(self, *, animate: bool = True) -> bool: + def scroll_page_right( + self, + *, + animate: bool = True, + speed: float | None = None, + duration: float | None = None, + ) -> bool: """Scroll one page right. Args: animate (bool, optional): Animate scroll. Defaults to True. + speed (float | None, optional): Speed of scroll if animate is True. Or None to use duration. + duration (float | None, optional): Duration of animation, if animate is True and speed is None. Returns: bool: True if any scrolling was done. """ + if speed is None and duration is None: + duration = 0.3 return self.scroll_to( x=self.scroll_target_x + self.container_size.width, animate=animate, - duration=0.3, + speed=speed, + duration=duration, ) - def scroll_to_widget(self, widget: Widget, *, animate: bool = True) -> bool: + def scroll_to_widget( + self, + widget: Widget, + *, + animate: bool = True, + speed: float | None = None, + duration: float | None = None, + ) -> bool: """Scroll scrolling to bring a widget in to view. Args: widget (Widget): A descendant widget. animate (bool, optional): True to animate, or False to jump. Defaults to True. + speed (float | None, optional): Speed of scroll if animate is True. Or None to use duration. + duration (float | None, optional): Duration of animation, if animate is True and speed is None. Returns: bool: True if any scrolling has occurred in any descendant, otherwise False. @@ -1071,7 +1193,11 @@ class Widget(DOMNode): while isinstance(widget.parent, Widget) and widget is not self: container = widget.parent scroll_offset = container.scroll_to_region( - region, spacing=widget.parent.gutter, animate=animate + region, + spacing=widget.parent.gutter, + animate=animate, + speed=speed, + duration=duration, ) if scroll_offset: scrolled = True @@ -1091,7 +1217,13 @@ class Widget(DOMNode): return scrolled def scroll_to_region( - self, region: Region, *, spacing: Spacing | None = None, animate: bool = True + self, + region: Region, + *, + spacing: Spacing | None = None, + animate: bool = True, + speed: float | None = None, + duration: float | None = None, ) -> Offset: """Scrolls a given region in to view, if required. @@ -1101,8 +1233,9 @@ class Widget(DOMNode): Args: region (Region): A region that should be visible. spacing (Spacing | None, optional): Optional spacing around the region. Defaults to None. - animate (bool, optional): Enable animation. Defaults to True. - spacing (Spacing): Space to subtract from the window region. + animate (bool, optional): True to animate, or False to jump. Defaults to True. + speed (float | None, optional): Speed of scroll if animate is True. Or None to use duration. + duration (float | None, optional): Duration of animation, if animate is True and speed is None. Returns: Offset: The distance that was scrolled. @@ -1121,19 +1254,39 @@ class Widget(DOMNode): clamp(scroll_y + delta_y, 0, self.max_scroll_y) - scroll_y, ) if delta: + if speed is None and duration is None: + duration = 0.2 self.scroll_relative( delta.x or None, delta.y or None, animate=animate if (abs(delta_y) > 1 or delta_x) else False, - duration=0.2, + speed=speed, + duration=duration, ) return delta - def scroll_visible(self) -> None: - """Scroll the container to make this widget visible.""" + def scroll_visible( + self, + animate: bool = True, + speed: float | None = None, + duration: float | None = None, + ) -> None: + """Scroll the container to make this widget visible. + + Args: + animate (bool, optional): _description_. Defaults to True. + speed (float | None, optional): _description_. Defaults to None. + duration (float | None, optional): _description_. Defaults to None. + """ parent = self.parent if isinstance(parent, Widget): - self.call_later(parent.scroll_to_widget, self) + self.call_later( + parent.scroll_to_widget, + self, + animate=animate, + speed=speed, + duration=duration, + ) def __init_subclass__( cls, @@ -1261,13 +1414,14 @@ class Widget(DOMNode): if isinstance(renderable, str): renderable = Text.from_markup(renderable, justify=text_justify) - rich_style = self.rich_style - if isinstance(renderable, Text): - renderable.stylize(rich_style) - if text_justify is not None and renderable.justify is None: - renderable.justify = text_justify - else: - renderable = Styled(renderable, rich_style) + if ( + isinstance(renderable, Text) + and text_justify is not None + and renderable.justify is None + ): + renderable.justify = text_justify + + renderable = Styled(renderable, self.rich_style) return renderable @@ -1294,26 +1448,30 @@ class Widget(DOMNode): self.virtual_size = virtual_size self._container_size = container_size if self.is_scrollable: - self._refresh_scrollbars() - width, height = self.container_size - if self.show_vertical_scrollbar: - self.vertical_scrollbar.window_virtual_size = virtual_size.height - self.vertical_scrollbar.window_size = ( - height - self.scrollbar_size_horizontal - ) - if self.show_horizontal_scrollbar: - self.horizontal_scrollbar.window_virtual_size = virtual_size.width - self.horizontal_scrollbar.window_size = ( - width - self.scrollbar_size_vertical - ) - - self.scroll_x = self.validate_scroll_x(self.scroll_x) - self.scroll_y = self.validate_scroll_y(self.scroll_y) - self.refresh(layout=True) - self.scroll_to(self.scroll_x, self.scroll_y) + self._scroll_update(virtual_size) else: self.refresh() + def _scroll_update(self, virtual_size: Size) -> None: + """Update scrollbars visiblity and dimensions. + + Args: + virtual_size (Size): Virtual size. + """ + self._refresh_scrollbars() + width, height = self.container_size + if self.show_vertical_scrollbar: + self.vertical_scrollbar.window_virtual_size = virtual_size.height + self.vertical_scrollbar.window_size = ( + height - self.scrollbar_size_horizontal + ) + if self.show_horizontal_scrollbar: + self.horizontal_scrollbar.window_virtual_size = virtual_size.width + self.horizontal_scrollbar.window_size = width - self.scrollbar_size_vertical + + self.scroll_x = self.validate_scroll_x(self.scroll_x) + self.scroll_y = self.validate_scroll_y(self.scroll_y) + def _render_content(self) -> None: """Render all lines.""" width, height = self.size @@ -1360,7 +1518,10 @@ class Widget(DOMNode): """ if self._dirty_regions: self._render_content() - line = self._render_cache.lines[y] + try: + line = self._render_cache.lines[y] + except IndexError: + line = [Segment(" " * self.size.width, self.rich_style)] return line def render_lines(self, crop: Region) -> Lines: @@ -1389,7 +1550,7 @@ class Widget(DOMNode): return self.screen.get_style_at(x + offset_x, y + offset_y) async def _forward_event(self, event: events.Event) -> None: - event.set_forwarded() + event._set_forwarded() await self.post_message(event) def refresh( @@ -1443,6 +1604,17 @@ class Widget(DOMNode): render = "" if self.is_container else self.css_identifier_styled return render + def _render(self) -> ConsoleRenderable | RichCast: + """Get renderable, promoting str to text as required. + + Returns: + ConsoleRenderable | RichCast: A renderable + """ + renderable = self.render() + if isinstance(renderable, str): + return Text(renderable) + return renderable + async def action(self, action: str) -> None: """Perform a given action, with this widget as the default namespace. @@ -1541,7 +1713,11 @@ class Widget(DOMNode): def _on_mount(self, event: events.Mount) -> None: widgets = self.compose() self.mount(*widgets) - self.screen.refresh(repaint=False, layout=True) + # Preset scrollbars if not automatic + if self.styles.overflow_y == "scroll": + self.show_vertical_scrollbar = True + if self.styles.overflow_x == "scroll": + self.show_horizontal_scrollbar = True def _on_leave(self, event: events.Leave) -> None: self.mouse_over = False diff --git a/src/textual/widgets/__init__.py b/src/textual/widgets/__init__.py index 447110325..df9fc54e6 100644 --- a/src/textual/widgets/__init__.py +++ b/src/textual/widgets/__init__.py @@ -20,6 +20,7 @@ __all__ = [ "Pretty", "Static", "TextInput", + "TextLog", "TreeControl", "Welcome", ] diff --git a/src/textual/widgets/__init__.pyi b/src/textual/widgets/__init__.pyi index 49537d599..530227341 100644 --- a/src/textual/widgets/__init__.pyi +++ b/src/textual/widgets/__init__.pyi @@ -8,5 +8,6 @@ from ._placeholder import Placeholder as Placeholder from ._pretty import Pretty as Pretty from ._static import Static as Static from ._text_input import TextInput as TextInput +from ._text_log import TextLog as TextLog from ._tree_control import TreeControl as TreeControl from ._welcome import Welcome as Welcome diff --git a/src/textual/widgets/_button.py b/src/textual/widgets/_button.py index f13c5294f..ceddb07f6 100644 --- a/src/textual/widgets/_button.py +++ b/src/textual/widgets/_button.py @@ -9,6 +9,7 @@ if sys.version_info >= (3, 8): else: from typing_extensions import Literal # pragma: no cover +import rich.repr from rich.console import RenderableType from rich.text import Text, TextType @@ -16,7 +17,7 @@ from .. import events from ..css._error_tools import friendly_list from ..message import Message from ..reactive import Reactive -from ..widget import Widget +from ..widgets import Static ButtonVariant = Literal["default", "primary", "success", "warning", "error"] _VALID_BUTTON_VARIANTS = {"default", "primary", "success", "warning", "error"} @@ -26,7 +27,7 @@ class InvalidButtonVariant(Exception): pass -class Button(Widget, can_focus=True): +class Button(Static, can_focus=True): """A simple clickable button.""" DEFAULT_CSS = """ @@ -196,6 +197,11 @@ class Button(Widget, can_focus=True): variant = Reactive.init("default") disabled = Reactive(False) + def __rich_repr__(self) -> rich.repr.Result: + yield from super().__rich_repr__() + yield "variant", self.variant, "default" + yield "disabled", self.disabled, False + def watch_mouse_over(self, value: bool) -> None: """Update from CSS if mouse over state changes.""" if not self.disabled: diff --git a/src/textual/widgets/_data_table.py b/src/textual/widgets/_data_table.py index 5bf59fd54..8c8141727 100644 --- a/src/textual/widgets/_data_table.py +++ b/src/textual/widgets/_data_table.py @@ -20,7 +20,7 @@ from ..geometry import clamp, Region, Size, Spacing from ..reactive import Reactive from .._profile import timer from ..scroll_view import ScrollView -from ..widget import Widget + from .. import messages @@ -108,8 +108,8 @@ class DataTable(ScrollView, Generic[CellType], can_focus=True): DEFAULT_CSS = """ DataTable { - background: $surface; - color: $text; + + color: $text; } DataTable > .datatable--header { text-style: bold; @@ -155,6 +155,7 @@ class DataTable(ScrollView, Generic[CellType], can_focus=True): def __init__( self, + *, name: str | None = None, id: str | None = None, classes: str | None = None, @@ -522,18 +523,6 @@ class DataTable(ScrollView, Generic[CellType], can_focus=True): return self._render_line(y, scroll_x, scroll_x + width, style) - def render_lines(self, crop: Region) -> Lines: - """Render the widget in to lines. - - Args: - crop (Region): Region within visible area to. - - Returns: - Lines: A list of list of segments - """ - lines = self._styles_cache.render_widget(self, crop) - return lines - def on_mouse_move(self, event: events.MouseMove): meta = event.style.meta if meta: diff --git a/src/textual/widgets/_footer.py b/src/textual/widgets/_footer.py index 182782c13..5916b4359 100644 --- a/src/textual/widgets/_footer.py +++ b/src/textual/widgets/_footer.py @@ -56,7 +56,6 @@ class Footer(Widget): watch(self.app, "focused", self._focus_changed) def _focus_changed(self, focused: Widget | None) -> None: - self.log("FOCUS CHANGED", focused) self._key_text = None self.refresh() diff --git a/src/textual/widgets/_static.py b/src/textual/widgets/_static.py index 5e5c74a64..bab12cfa3 100644 --- a/src/textual/widgets/_static.py +++ b/src/textual/widgets/_static.py @@ -2,8 +2,9 @@ from __future__ import annotations from rich.console import RenderableType from rich.protocol import is_renderable +from rich.text import Text -from ..reactive import Reactive +from ..reactive import reactive from ..errors import RenderError from ..widget import Widget @@ -20,33 +21,76 @@ def _check_renderable(renderable: object): """ if not is_renderable(renderable): raise RenderError( - f"unable to render {renderable!r}; A string, Text, or other Rich renderable is required" + f"unable to render {renderable!r}; a string, Text, or other Rich renderable is required" ) class Static(Widget): + """A widget to display simple static content, or use as a base- lass for more complex widgets. + + Args: + renderable (RenderableType, optional): A Rich renderable, or string containing console markup. + Defaults to "". + fluid (bool, optional): Enable fluid content (adapts to size of window). Defaults to True. + name (str | None, optional): Name of widget. Defaults to None. + id (str | None, optional): ID of Widget. Defaults to None. + classes (str | None, optional): Space separated list of class names. Defaults to None. + """ + DEFAULT_CSS = """ Static { height: auto; } """ + fluid = reactive(True, layout=True) + _renderable: RenderableType + def __init__( self, renderable: RenderableType = "", *, + fluid: bool = True, + markup: bool = True, name: str | None = None, id: str | None = None, classes: str | None = None, ) -> None: + super().__init__(name=name, id=id, classes=classes) + self.fluid = fluid + self.markup = markup self.renderable = renderable _check_renderable(renderable) - def render(self) -> RenderableType: - return self.renderable + @property + def renderable(self) -> RenderableType: + return self._renderable or "" - def update(self, renderable: RenderableType) -> None: + @renderable.setter + def renderable(self, renderable: RenderableType) -> None: + if isinstance(renderable, str): + if self.markup: + self._renderable = Text.from_markup(renderable) + else: + self._renderable = Text(renderable) + else: + self._renderable = renderable + + def render(self) -> RenderableType: + """Get a rich renderable for the widget's content. + + Returns: + RenderableType: A rich renderable. + """ + return self._renderable + + def update(self, renderable: RenderableType = "", home: bool = False) -> None: + """Update the widget contents. + + Args: + renderable (RenderableType): A new rich renderable. + """ _check_renderable(renderable) self.renderable = renderable self.refresh(layout=True) diff --git a/src/textual/widgets/_text_input.py b/src/textual/widgets/_text_input.py index 5b706049b..825030650 100644 --- a/src/textual/widgets/_text_input.py +++ b/src/textual/widgets/_text_input.py @@ -86,6 +86,8 @@ class TextWidgetBase(Widget): return display_text class Changed(Message, bubble=True): + namespace = "text_input" + def __init__(self, sender: MessageTarget, value: str) -> None: """Message posted when the user changes the value in a TextInput @@ -116,9 +118,17 @@ class TextInput(TextWidgetBase, can_focus=True): padding: 1; background: $surface; content-align: left middle; + color: $text; + } + TextInput .text-input--placeholder { + color: $text-muted; } """ + COMPONENT_CLASSES = { + "text-input--placeholder", + } + def __init__( self, *, @@ -269,7 +279,10 @@ class TextInput(TextWidgetBase, can_focus=True): else: # The user has not entered text - show the placeholder display_text = Text( - self.placeholder, "dim", no_wrap=True, overflow="ignore" + self.placeholder, + self.get_component_rich_style("text-input--placeholder"), + no_wrap=True, + overflow="ignore", ) if show_cursor: display_text = self._apply_cursor_to_text(display_text, 0) diff --git a/src/textual/widgets/_text_log.py b/src/textual/widgets/_text_log.py new file mode 100644 index 000000000..af0ecb827 --- /dev/null +++ b/src/textual/widgets/_text_log.py @@ -0,0 +1,111 @@ +from __future__ import annotations + +from rich.console import RenderableType +from rich.segment import Segment + +from ..reactive import var +from ..geometry import Size, Region +from ..scroll_view import ScrollView +from .._cache import LRUCache +from .._segment_tools import line_crop +from .._types import Lines + + +class TextLog(ScrollView, can_focus=True): + DEFAULT_CSS = """ + TextLog{ + background: $surface; + color: $text; + overflow-y: scroll; + } + """ + + max_lines: var[int | None] = var(None) + min_width: var[int] = var(78) + wrap: var[bool] = var(False) + + def __init__( + self, + *, + max_lines: int | None = None, + min_width: int = 78, + wrap: bool = False, + name: str | None = None, + id: str | None = None, + classes: str | None = None, + ) -> None: + self.max_lines = max_lines + self.lines: list[list[Segment]] = [] + self._line_cache: LRUCache[tuple[int, int, int, int], list[Segment]] + self._line_cache = LRUCache(1024) + self.max_width: int = 0 + self.min_width = min_width + self.wrap = wrap + super().__init__(name=name, id=id, classes=classes) + + def _on_styles_updated(self) -> None: + self._line_cache.clear() + + def write(self, content: RenderableType) -> None: + """Write text or a rich renderable. + + Args: + content (RenderableType): Rich renderable (or text). + """ + console = self.app.console + width = max(self.min_width, self.size.width or self.min_width) + + render_options = console.options.update_width(width) + if not self.wrap: + render_options = render_options.update(overflow="ignore", no_wrap=True) + segments = self.app.console.render(content, render_options) + lines = list(Segment.split_lines(segments)) + self.max_width = max( + self.max_width, + max(sum(segment.cell_length for segment in _line) for _line in lines), + ) + self.lines.extend(lines) + + if self.max_lines is not None: + self.lines = self.lines[-self.max_lines :] + self.virtual_size = Size(self.max_width, len(self.lines)) + self.scroll_end(animate=False, speed=100) + + def clear(self) -> None: + """Clear the text log.""" + del self.lines[:] + self.max_width = 0 + self.virtual_size = Size(self.max_width, len(self.lines)) + + def render_line(self, y: int) -> list[Segment]: + scroll_x, scroll_y = self.scroll_offset + return self._render_line(scroll_y + y, scroll_x, self.size.width) + + def render_lines(self, crop: Region) -> Lines: + """Render the widget in to lines. + + Args: + crop (Region): Region within visible area to. + + Returns: + Lines: A list of list of segments + """ + lines = self._styles_cache.render_widget(self, crop) + return lines + + def _render_line(self, y: int, scroll_x: int, width: int) -> list[Segment]: + + if y >= len(self.lines): + return [Segment(" " * width, self.rich_style)] + + key = (y, scroll_x, width, self.max_width) + if key in self._line_cache: + return self._line_cache[key] + + line = self.lines[y] + line = Segment.adjust_line_length( + line, max(self.max_width, width), self.rich_style + ) + line = line_crop(line, scroll_x, scroll_x + width, self.max_width) + self._line_cache[key] = line + return line diff --git a/src/textual/widgets/_tree_control.py b/src/textual/widgets/_tree_control.py index e7acede74..a6d7e477b 100644 --- a/src/textual/widgets/_tree_control.py +++ b/src/textual/widgets/_tree_control.py @@ -163,8 +163,8 @@ class TreeNode(Generic[NodeDataType]): class TreeControl(Generic[NodeDataType], Static, can_focus=True): DEFAULT_CSS = """ - TreeControl { - background: $surface; + TreeControl { + color: $text; height: auto; width: 100%; diff --git a/tests/snapshot_tests/conftest.py b/tests/snapshot_tests/conftest.py index 69cc6d1b3..b52bea564 100644 --- a/tests/snapshot_tests/conftest.py +++ b/tests/snapshot_tests/conftest.py @@ -95,32 +95,33 @@ def pytest_sessionfinish( ) ) - diff_sort_key = attrgetter("file_similarity") - diffs = sorted(diffs, key=diff_sort_key) + if diffs: + diff_sort_key = attrgetter("file_similarity") + diffs = sorted(diffs, key=diff_sort_key) - conftest_path = Path(__file__) - snapshot_template_path = conftest_path.parent / "snapshot_report_template.jinja2" - snapshot_report_path = conftest_path.parent / "snapshot_report.html" + conftest_path = Path(__file__) + snapshot_template_path = conftest_path.parent / "snapshot_report_template.jinja2" + snapshot_report_path = conftest_path.parent / "snapshot_report.html" - template = Template(snapshot_template_path.read_text()) + template = Template(snapshot_template_path.read_text()) - num_fails = len(diffs) - num_snapshot_tests = len(diffs) + num_snapshots_passing + num_fails = len(diffs) + num_snapshot_tests = len(diffs) + num_snapshots_passing - rendered_report = template.render( - diffs=diffs, - passes=num_snapshots_passing, - fails=num_fails, - pass_percentage=100 * (num_snapshots_passing / (num_snapshot_tests + 1)), - fail_percentage=100 * (num_fails / (num_snapshot_tests + 1)), - num_snapshot_tests=num_snapshot_tests, - now=datetime.utcnow() - ) - with open(snapshot_report_path, "wt") as snapshot_file: - snapshot_file.write(rendered_report) + rendered_report = template.render( + diffs=diffs, + passes=num_snapshots_passing, + fails=num_fails, + pass_percentage=100 * (num_snapshots_passing / (num_snapshot_tests + 1)), + fail_percentage=100 * (num_fails / (num_snapshot_tests + 1)), + num_snapshot_tests=num_snapshot_tests, + now=datetime.utcnow() + ) + with open(snapshot_report_path, "wt") as snapshot_file: + snapshot_file.write(rendered_report) - session.config._textual_snapshots = diffs - session.config._textual_snapshot_html_report = snapshot_report_path + session.config._textual_snapshots = diffs + session.config._textual_snapshot_html_report = snapshot_report_path def pytest_terminal_summary( @@ -138,9 +139,10 @@ def pytest_terminal_summary( The ``config`` parameter. """ diffs = config._textual_snapshots - snapshot_report_location = config._textual_snapshot_html_report - console = Console() - summary_panel = Panel( - f"[b]Report available for {len(diffs)} snapshot test failures.[/]\n\nView the report at:\n\n[blue]{snapshot_report_location}[/]", - title="[b red]Textual Snapshot Test Summary", padding=1) - console.print(summary_panel) + if diffs: + snapshot_report_location = config._textual_snapshot_html_report + console = Console() + summary_panel = Panel( + f"[b]Report available for {len(diffs)} snapshot test failures.[/]\n\nView the report at:\n\n[blue]{snapshot_report_location}[/]", + title="[b red]Textual Snapshot Test Summary", padding=1) + console.print(summary_panel) diff --git a/tests/snapshot_tests/snapshot_report.html b/tests/snapshot_tests/snapshot_report.html index 294be0c2b..cb87d665e 100644 --- a/tests/snapshot_tests/snapshot_report.html +++ b/tests/snapshot_tests/snapshot_report.html @@ -14,26 +14,26 @@

Textual Snapshot Tests

- Showing diffs for 0 mismatched snapshot(s) + Showing diffs for 7 mismatched snapshot(s)
- 0 snapshots changed + 7 snapshots changed · - 7 snapshots matched + 0 snapshots matched
-
+
@@ -41,6 +41,2290 @@
+
+
+
+
+
+ + test_dock_layout_sidebar + + (76.21% source similarity) +
+ /Users/darrenburns/Code/textual/tests/snapshot_tests/test_snapshots.py:29 +
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Textual + + + + + + + + + + Sidebar1Docking a widget removes it from the layout and  +fixes its position, aligned to either the top,  +right, bottom, or left edges of a container. + +Docked widgets will not scroll out of view,  +making them ideal for sticky headers, footers,  +and sidebars. +▇▇ +Docking a widget removes it from the layout and  +fixes its position, aligned to either the top,  +right, bottom, or left edges of a container. + +Docked widgets will not scroll out of view,  +making them ideal for sticky headers, footers,  +and sidebars. + +Docking a widget removes it from the layout and  +fixes its position, aligned to either the top,  +right, bottom, or left edges of a container. + +Docked widgets will not scroll out of view,  +making them ideal for sticky headers, footers,  +and sidebars. + + + + + +
+ Output from test +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Textual + + + + + + + + + Sidebar1Docking a widget removes it from the layout and  +fixes its position, aligned to either the top,  +right, bottom, or left edges of a container. + +Docked widgets will not scroll out of view,  +making them ideal for sticky headers, footers,  +and sidebars. +▇▇ +Docking a widget removes it from the layout and  +fixes its position, aligned to either the top,  +right, bottom, or left edges of a container. + +Docked widgets will not scroll out of view,  +making them ideal for sticky headers, footers,  +and sidebars. + +Docking a widget removes it from the layout and  +fixes its position, aligned to either the top,  +right, bottom, or left edges of a container. + +Docked widgets will not scroll out of view,  +making them ideal for sticky headers, footers,  +and sidebars. + + + + +
+ Historical snapshot +
+
+
+
+
+
+
+ +
+
+
+
+
+ + test_center_layout + + (99.90% source similarity) +
+ /Users/darrenburns/Code/textual/tests/snapshot_tests/test_snapshots.py:17 +
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Textual + + + + + + + + + + + +One + + + +Two + + +Three + + + + + + + + + + + + + + + + + + +
+ Output from test +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Textual + + + + + + + + + + +One + + + +Two + + +Three + + + + + + + + + + + + + + + + + +
+ Historical snapshot +
+
+
+
+
+
+
+ +
+
+
+
+
+ + test_layers + + (99.94% source similarity) +
+ /Users/darrenburns/Code/textual/tests/snapshot_tests/test_snapshots.py:13 +
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Textual + + + + + + + + + + + + + + + + + + + + +box1 (layer = above) + + + + + +box2 (layer = below) + + + + + + + + + + +
+ Output from test +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Textual + + + + + + + + + + + + + + + + + + + +box1 (layer = above) + + + + + +box2 (layer = below) + + + + + + + + + +
+ Historical snapshot +
+
+
+
+
+
+
+ +
+
+
+
+
+ + test_vertical_layout + + (99.96% source similarity) +
+ /Users/darrenburns/Code/textual/tests/snapshot_tests/test_snapshots.py:25 +
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Textual + + + + + + + + + + ┌──────────────────────────────────────────────────────────────────────────────┐ +One + + + + + +└──────────────────────────────────────────────────────────────────────────────┘ +┌──────────────────────────────────────────────────────────────────────────────┐ +Two + + + + + +└──────────────────────────────────────────────────────────────────────────────┘ +┌──────────────────────────────────────────────────────────────────────────────┐ +Three + + + + + +└──────────────────────────────────────────────────────────────────────────────┘ + + + + +
+ Output from test +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Textual + + + + + + + + + ┌──────────────────────────────────────────────────────────────────────────────┐ +One + + + + + +└──────────────────────────────────────────────────────────────────────────────┘ +┌──────────────────────────────────────────────────────────────────────────────┐ +Two + + + + + +└──────────────────────────────────────────────────────────────────────────────┘ +┌──────────────────────────────────────────────────────────────────────────────┐ +Three + + + + + +└──────────────────────────────────────────────────────────────────────────────┘ + + + +
+ Historical snapshot +
+
+
+
+
+
+
+ +
+
+
+
+
+ + test_grid_layout_basic_overflow + + (99.98% source similarity) +
+ /Users/darrenburns/Code/textual/tests/snapshot_tests/test_snapshots.py:5 +
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Textual + + + + + + + + + + ┌────────────────────────┐┌─────────────────────────┐┌─────────────────────────┐ +OneeeeTwoThree + + + + + +└────────────────────────┘└─────────────────────────┘└─────────────────────────┘ +┌────────────────────────┐┌─────────────────────────┐┌─────────────────────────┐ +FourFiveSix + + + + + +└────────────────────────┘└─────────────────────────┘└─────────────────────────┘ +┌────────────────────────┐ +Seven + + + + + +└────────────────────────┘ + + + + +
+ Output from test +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Textual + + + + + + + + + ┌────────────────────────┐┌─────────────────────────┐┌─────────────────────────┐ +OneeeeTwoThree + + + + + +└────────────────────────┘└─────────────────────────┘└─────────────────────────┘ +┌────────────────────────┐┌─────────────────────────┐┌─────────────────────────┐ +FourFiveSix + + + + + +└────────────────────────┘└─────────────────────────┘└─────────────────────────┘ +┌────────────────────────┐ +Seven + + + + + +└────────────────────────┘ + + + +
+ Historical snapshot +
+
+
+
+
+
+
+ +
+
+
+
+
+ + test_grid_layout_basic + + (99.98% source similarity) +
+ /Users/darrenburns/Code/textual/tests/snapshot_tests/test_snapshots.py:1 +
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Textual + + + + + + + + + + ┌────────────────────────┐┌─────────────────────────┐┌─────────────────────────┐ +OneTwoThree + + + + + + + + + +└────────────────────────┘└─────────────────────────┘└─────────────────────────┘ +┌────────────────────────┐┌─────────────────────────┐┌─────────────────────────┐ +FourFiveSix + + + + + + + + + +└────────────────────────┘└─────────────────────────┘└─────────────────────────┘ + + + + +
+ Output from test +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Textual + + + + + + + + + ┌────────────────────────┐┌─────────────────────────┐┌─────────────────────────┐ +OneTwoThree + + + + + + + + + +└────────────────────────┘└─────────────────────────┘└─────────────────────────┘ +┌────────────────────────┐┌─────────────────────────┐┌─────────────────────────┐ +FourFiveSix + + + + + + + + + +└────────────────────────┘└─────────────────────────┘└─────────────────────────┘ + + + +
+ Historical snapshot +
+
+
+
+
+
+
+ +
+
+
+
+
+ + test_horizontal_layout + + (99.98% source similarity) +
+ /Users/darrenburns/Code/textual/tests/snapshot_tests/test_snapshots.py:21 +
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Textual + + + + + + + + + + ┌────────────────────────┐┌─────────────────────────┐┌─────────────────────────┐ +OneTwoThree + + + + + + + + + + + + + + + + + + + + + +└────────────────────────┘└─────────────────────────┘└─────────────────────────┘ + + + + +
+ Output from test +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Textual + + + + + + + + + ┌────────────────────────┐┌─────────────────────────┐┌─────────────────────────┐ +OneTwoThree + + + + + + + + + + + + + + + + + + + + + +└────────────────────────┘└─────────────────────────┘└─────────────────────────┘ + + + +
+ Historical snapshot +
+
+
+
+
+
+
+
@@ -55,7 +2339,7 @@
-

Report generated at UTC 2022-09-20 12:27:59.430929.

+

Report generated at UTC 2022-09-20 13:45:47.790376.