Update examples to return Renderable from custom components (pelme#128)

* docs: Return Renderable if possible

* examples: Return Renderable if possible

* tests: Return Renderable if possible

Author: jodal

docs/common-patterns.md

@@ -35,9 +35,9 @@ def greeting(request: HttpRequest) -> HttpResponse:
 ```
 
 ```py title="components.py"
-from htpy import html, body, h1
+from htpy import Renderable, body, html, h1
 
-def greeting_page(*, name: str) -> Element:
+def greeting_page(*, name: str) -> Renderable:
     return html[body[h1[f"hi {name}!"]]]
 ```
 
@@ -70,15 +70,15 @@ A common feature of template languages is to "extend" a base/parent template and
 ```py title="components.py"
 import datetime
 
-from htpy import body, div, h1, head, html, p, title, Node, Element
+from htpy import Node, Renderable, body, div, h1, head, html, p, title
 
 
 def base_layout(*,
     page_title: str | None = None,
     extra_head: Node = None,
     content: Node = None,
     body_class: str | None = None,
-) -> Element:
+) -> Renderable:
     return html[
         head[title[page_title], extra_head],
         body(class_=body_class)[
@@ -88,7 +88,7 @@ def base_layout(*,
     ]
 
 
-def index_page() -> Element:
+def index_page() -> Renderable:
     return base_layout(
         page_title="Welcome!",
         body_class="green",
@@ -99,7 +99,7 @@ def index_page() -> Element:
     )
 
 
-def about_page() -> Element:
+def about_page() -> Renderable:
     return base_layout(
         page_title="About us",
         content=[
@@ -119,10 +119,10 @@ Wrapping [Bootstrap Modal](https://getbootstrap.com/docs/4.0/components/modal/)
 ```py title="Creating wrapper for Bootstrap Modal"
 from markupsafe import Markup
 
-from htpy import Element, Node, button, div, h5, span
+from htpy import Node, Renderable, button, div, h5, span
 
 
-def bootstrap_modal(*, title: str, body: Node = None, footer: Node = None) -> Element:
+def bootstrap_modal(*, title: str, body: Node = None, footer: Node = None) -> Renderable:
     return div(".modal", tabindex="-1", role="dialog")[
         div(".modal-dialog", role="document")[
             div(".modal-content")[

docs/django.md

@@ -77,19 +77,19 @@ def my_form(request: HttpRequest) -> HttpResponse:
 from django.http import HttpRequest
 from django.template.backends.utils import csrf_input
 
-from htpy import Element, Node, body, button, form, h1, head, html, title
+from htpy import Node, Renderable, body, button, form, h1, head, html, title
 
 from .forms import MyForm
 
 
-def base_page(page_title: str, content: Node) -> Element:
+def base_page(page_title: str, content: Node) -> Renderable:
     return html[
         head[title[page_title]],
         body[content],
     ]
 
 
-def my_form_page(request: HttpRequest, *, my_form: MyForm) -> Element:
+def my_form_page(request: HttpRequest, *, my_form: MyForm) -> Renderable:
     return base_page(
         "My form",
         form(method="post")[
@@ -101,7 +101,7 @@ def my_form_page(request: HttpRequest, *, my_form: MyForm) -> Element:
     )
 
 
-def my_form_success_page() -> Element:
+def my_form_success_page() -> Renderable:
     return base_page(
         "Success!",
         h1["Success! The form was valid!"],

docs/static-typing.md

@@ -11,7 +11,7 @@ class User:
         self.name = name
 
 
-def greeting(user: User) -> Element:
+def greeting(user: User) -> Renderable:
     return h1[f"Hi {user.first_name.capitalize()}!]
 #                        ^^^^^^^^^^
 # mypy: error: "User" has no attribute "first_name"  [attr-defined]
@@ -80,8 +80,8 @@ or callables.
 Use `Node` when you want to create a wrapper function to be flexible with what you accept. This function will accept both a str or some other element to be passed as `contents`:
 
 ```python
-from htpy import Element, Node, div
+from htpy import Node, Renderable, div
 
-def bootstrap_alert(contents: Node) -> Element:
+def bootstrap_alert(contents: Node) -> Renderable:
     return div(".alert", role="alert")[contents]
 ```

examples/djangoproject/form/components.py

@@ -1,19 +1,19 @@
 from django.http import HttpRequest
 from django.template.backends.utils import csrf_input
 
-from htpy import Element, Node, body, button, form, h1, head, html, title
+from htpy import Node, Renderable, body, button, form, h1, head, html, title
 
 from .forms import MyForm
 
 
-def base_page(page_title: str, content: Node) -> Element:
+def base_page(page_title: str, content: Node) -> Renderable:
     return html[
         head[title[page_title]],
         body[content],
     ]
 
 
-def my_form_page(request: HttpRequest, *, my_form: MyForm) -> Element:
+def my_form_page(request: HttpRequest, *, my_form: MyForm) -> Renderable:
     return base_page(
         "My form",
         form(method="post")[
@@ -25,7 +25,7 @@ def my_form_page(request: HttpRequest, *, my_form: MyForm) -> Element:
     )
 
 
-def my_form_success_page() -> Element:
+def my_form_success_page() -> Renderable:
     return base_page(
         "Success!",
         h1["Success! The form was valid!"],

examples/djangoproject/stream/components.py

@@ -1,11 +1,11 @@
 from collections.abc import Iterable
 
-from htpy import Element, body, h1, head, html, link, table, td, th, title, tr
+from htpy import Renderable, body, h1, head, html, link, table, td, th, title, tr
 
 from .items import Item
 
 
-def streaming_table_page(items: Iterable[Item]) -> Element:
+def streaming_table_page(items: Iterable[Item]) -> Renderable:
     return html[
         head[
             title["Stream example"],

examples/djangoproject/stream/views.py

@@ -5,7 +5,7 @@
 
 from django.http import HttpRequest, StreamingHttpResponse
 
-from htpy import Element, body, h1, head, html, link, table, td, th, title, tr
+from htpy import Renderable, body, h1, head, html, link, table, td, th, title, tr
 
 
 @dataclass
@@ -20,7 +20,7 @@ def generate_items() -> Iterable[Item]:
         time.sleep(1)
 
 
-def streaming_table_page(items: Iterable[Item]) -> Element:
+def streaming_table_page(items: Iterable[Item]) -> Renderable:
     return html[
         head[
             title["Stream example"],

examples/static_typing/element_example.py

@@ -1,10 +1,10 @@
 from typing import Literal
 
-from htpy import Element, span
+from htpy import Renderable, span
 
 
 def bootstrap_badge(
     text: str,
     style: Literal["success", "danger"],
-) -> Element:
+) -> Renderable:
     return span(f".badge.text-bg-{style}")[text]

examples/static_typing/example_node.py

@@ -1,7 +1,7 @@
-from htpy import Element, Node, div
+from htpy import Node, Renderable, div
 
 
-def bootstrap_alert(contents: Node) -> Element:
+def bootstrap_alert(contents: Node) -> Renderable:
     return div(".alert", role="alert")[contents]
 
 

examples/static_typing_example.py

@@ -1,10 +1,10 @@
-from htpy import Element, h1
+from htpy import Renderable, h1
 
 
 class User:
     def __init__(self, name: str):
         self.name = name
 
 
-def greeting(user: User) -> Element:
+def greeting(user: User) -> Renderable:
     return h1[f"Hi {user.first_name.capitalize()}!"]

examples/structure/bootstrap_modal.py

@@ -1,9 +1,9 @@
 from markupsafe import Markup
 
-from htpy import Element, Node, button, div, h5, span
+from htpy import Node, Renderable, button, div, h5, span
 
 
-def bootstrap_modal(*, title: str, body: Node = None, footer: Node = None) -> Element:
+def bootstrap_modal(*, title: str, body: Node = None, footer: Node = None) -> Renderable:
     return div(".modal", tabindex="-1", role="dialog")[
         div(".modal-dialog", role="document")[
             div(".modal-content")[