migrate reflex components to that style

Author: adhami3310

packages/reflex-docgen/src/reflex_docgen/__init__.py

@@ -36,44 +36,6 @@ class ComponentDocumentation:
     ] = ()
 
 
-def get_prop(
-    prop_name: str, prop_annotated_type: InspectedAnnotation
-) -> PropDocumentation:
-    """Get a Prop object from a prop name and annotated type.
-
-    Args:
-        prop_name: The name of the prop.
-        prop_annotated_type: The annotated type of the prop.
-
-    Returns:
-        The Prop object for the prop.
-    """
-    doc = next(
-        (
-            annotation.documentation
-            for annotation in prop_annotated_type.metadata
-            if isinstance(annotation, Doc)
-        ),
-        None,
-    )
-    if doc is not None:
-        default_value = None
-        for default_indicator in ["Defaults to", "Default:"]:
-            if default_indicator in doc:
-                doc, default_value = doc.split(default_indicator, maxsplit=1)
-                default_value = default_value.strip().rstrip(".")
-                doc = doc.strip().rstrip(".")
-                break
-    else:
-        default_value = None
-    return PropDocumentation(
-        name=prop_name,
-        type=prop_annotated_type.type,
-        description=doc.rstrip(".") + "." if doc else None,
-        default_value=default_value,
-    )
-
-
 def get_component_props(
     component_cls: type[Component],
 ) -> tuple[PropDocumentation, ...]:
@@ -85,18 +47,33 @@ def get_component_props(
     Returns:
         The props for the component.
     """
-    props = component_cls.get_props()
-    hints = get_type_hints(component_cls, include_extras=True)
-
-    return tuple(
-        get_prop(
-            prop_name,
-            inspect_annotation(
-                hints[prop_name], annotation_source=AnnotationSource.CLASS
-            ),
+    props = component_cls.get_js_fields()
+
+    result = []
+    for prop_name, component_field in props.items():
+        doc = component_field.doc
+        default_value = None
+
+        # If the field has a doc attribute and no Annotated[..., Doc(...)] was found,
+        # use the field's doc as the description.
+        if doc is not None:
+            for default_indicator in ["Defaults to", "Default:"]:
+                if default_indicator in doc:
+                    doc, default_value = doc.split(default_indicator, maxsplit=1)
+                    default_value = default_value.strip().rstrip(".")
+                    doc = doc.strip().rstrip(".")
+                    break
+
+        result.append(
+            PropDocumentation(
+                name=prop_name,
+                type=component_field.type_,
+                description=doc.rstrip(".") + "." if doc else None,
+                default_value=default_value,
+            )
         )
-        for prop_name in props
-    )
+
+    return tuple(result)
 
 
 def generate_documentation(component_cls: type[Component]) -> ComponentDocumentation:

pyi_hashes.json

@@ -2,7 +2,7 @@
 
 from __future__ import annotations
 
-from reflex.components.component import Component
+from reflex.components.component import Component, field
 from reflex.components.datadisplay.logo import svg_logo
 from reflex.components.el import a, button, div, h2, hr, p, pre, svg
 from reflex.event import EventHandler, set_clipboard
@@ -39,11 +39,13 @@ class ErrorBoundary(Component):
     library = "react-error-boundary@6.1.1"
     tag = "ErrorBoundary"
 
-    # Fired when the boundary catches an error.
-    on_error: EventHandler[on_error_spec]
+    on_error: EventHandler[on_error_spec] = field(
+        doc="Fired when the boundary catches an error."
+    )
 
-    # Rendered instead of the children when an error is caught.
-    fallback_render: Var[Component]
+    fallback_render: Var[Component] = field(
+        doc="Rendered instead of the children when an error is caught."
+    )
 
     @classmethod
     def create(cls, *children, **props):

reflex/components/base/error_boundary.py

@@ -1,5 +1,6 @@
 """Display the title of the current page."""
 
+from reflex.components.component import field
 from reflex.components.el.elements.base import BaseHTML
 from reflex.vars.base import Var
 
@@ -9,35 +10,28 @@ class RawLink(BaseHTML):
 
     tag = "link"
 
-    # The href.
-    href: Var[str]
+    href: Var[str] = field(doc="The href.")
 
-    # The type of link.
-    rel: Var[str]
+    rel: Var[str] = field(doc="The type of link.")
 
 
 class ScriptTag(BaseHTML):
     """A script tag with the specified type and source."""
 
     tag = "script"
 
-    # The type of script represented.
-    type_: Var[str]
+    type_: Var[str] = field(doc="The type of script represented.")
 
-    # The URI of an external script.
-    source: Var[str]
+    source: Var[str] = field(doc="The URI of an external script.")
 
-    # Metadata to verify the content of the script.
-    integrity: Var[str]
+    integrity: Var[str] = field(doc="Metadata to verify the content of the script.")
 
-    # Whether to allow cross-origin requests.
-    crossorigin: Var[str]
+    crossorigin: Var[str] = field(doc="Whether to allow cross-origin requests.")
 
-    # Indicates which referrer to send when fetching the script.
-    referrer_policy: Var[str]
+    referrer_policy: Var[str] = field(
+        doc="Indicates which referrer to send when fetching the script."
+    )
 
-    # Whether to asynchronously load the script.
-    is_async: Var[bool]
+    is_async: Var[bool] = field(doc="Whether to asynchronously load the script.")
 
-    # Whether to defer loading the script.
-    defer: Var[bool]
+    defer: Var[bool] = field(doc="Whether to defer loading the script.")

reflex/components/base/link.py

@@ -3,6 +3,7 @@
 from __future__ import annotations
 
 from reflex.components.base.bare import Bare
+from reflex.components.component import field
 from reflex.components.el import elements
 from reflex.components.el.elements.metadata import Meta as Meta  # for compatibility
 from reflex.vars.base import Var
@@ -30,12 +31,14 @@ def render(self) -> dict:
 class Description(elements.Meta):
     """A component that displays the title of the current page."""
 
-    # The type of the description.
-    name: Var[str] = Var.create("description")
+    name: Var[str] = field(
+        default=Var.create("description"), doc="The type of the description."
+    )
 
 
 class Image(elements.Meta):
     """A component that displays the title of the current page."""
 
-    # The type of the image.
-    property: Var[str] = Var.create("og:image")
+    property: Var[str] = field(
+        default=Var.create("og:image"), doc="The type of the image."
+    )