Radix Primitive Component Namespaces

Expose subcomponents of radix primitives wrapped in a SimpleNamespace with a
__call__ method that points to the high-level API entry point.

reflex/components/radix/primitives/__init__.py

@@ -1,27 +1,6 @@
 """Radix primitive components (https://www.radix-ui.com/primitives)."""
 
-from .accordion import (
-    AccordionContent,
-    AccordionHeader,
-    AccordionRoot,
-    AccordionTrigger,
-    accordion_item,
-)
-from .form import (
-    form_control,
-    form_field,
-    form_label,
-    form_message,
-    form_root,
-    form_submit,
-    form_validity_state,
-)
+from .accordion import accordion
+from .form import form
 from .progress import progress
 from .slider import slider
-
-# accordion
-accordion = AccordionRoot.create
-accordion_root = AccordionRoot.create
-accordion_header = AccordionHeader.create
-accordion_trigger = AccordionTrigger.create
-accordion_content = AccordionContent.create

reflex/components/radix/primitives/accordion.py

@@ -2,6 +2,7 @@
 
 from __future__ import annotations
 
+from types import SimpleNamespace
 from typing import Any, Dict, Literal
 
 from reflex.components.component import Component
@@ -618,3 +619,16 @@ def accordion_item(header: Component, content: Component, **props) -> Component:
         **props,
         class_name="AccordionItem",
     )
+
+
+class Accordion(SimpleNamespace):
+    """Accordion component."""
+
+    content = staticmethod(AccordionContent.create)
+    header = staticmethod(AccordionHeader.create)
+    item = staticmethod(accordion_item)
+    root = __call__ = staticmethod(AccordionRoot.create)
+    trigger = staticmethod(AccordionTrigger.create)
+
+
+accordion = Accordion()

reflex/components/radix/primitives/accordion.pyi

@@ -7,6 +7,7 @@ from typing import Any, Dict, Literal, Optional, Union, overload
 from reflex.vars import Var, BaseVar, ComputedVar
 from reflex.event import EventChain, EventHandler, EventSpec
 from reflex.style import Style
+from types import SimpleNamespace
 from typing import Any, Dict, Literal
 from reflex.components.component import Component
 from reflex.components.core import cond, match
@@ -565,3 +566,126 @@ class AccordionContent(AccordionComponent):
         ...
 
 def accordion_item(header: Component, content: Component, **props) -> Component: ...
+
+class Accordion(SimpleNamespace):
+    content = staticmethod(AccordionContent.create)
+    header = staticmethod(AccordionHeader.create)
+    item = staticmethod(accordion_item)
+    root = staticmethod(AccordionRoot.create)
+    trigger = staticmethod(AccordionTrigger.create)
+
+    @staticmethod
+    def __call__(
+        *children,
+        type_: Optional[
+            Union[Var[Literal["single", "multiple"]], Literal["single", "multiple"]]
+        ] = None,
+        value: Optional[Union[Var[str], str]] = None,
+        default_value: Optional[Union[Var[str], str]] = None,
+        collapsible: Optional[Union[Var[bool], bool]] = None,
+        disabled: Optional[Union[Var[bool], bool]] = None,
+        dir: Optional[Union[Var[Literal["ltr", "rtl"]], Literal["ltr", "rtl"]]] = None,
+        orientation: Optional[
+            Union[
+                Var[Literal["vertical", "horizontal"]],
+                Literal["vertical", "horizontal"],
+            ]
+        ] = None,
+        variant: Optional[
+            Union[
+                Var[Literal["classic", "soft", "surface", "outline", "ghost"]],
+                Literal["classic", "soft", "surface", "outline", "ghost"],
+            ]
+        ] = None,
+        color_scheme: Optional[
+            Union[Var[Literal["primary", "accent"]], Literal["primary", "accent"]]
+        ] = None,
+        _dynamic_themes: Optional[Union[Var[dict], dict]] = None,
+        _var_data: Optional[VarData] = None,
+        as_child: Optional[Union[Var[bool], bool]] = None,
+        style: Optional[Style] = None,
+        key: Optional[Any] = None,
+        id: Optional[Any] = None,
+        class_name: Optional[Any] = None,
+        autofocus: Optional[bool] = None,
+        custom_attrs: Optional[Dict[str, Union[Var, str]]] = None,
+        on_blur: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_click: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_context_menu: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_double_click: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_focus: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mount: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_down: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_enter: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_leave: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_move: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_out: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_over: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_up: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_scroll: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_unmount: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_value_change: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        **props
+    ) -> "AccordionRoot":
+        """Create the Accordion root component.
+
+        Args:
+            *children: The children of the component.
+            type_: The type of accordion (single or multiple).
+            value: The value of the item to expand.
+            default_value: The default value of the item to expand.
+            collapsible: Whether or not the accordion is collapsible.
+            disabled: Whether or not the accordion is disabled.
+            dir: The reading direction of the accordion when applicable.
+            orientation: The orientation of the accordion.
+            variant: The variant of the accordion.
+            color_scheme: The color scheme of the accordion.
+            _dynamic_themes: dynamic themes of the accordion generated at compile time.
+            _var_data: The var_data associated with the component.
+            as_child: Change the default rendered element for the one passed as a child.
+            style: The style of the component.
+            key: A unique key for the component.
+            id: The id for the component.
+            class_name: The class name for the component.
+            autofocus: Whether the component should take the focus once the page is loaded
+            custom_attrs: custom attribute
+            **props: The properties of the component.
+
+        Returns:
+            The Accordion root Component.
+        """
+        ...
+
+accordion = Accordion()

