Implement widgets command

src/textual_dev/cli.py

@@ -219,6 +219,14 @@ def colors() -> None:
     ColorsApp().run()
 
 
+@run.command("widgets")
+def widgets() -> None:
+    """Explore possible example_widgets."""
+    from textual_dev.previews import WidgetsApp
+
+    WidgetsApp().run()
+
+
 @run.command("keys")
 def keys() -> None:
     """Show key events."""

src/textual_dev/previews/__init__.py

@@ -4,5 +4,6 @@
 from .colors import ColorsApp
 from .easing import EasingApp
 from .keys import KeysApp
+from .widgets import WidgetsApp
 
-__all__ = ["BorderApp", "ColorsApp", "EasingApp", "KeysApp"]
+__all__ = ["BorderApp", "ColorsApp", "EasingApp", "KeysApp", "WidgetsApp"]

src/textual_dev/previews/example_widgets/__init__.py

@@ -0,0 +1,120 @@
+import random
+from statistics import mean
+
+from textual.app import ComposeResult
+from textual.containers import Container
+from textual.widgets import (
+    DirectoryTree,
+    Footer,
+    Header,
+    Input,
+    Label,
+    ListView,
+    ListItem,
+    LoadingIndicator,
+    Sparkline,
+    Static,
+    Tree,
+)
+
+from .button import button_example
+from .checkbox import checkbox_example
+from .data_table import data_table_example
+from .markdown import markdown_viewer_example, markdown_example
+from .option_list import option_list_example
+from .placeholder import placeholder_example
+from .pretty import pretty_example
+from .radio import radio_button_example, radio_set_example
+from .select import select_example, selection_list_example
+from .switch import switch_example
+
+
+def directory_tree_example(id: str) -> ComposeResult:
+    yield Container(DirectoryTree("./"), id=id)
+
+
+def footer_example(id: str) -> ComposeResult:
+    yield Container(Footer(), id=id)
+
+
+def header_example(id: str) -> ComposeResult:
+    yield Container(Header(), id=id)
+
+
+def input_example(id: str) -> ComposeResult:
+    yield Container(
+        Input(placeholder="First Name"), Input(placeholder="Last Name"), id=id
+    )
+
+
+def label_example(id: str) -> ComposeResult:
+    yield Container(Label("Hello, world!"), id=id)
+
+
+def list_item_example(id: str) -> ComposeResult:
+    yield Container(
+        ListView(
+            ListItem(Label("One")),
+            ListItem(Label("Two")),
+            ListItem(Label("Three")),
+        ),
+        id=id,
+    )
+
+    yield Footer()
+
+
+def loading_example(id: str) -> ComposeResult:
+    yield Container(LoadingIndicator(), id=id)
+
+
+def sparkline_example(id: str) -> ComposeResult:
+    data = [random.expovariate(1 / 3) for _ in range(1000)]
+
+    yield Container(
+        Sparkline(data, summary_function=max),
+        Sparkline(data, summary_function=mean),
+        Sparkline(data, summary_function=min),
+        id=id,
+    )
+
+
+def static_example(id: str) -> ComposeResult:
+    yield Container(Static("Hello, world!"), id=id)
+
+
+def tree_example(id: str) -> ComposeResult:
+    tree: Tree[dict] = Tree("Dune")
+    tree.root.expand()
+    characters = tree.root.add("Characters", expand=True)
+    characters.add_leaf("Paul")
+    characters.add_leaf("Jessica")
+    characters.add_leaf("Chani")
+    yield Container(tree, id=id)
+
+
+__all__ = [
+    "button_example",
+    "checkbox_example",
+    "data_table_example",
+    "directory_tree_example",
+    "footer_example",
+    "header_example",
+    "input_example",
+    "label_example",
+    "list_item_example",
+    "loading_example",
+    "markdown_viewer_example",
+    "markdown_example",
+    "option_list_example",
+    "placeholder_example",
+    "pretty_example",
+    "radio_button_example",
+    "radio_set_example",
+    "select_example",
+    "selection_list_example",
+    "sparkline_example",
+    "static_example",
+    "switch_example",
+    "tree_example",
+]

