fixes thus far

Author: rmorshea

src/idom/core/component.py

@@ -1,65 +1,84 @@
 from __future__ import annotations
 
 import inspect
+from collections.abc import Sequence
 from functools import wraps
-from typing import Any, Callable, Dict, Optional, Tuple
+from typing import Any, Callable
 
-from .types import ComponentType, VdomDict
+from .types import Key, RenderResult
+from .vdom import flatten_children
 
 
-def component(
-    function: Callable[..., ComponentType | VdomDict | str | None]
-) -> Callable[..., Component]:
+def component(function: Callable[..., RenderResult]) -> Callable[..., Component]:
     """A decorator for defining a new component.
 
     Parameters:
         function: The component's :meth:`idom.core.proto.ComponentType.render` function.
     """
     sig = inspect.signature(function)
 
-    if "key" in sig.parameters and sig.parameters["key"].kind in (
-        inspect.Parameter.KEYWORD_ONLY,
-        inspect.Parameter.POSITIONAL_OR_KEYWORD,
-    ):
+    if [
+        param.name
+        for param in sig.parameters.values()
+        if param.kind is inspect.Parameter.POSITIONAL_OR_KEYWORD
+        or param.kind is inspect.Parameter.POSITIONAL_ONLY
+    ]:
+        raise TypeError(
+            "Position-only and positional-or-keyword parameters are disallowed - "
+            "use variable positional arguments to define whether this component has "
+            "children and keyword-only to define its attributes."
+        )
+
+    if "key" in sig.parameters:
         raise TypeError(
             f"Component render function {function} uses reserved parameter 'key'"
         )
 
     @wraps(function)
-    def constructor(*args: Any, key: Optional[Any] = None, **kwargs: Any) -> Component:
-        return Component(function, key, args, kwargs, sig)
+    def constructor(
+        *children: Any, key: Key | None = None, **attributes: Any
+    ) -> Component:
+        return Component(function, key, flatten_children(children), attributes, sig)
 
     return constructor
 
 
 class Component:
     """An object for rending component models."""
 
-    __slots__ = "__weakref__", "_func", "_args", "_kwargs", "_sig", "key", "type"
+    __slots__ = (
+        "__weakref__",
+        "_func",
+        "_children",
+        "_attributes",
+        "_sig",
+        "key",
+        "type",
+    )
 
     def __init__(
         self,
-        function: Callable[..., ComponentType | VdomDict | str | None],
-        key: Optional[Any],
-        args: Tuple[Any, ...],
-        kwargs: Dict[str, Any],
+        function: Callable[..., RenderResult],
+        key: Key | None,
+        children: Sequence[Any],
+        attributes: dict[str, Any],
         sig: inspect.Signature,
     ) -> None:
         self.key = key
         self.type = function
-        self._args = args
-        self._kwargs = kwargs
+        self._children = children
+        self._attributes = attributes
         self._sig = sig
 
-    def render(self) -> ComponentType | VdomDict | str | None:
-        return self.type(*self._args, **self._kwargs)
+    def render(self) -> RenderResult:
+        return self.type(*self._children, **self._attributes)
 
     def should_render(self, new: Component) -> bool:
         return True
 
     def __repr__(self) -> str:
         try:
-            args = self._sig.bind(*self._args, **self._kwargs).arguments
+            args = self._sig.bind(*self._children, **self._attributes).arguments
         except TypeError:
             return f"{self.type.__name__}(...)"
         else:

src/idom/core/types.py

@@ -62,13 +62,16 @@ class ComponentType(Protocol):
     This is used to see if two component instances share the same definition.
     """
 
-    def render(self) -> VdomDict | ComponentType | str | None:
+    def render(self) -> RenderResult:
         """Render the component's view model."""
 
     def should_render(self: _OwnType, new: _OwnType) -> bool:
         """Whether the new component instance should be rendered."""
 
 
+RenderResult = Union["VdomDict", ComponentType, str, None]
+
+
 _Render = TypeVar("_Render", covariant=True)
 _Event = TypeVar("_Event", contravariant=True)
 
@@ -200,12 +203,12 @@ class EventHandlerType(Protocol):
 
 
 class VdomDictConstructor(Protocol):
-    """Standard function for constructing a :class:`VdomDict`"""
-
     def __call__(
         self,
-        *attributes_and_children: VdomAttributesAndChildren,
-        key: str = ...,
-        event_handlers: Optional[EventHandlerMapping] = ...,
+        *children: VdomChild,
+        key: str | int | None = None,
+        event_handlers: EventHandlerMapping | None = None,
+        import_source: ImportSourceDict | None = None,
+        **attributes: Any,
     ) -> VdomDict:
         ...

src/idom/core/vdom.py

@@ -20,6 +20,7 @@
     Key,
     VdomChild,
     VdomDict,
+    VdomDictConstructor,
     VdomJson,
 )
 