reflex/components/radix/primitives/form.py

@@ -3,6 +3,7 @@
 from __future__ import annotations
 
 from hashlib import md5
+from types import SimpleNamespace
 from typing import Any, Dict, Iterator, Literal
 
 from jinja2 import Environment
@@ -289,14 +290,16 @@ class FormSubmit(FormComponent):
     alias = "RadixFormSubmit"
 
 
-# High Level API
-Form = FormRoot
+class Form(SimpleNamespace):
+    """Form components."""
 
-form_root = FormRoot.create
-form_field = FormField.create
-form_label = FormLabel.create
-form_control = FormControl.create
-form_message = FormMessage.create
-form_validity_state = FormValidityState.create
-form_submit = FormSubmit.create
-form = Form.create
+    control = staticmethod(FormControl.create)
+    field = staticmethod(FormField.create)
+    label = staticmethod(FormLabel.create)
+    message = staticmethod(FormMessage.create)
+    root = __call__ = staticmethod(FormRoot.create)
+    submit = staticmethod(FormSubmit.create)
+    validity_state = staticmethod(FormValidityState.create)
+
+
+form = Form()

reflex/components/radix/primitives/form.pyi

@@ -8,6 +8,7 @@ from reflex.vars import Var, BaseVar, ComputedVar
 from reflex.event import EventChain, EventHandler, EventSpec
 from reflex.style import Style
 from hashlib import md5
+from types import SimpleNamespace
 from typing import Any, Dict, Iterator, Literal
 from jinja2 import Environment
 from reflex.components.component import Component
@@ -735,12 +736,98 @@ class FormSubmit(FormComponent):
         """
         ...
 
-Form = FormRoot
-form_root = FormRoot.create
-form_field = FormField.create
-form_label = FormLabel.create
-form_control = FormControl.create
-form_message = FormMessage.create
-form_validity_state = FormValidityState.create
-form_submit = FormSubmit.create
-form = Form.create
+class Form(SimpleNamespace):
+    control = staticmethod(FormControl.create)
+    field = staticmethod(FormField.create)
+    label = staticmethod(FormLabel.create)
+    message = staticmethod(FormMessage.create)
+    root = staticmethod(FormRoot.create)
+    submit = staticmethod(FormSubmit.create)
+    validity_state = staticmethod(FormValidityState.create)
+
+    @staticmethod
+    def __call__(
+        *children,
+        reset_on_submit: Optional[Union[Var[bool], bool]] = None,
+        handle_submit_unique_name: Optional[Union[Var[str], str]] = None,
+        as_child: Optional[Union[Var[bool], bool]] = None,
+        style: Optional[Style] = None,
+        key: Optional[Any] = None,
+        id: Optional[Any] = None,
+        class_name: Optional[Any] = None,
+        autofocus: Optional[bool] = None,
+        custom_attrs: Optional[Dict[str, Union[Var, str]]] = None,
+        on_blur: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_clear_server_errors: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_click: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_context_menu: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_double_click: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_focus: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mount: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_down: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_enter: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_leave: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_move: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_out: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_over: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_up: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_scroll: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_submit: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_unmount: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        **props
+    ) -> "FormRoot":
+        """Create a form component.
+
+        Args:
+            *children: The children of the form.
+            reset_on_submit: If true, the form will be cleared after submit.
+            handle_submit_unique_name: The name used to make this form's submit handler function unique.
+            as_child: Change the default rendered element for the one passed as a child.
+            style: The style of the component.
+            key: A unique key for the component.
+            id: The id for the component.
+            class_name: The class name for the component.
+            autofocus: Whether the component should take the focus once the page is loaded
+            custom_attrs: custom attribute
+            **props: The properties of the form.
+
+        Returns:
+            The form component.
+        """
+        ...
+
+form = Form()

reflex/components/radix/primitives/progress.py

@@ -2,6 +2,7 @@
 
 from __future__ import annotations
 
+from types import SimpleNamespace
 from typing import Optional
 
 from reflex.components.component import Component
@@ -67,20 +68,26 @@ class ProgressIndicator(ProgressComponent):
         )
 
 
-progress_root = ProgressRoot.create
-progress_indicator = ProgressIndicator.create
+class Progress(SimpleNamespace):
+    """High level API for progress bar."""
 
+    root = staticmethod(ProgressRoot.create)
+    indicator = staticmethod(ProgressIndicator.create)
 
-def progress(**props):
-    """High level API for progress bar.
+    @staticmethod
+    def __call__(**props) -> Component:
+        """High level API for progress bar.
 
-    Args:
-        **props: The props of the progress bar
+        Args:
+            **props: The props of the progress bar
 
-    Returns:
-        The progress bar.
-    """
-    return progress_root(
-        progress_indicator(value=props.get("value")),
-        **props,
-    )
+        Returns:
+            The progress bar.
+        """
+        return ProgressRoot.create(
+            ProgressIndicator.create(value=props.get("value")),
+            **props,
+        )
+
+
+progress = Progress()

reflex/components/radix/primitives/progress.pyi

@@ -7,6 +7,7 @@ from typing import Any, Dict, Literal, Optional, Union, overload
 from reflex.vars import Var, BaseVar, ComputedVar
 from reflex.event import EventChain, EventHandler, EventSpec
 from reflex.style import Style
+from types import SimpleNamespace
 from typing import Optional
 from reflex.components.component import Component
 from reflex.components.radix.primitives.base import RadixPrimitiveComponentWithClassName
@@ -262,7 +263,11 @@ class ProgressIndicator(ProgressComponent):
         """
         ...
 