src/textual_dev/previews/example_widgets/button.py

@@ -0,0 +1,25 @@
+from textual.app import ComposeResult
+from textual.containers import Horizontal, VerticalScroll
+from textual.widgets import Static, Button
+
+
+def button_example(id: str) -> ComposeResult:
+    yield Horizontal(
+        VerticalScroll(
+            Static("Standard Buttons", classes="header"),
+            Button("Default"),
+            Button("Primary!", variant="primary"),
+            Button.success("Success!"),
+            Button.warning("Warning!"),
+            Button.error("Error!"),
+        ),
+        VerticalScroll(
+            Static("Disabled Buttons", classes="header"),
+            Button("Default", disabled=True),
+            Button("Primary!", variant="primary", disabled=True),
+            Button.success("Success!", disabled=True),
+            Button.warning("Warning!", disabled=True),
+            Button.error("Error!", disabled=True),
+        ),
+        id=id,
+    )

src/textual_dev/previews/example_widgets/checkbox.py

@@ -0,0 +1,19 @@
+from textual.app import ComposeResult
+from textual.containers import VerticalScroll, Container
+from textual.widgets import Checkbox
+
+
+def checkbox_example(id: str) -> ComposeResult:
+    yield Container(
+        VerticalScroll(
+            Checkbox("Arrakis :sweat:"),
+            Checkbox("Caladan"),
+            Checkbox("Chusuk"),
+            Checkbox("[b]Giedi Prime[/b]"),
+            Checkbox("[magenta]Ginaz[/]"),
+            Checkbox("Grumman", True),
+            Checkbox("Kaitain", id="initial_focus"),
+            Checkbox("Novebruns", True),
+        ),
+        id=id,
+    )

src/textual_dev/previews/example_widgets/data_table.py

@@ -0,0 +1,24 @@
+from textual.containers import Container
+from textual.app import ComposeResult
+from textual.widgets import DataTable
+
+ROWS = [
+    ("lane", "swimmer", "country", "time"),
+    (4, "Joseph Schooling", "Singapore", 50.39),
+    (2, "Michael Phelps", "United States", 51.14),
+    (5, "Chad le Clos", "South Africa", 51.14),
+    (6, "László Cseh", "Hungary", 51.14),
+    (3, "Li Zhuhao", "China", 51.26),
+    (8, "Mehdy Metella", "France", 51.58),
+    (7, "Tom Shields", "United States", 51.73),
+    (1, "Aleksandr Sadovnikov", "Russia", 51.84),
+    (10, "Darren Burns", "Scotland", 51.84),
+]
+
+
+def data_table_example(id: str) -> ComposeResult:
+    table = DataTable()
+    table.add_columns(*ROWS[0])
+    table.add_rows(ROWS[1:])
+
+    yield Container(table, id=id)

src/textual_dev/previews/example_widgets/markdown.py

@@ -0,0 +1,75 @@
+from textual.containers import Container
+from textual.app import ComposeResult
+from textual.widgets import MarkdownViewer, Markdown
+
+EXAMPLE_MARKDOWN_VIEWER = """\
+# Markdown Viewer
+
+This is an example of Textual's `MarkdownViewer` widget.
+
+
+## Features
+
+Markdown syntax and extensions are supported.
+
+- Typography *emphasis*, **strong**, `inline code` etc.
+- Headers
+- Lists (bullet and ordered)
+- Syntax highlighted code blocks
+- Tables!
+
+## Tables
+
+Tables are displayed in a DataTable widget.
+
+| Name            | Type   | Default | Description                        |
+| --------------- | ------ | ------- | ---------------------------------- |
+| `show_header`   | `bool` | `True`  | Show the table header              |
+| `fixed_rows`    | `int`  | `0`     | Number of fixed rows               |
+| `fixed_columns` | `int`  | `0`     | Number of fixed columns            |
+| `zebra_stripes` | `bool` | `False` | Display alternating colors on rows |
+| `header_height` | `int`  | `1`     | Height of header row               |
+| `show_cursor`   | `bool` | `True`  | Show a cell cursor                 |
+
+
+## Code Blocks
+
+Code blocks are syntax highlighted, with guidelines.
+
+```python
+class ListViewExample(App):
+    def compose(self) -> ComposeResult:
+        yield ListView(
+            ListItem(Label("One")),
+            ListItem(Label("Two")),
+            ListItem(Label("Three")),
+        )
+        yield Footer()
+```
+"""
+
+EXAMPLE_MARKDOWN = """\
+# Markdown Document
+
+This is an example of Textual's `Markdown` widget.
+
+## Features
+
+Markdown syntax and extensions are supported.
+
+- Typography *emphasis*, **strong**, `inline code` etc.
+- Headers
+- Lists (bullet and ordered)
+- Syntax highlighted code blocks
+- Tables!
+"""
+
+
+def markdown_viewer_example(id: str) -> ComposeResult:
+    yield Container(
+        MarkdownViewer(EXAMPLE_MARKDOWN_VIEWER, show_table_of_contents=True), id=id
+    )
+
+
+def markdown_example(id: str) -> ComposeResult:
+    yield Container(Markdown(EXAMPLE_MARKDOWN), id=id)

