Merge branch 'main' into carlos/prompt-box-again

Author: carlosabadia

README.md

@@ -6,7 +6,7 @@
 
 ### **✨ The open-source framework to build and deploy web apps - no Javascript required. ✨**
 [![PyPI version](https://badge.fury.io/py/reflex.svg)](https://badge.fury.io/py/reflex)
-![tests](https://github.com/pynecone-io/pynecone/actions/workflows/integration.yml/badge.svg)
+[![tests](https://github.com/reflex-dev/reflex-web/actions/workflows/integration_tests.yml/badge.svg)](https://github.com/reflex-dev/reflex-web/actions/workflows/integration_tests.yml)
 ![versions](https://img.shields.io/pypi/pyversions/reflex.svg)
 [![Documentation](https://img.shields.io/badge/Documentation%20-Introduction%20-%20%23007ec6)](https://reflex.dev/docs/getting-started/introduction/)
 [![Discord](https://img.shields.io/discord/1029853095527727165?color=%237289da&label=Discord)](https://discord.gg/T5WSbC2YtQ)

docs/wrapping-react/props.md

@@ -154,4 +154,49 @@ class EventHandlerComponent(MyBaseComponent):
 
 ```md alert info
 # Custom event specs have a few use case where they are particularly useful. If the event returns non-serializable data, you can filter them out so the event can be sent to the backend. You can also use them to transform the data before sending it to the backend.
+```
+
+### Emulating Event Handler Behavior Outside a Component
+
+In some instances, you may need to replicate the special behavior applied to
+event handlers from outside of a component context. For example if the component
+to be wrapped requires event callbacks passed in a dictionary, this can be
+achieved by directly instantiating an `EventChain`.
+
+A real-world example of this is the `onEvents` prop of
+[`echarts-for-react`](https://www.npmjs.com/package/echarts-for-react) library,
+which, unlike a normal event handler, expects a mapping of event handlers like:
+
+```javascript
+<ReactECharts
+  option={this.getOption()}
+  style={{ height: '300px', width: '100%' }}
+  onEvents={{
+    'click': this.onChartClick,
+    'legendselectchanged': this.onChartLegendselectchanged
+  }}
+/>
+```
+
+To achieve this in Reflex, you can create an explicit `EventChain` for each
+event handler:
+
+```python
+@classmethod
+def create(cls, *children, **props):
+    on_events = props.pop("on_events", {})
+
+    event_chains = {}
+    for event_name, handler in on_events.items():
+        # Convert the EventHandler/EventSpec/lambda to an EventChain
+        event_chains[event_name] = rx.EventChain.create(
+            handler,
+            args_spec=rx.event.no_args_event_spec,
+            key=event_name,
+        )
+    if on_events:
+        props["on_events"] = event_chains
+
+    # Create the component instance
+    return super().create(*children, **props)
 ```

pcweb/components/docpage/navbar/navbar.py

@@ -13,7 +13,8 @@
 from pcweb.pages.framework.framework import framework
 from pcweb.pages.hosting.hosting import hosting_landing
 from pcweb.pages.use_cases.use_cases import use_cases_page
-
+from reflex_ui.blocks.lemcal import lemcal_dialog, LEMCAL_DEMO_URL
+import reflex_ui as ui
 from ...link_button import resources_button
 from ..sidebar import SidebarState
 from .buttons.discord import discord
@@ -443,7 +444,7 @@ def new_component_section() -> rx.Component:
                                 "hidden lg:flex",
                                 "hidden",
                             )
-                        )
+                        ),
                     ),
                     class_name="flex flex-row gap-x-0 items-center",
                 ),
@@ -534,14 +535,13 @@ def new_component_section() -> rx.Component:
                 class_name="desktop-only",
             ),
             nav_menu.item(
-                rx.link(
-                    button(
+                ui.link(
+                    render_=button(
                         "Book a Demo",
                         class_name="!h-8 !font-small-smbold !rounded-[0.625rem] whitespace-nowrap",
                     ),
-                    underline="none",
-                    is_external=True,
-                    href="/pricing",
+                    target="_blank",
+                    to=LEMCAL_DEMO_URL,
                 ),
                 class_name="xl:flex hidden",
             ),

pcweb/constants.py

@@ -5,6 +5,9 @@
 REFLEX_DEV_WEB_LANDING_FORM_SALES_CALL_WEBHOOK_URL: str = (
     "https://hooks.zapier.com/hooks/catch/20661176/2s1nxp9/"
 )
+REFLEX_DEV_WEB_LANDING_FORM_URL_GET_DEMO: str = (
+    "https://cal.com/forms/f87bd9b2-b339-4915-b4d4-0098e2db4394"
+)
 
 REFLEX_DEV_WEB_NEWSLETTER_FORM_WEBHOOK_URL: str = "https://hkdk.events/t0qopjbznnp2fr"
 REFLEX_DEV_WEB_GENERAL_FORM_FEEDBACK_WEBHOOK_URL: str = os.environ.get(

pcweb/pages/__init__.py

@@ -18,6 +18,7 @@
 from .page404 import page404 as page404
 from .pricing.pricing import pricing as pricing
 from .sales import sales as sales
+from .demo.book_demo import book_demo as book_demo
 from .booked import booked as booked
 from .to_be_booked import to_be_booked as to_be_booked
 

pcweb/pages/demo/book_demo.py

@@ -0,0 +1,21 @@
+import reflex as rx
+from pcweb.pages.framework.index_colors import index_colors
+from pcweb.pages.framework.views.footer_index import footer_index
+from pcweb.meta.meta import meta_tags
+from pcweb.pages.demo.header import header
+from pcweb.templates.mainpage import mainpage
+from pcweb.components.icons.patterns import default_patterns
+
+
+@mainpage(path="/demo", title="Reflex · Book Demo", meta=meta_tags)
+def book_demo() -> rx.Component:
+    """Get the Book Demo landing page."""
+
+    return rx.el.main(
+        rx.el.section(
+            *default_patterns(),
+            header(),
+            class_name="overflow-hidden w-full relative mx-auto flex flex-col justify-center items-center max-w-[64.19rem]",
+        ),
+        class_name="flex flex-col w-full max-w-[94.5rem] justify-center items-center mx-auto px-4 lg:px-5 relative overflow-hidden",
+    )

pcweb/pages/demo/header.py

@@ -0,0 +1,56 @@
+import reflex as rx
+import reflex_ui as ui
+from reflex_ui.blocks.lemcal import lemcal_dialog, LEMCAL_DEMO_URL
+from pcweb.components.hosting_banner import HostingBannerState
+from pcweb.pages.framework.views.companies import pricing_page_companies
+
+
+def custom_quote_form() -> rx.Component:
+    """Custom quote form component with clean, maintainable structure."""
+    return rx.box(
+        rx.box(
+            rx.el.h2(
+                "Book a Demo",
+                class_name="text-slate-12 text-4xl font-bold",
+            ),
+            rx.el.p(
+                "Enterprise-ready solutions designed for scale, compliance, and support. Contact us for a tailored quote based on your infrastructure and team size.",
+                class_name="text-slate-11 text-md leading-relaxed font-medium text-center max-w-xl mx-auto",
+            ),
+            ui.link(
+                render_=rx.el.div(
+                    ui.button(
+                        "Contact Sales",
+                        class_name="font-semibold",
+                        size="lg",
+                    ),
+                    class_name="p-3 border border-slate-3 rounded-[1.375rem] border-solid mt-2",
+                ),
+                target="_blank",
+                to=LEMCAL_DEMO_URL,
+            ),
+            rx.box(
+                rx.el.span(
+                    "Trusted by",
+                    class_name="text-slate-10 text-sm leading-relaxed font-medium text-center max-w-lg mx-auto mt-2",
+                ),
+                pricing_page_companies(),
+                class_name="flex flex-col items-center justify-center gap-4",
+            ),
+            class_name="flex flex-col items-center justify-center gap-6",
+        ),
+        id="demo-form",
+        class_name="pb-12 sm:pb-20 px-4 sm:px-8 scroll-m-20 text-center",
+    )
+
+
+def header() -> rx.Component:
+    return rx.box(
+        custom_quote_form(),
+        class_name="flex flex-col gap-2 justify-center items-center max-w-[64.19rem] xl:border-x border-slate-4 w-full -mb-10 pb-16 "
+        + rx.cond(
+            HostingBannerState.show_banner,
+            "pt-[8rem] lg:pt-[11rem]",
+            "pt-[8rem] lg:pt-[12rem]",
+        ),
+    )

pcweb/pages/docs/apiref.py

@@ -9,7 +9,7 @@
     rx.Base,
     rx.Component,
     rx.ComponentState,
-    rx.Config,
+    (rx.Config, rx.config.BaseConfig),
     rx.event.Event,
     rx.event.EventHandler,
     rx.event.EventSpec,
@@ -26,9 +26,17 @@
 
 pages = []
 for module in modules:
+    if isinstance(module, tuple):
+        module, *extra_modules = module
+        extra_fields = []
+        for extra_module in extra_modules:
+            s_extra = Source(module=extra_module)
+            extra_fields.extend(s_extra.get_fields())
+    else:
+        extra_fields = None
     s = Source(module=module)
     name = module.__name__.lower()
-    docs = generate_docs(name, s)
+    docs = generate_docs(name, s, extra_fields=extra_fields)
     title = name.replace("_", " ").title()
     page_data = docpage(f"/docs/api-reference/{name}/", title)(docs)
     page_data.title = page_data.title.split("·")[0].strip()

pcweb/pages/docs/source.py

@@ -1,8 +1,9 @@
+import dataclasses
 import inspect
 import re
 
 # Get the comment for a specific field.
-from typing import Callable, Type
+from typing import Callable, ClassVar, Type, get_origin, get_type_hints
 
 import reflex as rx
 from pcweb.templates.docpage import h1_comp, h2_comp
@@ -54,9 +55,11 @@ def get_class_fields(self) -> list[dict]:
         return out
 
     def get_fields(self) -> list[dict]:
-        if not issubclass(self.module, rx.Base):
-            return []
-        return self.get_annotations(self.module.__fields__)
+        if dataclasses.is_dataclass(self.module):
+            return self.get_annotations({f.name: f for f in dataclasses.fields(self.module)})
+        elif isinstance(self.module, type) and issubclass(self.module, rx.Base):
+            return self.get_annotations(self.module.__fields__)
+        return []
 
     def get_methods(self):
         return [
@@ -170,8 +173,16 @@ def get_annotations(self, props) -> list[dict]:
 
 
 def format_field(field):
-    type_ = field["prop"].type_
+    prop = field["prop"]
+    try:
+        type_ = prop.type_
+    except AttributeError:
+        type_ = prop.type
     default = field["prop"].default
+    if default is dataclasses.MISSING:
+        default = None
+    else:
+        default = repr(default)
     type_str = type_.__name__ if hasattr(type_, "__name__") else str(type_)
     if default:
         type_str += f" = {default}"
@@ -217,8 +228,10 @@ def format_fields(headers, fields):
     )
 
 
-def generate_docs(title: str, s: Source):
+def generate_docs(title: str, s: Source, extra_fields: list[dict] | None = None):
     fields = s.get_fields()
+    if extra_fields:
+        fields.extend(extra_fields)
     class_fields = s.get_class_fields()
     return rx.box(
         h1_comp(text=title.title()),