-progress_root = ProgressRoot.create
-progress_indicator = ProgressIndicator.create
+class Progress(SimpleNamespace):
+    root = staticmethod(ProgressRoot.create)
+    indicator = staticmethod(ProgressIndicator.create)
 
-def progress(**props): ...
+    @staticmethod
+    def __call__(**props) -> Component: ...
+
+progress = Progress()

reflex/components/radix/primitives/slider.py

@@ -2,6 +2,7 @@
 
 from __future__ import annotations
 
+from types import SimpleNamespace
 from typing import Any, Dict, List, Literal
 
 from reflex.components.component import Component
@@ -148,34 +149,38 @@ class SliderThumb(SliderComponent):
         )
 
 
-slider_root = SliderRoot.create
-slider_track = SliderTrack.create
-slider_range = SliderRange.create
-slider_thumb = SliderThumb.create
-
-
-def slider(
-    **props,
-) -> Component:
-    """High level API for slider.
-
-    Args:
-        **props: The props of the slider.
-
-    Returns:
-        A slider component.
-    """
-    track = SliderTrack.create(SliderRange.create())
-    # if default_value is not set, the thumbs will not render properly but the slider will still work
-    if "default_value" in props:
-        children = [
-            track,
-            *[SliderThumb.create() for _ in props.get("default_value", [])],
-        ]
-    else:
-        children = [
-            track,
-            #     Foreach.create(props.get("value"), lambda e: SliderThumb.create()),  # foreach doesn't render Thumbs properly
-        ]
-
-    return slider_root(*children, **props)
+class Slider(SimpleNamespace):
+    """High level API for slider."""
+
+    root = staticmethod(SliderRoot.create)
+    track = staticmethod(SliderTrack.create)
+    range = staticmethod(SliderRange.create)
+    thumb = staticmethod(SliderThumb.create)
+
+    @staticmethod
+    def __call__(**props) -> Component:
+        """High level API for slider.
+
+        Args:
+            **props: The props of the slider.
+
+        Returns:
+            A slider component.
+        """
+        track = SliderTrack.create(SliderRange.create())
+        # if default_value is not set, the thumbs will not render properly but the slider will still work
+        if "default_value" in props:
+            children = [
+                track,
+                *[SliderThumb.create() for _ in props.get("default_value", [])],
+            ]
+        else:
+            children = [
+                track,
+                #     Foreach.create(props.get("value"), lambda e: SliderThumb.create()),  # foreach doesn't render Thumbs properly
+            ]
+
+        return SliderRoot.create(*children, **props)
+
+
+slider = Slider()

reflex/components/radix/primitives/slider.pyi

@@ -7,6 +7,7 @@ from typing import Any, Dict, Literal, Optional, Union, overload
 from reflex.vars import Var, BaseVar, ComputedVar
 from reflex.event import EventChain, EventHandler, EventSpec
 from reflex.style import Style
+from types import SimpleNamespace
 from typing import Any, Dict, List, Literal
 from reflex.components.component import Component
 from reflex.components.radix.primitives.base import RadixPrimitiveComponentWithClassName
@@ -444,9 +445,13 @@ class SliderThumb(SliderComponent):
         """
         ...
 
-slider_root = SliderRoot.create
-slider_track = SliderTrack.create
-slider_range = SliderRange.create
-slider_thumb = SliderThumb.create
+class Slider(SimpleNamespace):
+    root = staticmethod(SliderRoot.create)
+    track = staticmethod(SliderTrack.create)
+    range = staticmethod(SliderRange.create)
+    thumb = staticmethod(SliderThumb.create)
 
-def slider(**props) -> Component: ...
+    @staticmethod
+    def __call__(**props) -> Component: ...
+
+slider = Slider()