src/textual_dev/previews/example_widgets/option_list.py

@@ -0,0 +1,33 @@
+from textual.containers import Container
+from textual.app import ComposeResult
+from textual.widgets import Footer, Header, OptionList
+from textual.widgets.option_list import Option, Separator
+
+
+def option_list_example(id: str) -> ComposeResult:
+    yield Container(
+        Header(),
+        OptionList(
+            Option("Aerilon", id="aer"),
+            Option("Aquaria", id="aqu"),
+            Separator(),
+            Option("Canceron", id="can"),
+            Option("Caprica", id="cap", disabled=True),
+            Separator(),
+            Option("Gemenon", id="gem"),
+            Separator(),
+            Option("Leonis", id="leo"),
+            Option("Libran", id="lib"),
+            Separator(),
+            Option("Picon", id="pic"),
+            Separator(),
+            Option("Sagittaron", id="sag"),
+            Option("Scorpia", id="sco"),
+            Separator(),
+            Option("Tauron", id="tau"),
+            Separator(),
+            Option("Virgon", id="vir"),
+        ),
+        Footer(),
+        id=id,
+    )

src/textual_dev/previews/example_widgets/placeholder.py

@@ -0,0 +1,33 @@
+from textual.app import ComposeResult
+from textual.containers import Container, Horizontal, VerticalScroll
+from textual.widgets import Placeholder
+
+
+def placeholder_example(id: str) -> ComposeResult:
+    yield Container(
+        VerticalScroll(
+            Container(
+                Placeholder("This is a custom label for p1.", id="p1"),
+                Placeholder("Placeholder p2 here!", id="p2"),
+                Placeholder(id="p3"),
+                Placeholder(id="p4"),
+                Placeholder(id="p5"),
+                Placeholder(),
+                Horizontal(
+                    Placeholder(variant="size", id="col1"),
+                    Placeholder(variant="text", id="col2"),
+                    Placeholder(variant="size", id="col3"),
+                    id="c1",
+                ),
+                id="bot",
+            ),
+            Container(
+                Placeholder(variant="text", id="left"),
+                Placeholder(variant="size", id="topright"),
+                Placeholder(variant="text", id="botright"),
+                id="top",
+            ),
+            id="content",
+        ),
+        id=id,
+    )

src/textual_dev/previews/example_widgets/pretty.py

@@ -0,0 +1,18 @@
+from textual.containers import Container
+from textual.app import ComposeResult
+from textual.widgets import Pretty
+
+DATA = {
+    "title": "Back to the Future",
+    "releaseYear": 1985,
+    "director": "Robert Zemeckis",
+    "genre": "Adventure, Comedy, Sci-Fi",
+    "cast": [
+        {"actor": "Michael J. Fox", "character": "Marty McFly"},
+        {"actor": "Christopher Lloyd", "character": "Dr. Emmett Brown"},
+    ],
+}
+
+
+def pretty_example(id: str) -> ComposeResult:
+    yield Container(Pretty(DATA), id=id)