@@ -184,9 +185,7 @@ def vdom(
     return model
 
 
-def make_vdom_constructor(
-    tag: str, allow_children: bool = True
-) -> _VdomDictConstructor:
+def make_vdom_constructor(tag: str, allow_children: bool = True) -> VdomDictConstructor:
     """Return a constructor for VDOM dictionaries with the given tag name.
 
     The resulting callable will have the same interface as :func:`vdom` but without its
@@ -311,17 +310,3 @@ def _is_single_child(value: Any) -> bool:
     class _EllipsisRepr:
         def __repr__(self) -> str:
             return "..."
-
-
-class _VdomDictConstructor(Protocol):
-    def __call__(
-        self,
-        tag: str,
-        /,
-        *children: VdomChild,
-        key: str | int | None = None,
-        event_handlers: EventHandlerMapping | None = None,
-        import_source: ImportSourceDict | None = None,
-        **attributes: Any,
-    ) -> VdomDict:
-        ...

src/idom/sample.py

@@ -8,14 +8,16 @@
 @component
 def SampleApp() -> VdomDict:
     return html.div(
-        {"id": "sample", "style": {"padding": "15px"}},
         html.h1("Sample Application"),
         html.p(
             "This is a basic application made with IDOM. Click ",
             html.a(
-                {"href": "https://pypi.org/project/idom/", "target": "_blank"},
                 "here",
+                href="https://pypi.org/project/idom/",
+                target="_blank",
             ),
             " to learn more.",
         ),
+        id="sample",
+        style={"padding": "15px"},
     )

src/idom/types.py

@@ -20,7 +20,6 @@
     RootComponentConstructor,
     State,
     VdomAttributes,
-    VdomAttributesAndChildren,
     VdomChild,
     VdomChildren,
     VdomDict,
@@ -46,7 +45,6 @@
     "RootComponentConstructor",
     "State",
     "VdomAttributes",
-    "VdomAttributesAndChildren",
     "VdomChild",
     "VdomChildren",
     "VdomDict",

tests/test_backend/test_common.py

@@ -39,7 +39,7 @@ async def display(page, request):
 async def test_display_simple_hello_world(display: DisplayFixture):
     @idom.component
     def Hello():
-        return idom.html.p({"id": "hello"}, ["Hello World"])
+        return idom.html.p("Hello World", id="hello")
 
     await display.show(Hello)
 
@@ -56,11 +56,9 @@ async def test_display_simple_click_counter(display: DisplayFixture):
     def Counter():
         count, set_count = idom.hooks.use_state(0)
         return idom.html.button(
-            {
-                "id": "counter",
-                "onClick": lambda event: set_count(lambda old_count: old_count + 1),
-            },
             f"Count: {count}",
+            id="counter",
+            onClick=lambda event: set_count(lambda old_count: old_count + 1),
         )
 
     await display.show(Counter)
@@ -85,7 +83,7 @@ async def test_use_connection(display: DisplayFixture):
     @idom.component
     def ShowScope():
         conn.current = idom.use_connection()
-        return html.pre({"id": "scope"}, str(conn.current))
+        return html.pre(str(conn.current), id="scope")
 
     await display.show(ShowScope)
 
@@ -99,7 +97,7 @@ async def test_use_scope(display: DisplayFixture):
     @idom.component
     def ShowScope():
         scope.current = idom.use_scope()
-        return html.pre({"id": "scope"}, str(scope.current))
+        return html.pre(str(scope.current), id="scope")
 
     await display.show(ShowScope)
 
@@ -147,7 +145,7 @@ async def test_use_request(display: DisplayFixture, hook_name):
     @idom.component
     def ShowRoute():
         hook_val.current = hook()
-        return html.pre({"id": "hook"}, str(hook_val.current))
+        return html.pre(str(hook_val.current), id="hook")
 
     await display.show(ShowRoute)
 

tests/test_core/test_component.py

@@ -47,7 +47,7 @@ def ComponentWithVarArgsAndKwargs(*args, **kwargs):
 async def test_display_simple_hello_world(display: DisplayFixture):
     @idom.component
     def Hello():
-        return idom.html.p({"id": "hello"}, ["Hello World"])
+        return idom.html.p("Hello World", id="hello")
 
     await display.show(Hello)
 

tests/test_core/test_events.py

@@ -151,7 +151,7 @@ def Input():
         async def on_key_down(value):
             pass
 
-        return idom.html.input({"onKeyDown": on_key_down, "id": "input"})
+        return idom.html.input(on_key_down=on_key_down, id="input")
 
     await display.show(Input)
 
@@ -170,9 +170,9 @@ async def on_click(event):
             set_clicked(True)
 
         if not clicked:
-            return idom.html.button({"onClick": on_click, "id": "click"}, ["Click Me!"])
+            return idom.html.button("Click Me!", on_click=on_click, id="click")
         else:
-            return idom.html.p({"id": "complete"}, ["Complete"])
+            return idom.html.p("Complete", id="complete")
 
     await display.show(Button)
 

tests/test_core/test_hooks.py

@@ -240,9 +240,9 @@ async def on_change(event):
                 set_message(event["target"]["value"])
 
         if message is None:
-            return idom.html.input({"id": "input", "onChange": on_change})
+            return idom.html.input(id="input", on_change=on_change)
         else:
-            return idom.html.p({"id": "complete"}, ["Complete"])
+            return idom.html.p("Complete", id="complete")
 
     await display.show(Input)