swap all use of get_event_triggers to rx.EventHandler props

reflex/.templates/apps/demo/code/webui/components/loading_icon.py

@@ -13,14 +13,7 @@ class LoadingIcon(rx.Component):
     stroke_width: rx.Var[str]
     speed: rx.Var[str]
     height: rx.Var[str]
-
-    def get_event_triggers(self) -> dict:
-        """Get the event triggers that pass the component's value to the handler.
-
-        Returns:
-            A dict mapping the event trigger to the var that is passed to the handler.
-        """
-        return {"on_change": lambda status: [status]}
+    on_change: rx.EventHandler[lambda status: [status]]
 
 
 loading_icon = LoadingIcon.create

reflex/components/base/script.py

@@ -4,9 +4,8 @@
 """
 from __future__ import annotations
 
-from typing import Any, Union
-
 from reflex.components.component import Component
+from reflex.event import EventHandler
 from reflex.vars import Var
 
 
@@ -30,6 +29,15 @@ class Script(Component):
     # When the script will execute: afterInteractive | beforeInteractive | lazyOnload
     strategy: Var[str] = "afterInteractive"  # type: ignore
 
+    # Triggered when the script is loading
+    on_load: EventHandler[lambda: []]
+
+    # Triggered when the script has loaded
+    on_ready: EventHandler[lambda: []]
+
+    # Triggered when the script has errored
+    on_error: EventHandler[lambda: []]
+
     @classmethod
     def create(cls, *children, **props) -> Component:
         """Create an inline or user-defined script.
@@ -58,18 +66,5 @@ def create(cls, *children, **props) -> Component:
             raise ValueError("Must provide inline script or `src` prop.")
         return super().create(*children, **props)
 
-    def get_event_triggers(self) -> dict[str, Union[Var, Any]]:
-        """Get the event triggers for the component.
-
-        Returns:
-            The event triggers.
-        """
-        return {
-            **super().get_event_triggers(),
-            "on_load": lambda: [],
-            "on_ready": lambda: [],
-            "on_error": lambda: [],
-        }
-
 
 script = Script.create

reflex/components/base/script.pyi

@@ -7,8 +7,8 @@ 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 typing import Any, Union
 from reflex.components.component import Component
+from reflex.event import EventHandler
 from reflex.vars import Var
 
 class Script(Component):
@@ -112,6 +112,5 @@ class Script(Component):
             ValueError: when neither children nor `src` are specified.
         """
         ...
-    def get_event_triggers(self) -> dict[str, Union[Var, Any]]: ...
 
 script = Script.create

reflex/components/chakra/forms/checkbox.py

@@ -1,14 +1,12 @@
 """A checkbox component."""
 from __future__ import annotations
 
-from typing import Any, Union
-
 from reflex.components.chakra import (
     ChakraComponent,
     LiteralColorScheme,
     LiteralTagSize,
 )
-from reflex.constants import EventTriggers
+from reflex.event import EventHandler
 from reflex.vars import Var
 
 
@@ -56,16 +54,8 @@ class Checkbox(ChakraComponent):
     # The spacing between the checkbox and its label text (0.5rem)
     spacing: Var[str]
 
-    def get_event_triggers(self) -> dict[str, Union[Var, Any]]:
-        """Get the event triggers that pass the component's value to the handler.
-
-        Returns:
-            A dict mapping the event trigger to the var that is passed to the handler.
-        """
-        return {
-            **super().get_event_triggers(),
-            EventTriggers.ON_CHANGE: lambda e0: [e0.target.checked],
-        }
+    # Fired when the checkbox is checked or unchecked
+    on_change: EventHandler[lambda e0: [e0.target.checked]]
 
 
 class CheckboxGroup(ChakraComponent):

reflex/components/chakra/forms/checkbox.pyi

@@ -7,13 +7,11 @@ 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 typing import Any, Union
 from reflex.components.chakra import ChakraComponent, LiteralColorScheme, LiteralTagSize
-from reflex.constants import EventTriggers
+from reflex.event import EventHandler
 from reflex.vars import Var
 
 class Checkbox(ChakraComponent):
-    def get_event_triggers(self) -> dict[str, Union[Var, Any]]: ...
     @overload
     @classmethod
     def create(  # type: ignore

reflex/components/chakra/forms/editable.py

@@ -1,10 +1,8 @@
 """An editable component."""
 from __future__ import annotations
 
-from typing import Any, Union
-
 from reflex.components.chakra import ChakraComponent
-from reflex.constants import EventTriggers
+from reflex.event import EventHandler
 from reflex.vars import Var
 
 
@@ -37,19 +35,17 @@ class Editable(ChakraComponent):
     # The initial value of the Editable in both edit and preview mode.
     default_value: Var[str]
 
-    def get_event_triggers(self) -> dict[str, Union[Var, Any]]:
-        """Get the event triggers that pass the component's value to the handler.
-
-        Returns:
-            A dict mapping the event trigger to the var that is passed to the handler.
-        """
-        return {
-            **super().get_event_triggers(),
-            EventTriggers.ON_CHANGE: lambda e0: [e0],
-            EventTriggers.ON_EDIT: lambda e0: [e0],
-            EventTriggers.ON_SUBMIT: lambda e0: [e0],
-            EventTriggers.ON_CANCEL: lambda e0: [e0],
-        }
+    # Fired when the Editable is changed.
+    on_change: EventHandler[lambda e0: [e0]]
+
+    # Fired when the Editable is in edit mode.
+    on_edit: EventHandler[lambda e0: [e0]]
+
+    # Fired when the Editable is submitted.
+    on_submit: EventHandler[lambda e0: [e0]]
+
+    # Fired when the Editable is canceled.
+    on_cancel: EventHandler[lambda e0: [e0]]
 
 
 class EditableInput(ChakraComponent):

reflex/components/chakra/forms/editable.pyi

@@ -7,13 +7,11 @@ 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 typing import Any, Union
 from reflex.components.chakra import ChakraComponent
-from reflex.constants import EventTriggers
+from reflex.event import EventHandler
 from reflex.vars import Var
 
 class Editable(ChakraComponent):
-    def get_event_triggers(self) -> dict[str, Union[Var, Any]]: ...
     @overload
     @classmethod
     def create(  # type: ignore

reflex/components/chakra/forms/input.py

@@ -1,6 +1,5 @@
 """An input component."""
 
-from typing import Any, Dict
 
 from reflex.components.chakra import (
     ChakraComponent,
@@ -10,7 +9,8 @@
 from reflex.components.component import Component
 from reflex.components.core.debounce import DebounceInput
 from reflex.components.literals import LiteralInputType
-from reflex.constants import EventTriggers, MemoizationMode
+from reflex.constants import MemoizationMode
+from reflex.event import EventHandler
 from reflex.utils import imports
 from reflex.vars import Var
 
@@ -59,27 +59,27 @@ class Input(ChakraComponent):
     # The name of the form field
     name: Var[str]
 
+    # Fired when the input value changes.
+    on_change: EventHandler[lambda e0: [e0.target.value]]
+
+    # Fired when the input is focused.
+    on_focus: EventHandler[lambda e0: [e0.target.value]]
+
+    # Fired when the input lose focus.
+    on_blur: EventHandler[lambda e0: [e0.target.value]]
+
+    # Fired when a key is pressed down.
+    on_key_down: EventHandler[lambda e0: [e0.key]]
+
+    # Fired when a key is released.
+    on_key_up: EventHandler[lambda e0: [e0.key]]
+
     def _get_imports(self) -> imports.ImportDict:
         return imports.merge_imports(
             super()._get_imports(),
             {"/utils/state": {imports.ImportVar(tag="set_val")}},
         )
 
-    def get_event_triggers(self) -> Dict[str, Any]:
-        """Get the event triggers that pass the component's value to the handler.
-
-        Returns:
-            A dict mapping the event trigger to the var that is passed to the handler.
-        """
-        return {
-            **super().get_event_triggers(),
-            EventTriggers.ON_CHANGE: lambda e0: [e0.target.value],
-            EventTriggers.ON_FOCUS: lambda e0: [e0.target.value],
-            EventTriggers.ON_BLUR: lambda e0: [e0.target.value],
-            EventTriggers.ON_KEY_DOWN: lambda e0: [e0.key],
-            EventTriggers.ON_KEY_UP: lambda e0: [e0.key],
-        }
-
     @classmethod
     def create(cls, *children, **props) -> Component:
         """Create an Input component.

reflex/components/chakra/forms/input.pyi

@@ -7,7 +7,6 @@ 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 typing import Any, Dict
 from reflex.components.chakra import (
     ChakraComponent,
     LiteralButtonSize,
@@ -16,12 +15,12 @@ from reflex.components.chakra import (
 from reflex.components.component import Component
 from reflex.components.core.debounce import DebounceInput
 from reflex.components.literals import LiteralInputType
-from reflex.constants import EventTriggers, MemoizationMode
+from reflex.constants import MemoizationMode
+from reflex.event import EventHandler
 from reflex.utils import imports
 from reflex.vars import Var
 
 class Input(ChakraComponent):
-    def get_event_triggers(self) -> Dict[str, Any]: ...
     @overload
     @classmethod
     def create(  # type: ignore

reflex/components/chakra/forms/numberinput.py

@@ -1,15 +1,14 @@
 """A number input component."""
 
 from numbers import Number
-from typing import Any, Dict
 
 from reflex.components.chakra import (
     ChakraComponent,
     LiteralButtonSize,
     LiteralInputVariant,
 )
 from reflex.components.component import Component
-from reflex.constants import EventTriggers
+from reflex.event import EventHandler
 from reflex.vars import Var
 
 
@@ -75,16 +74,8 @@ class NumberInput(ChakraComponent):
     # The name of the form field
     name: Var[str]
 
-    def get_event_triggers(self) -> Dict[str, Any]:
-        """Get the event triggers that pass the component's value to the handler.
-
-        Returns:
-            A dict mapping the event trigger to the var that is passed to the handler.
-        """
-        return {
-            **super().get_event_triggers(),
-            EventTriggers.ON_CHANGE: lambda e0: [e0],
-        }
+    # Fired when the input value changes.
+    on_change: EventHandler[lambda e0: [e0]]
 
     @classmethod
     def create(cls, *children, **props) -> Component:

reflex/components/chakra/forms/numberinput.pyi

@@ -8,18 +8,16 @@ from reflex.vars import Var, BaseVar, ComputedVar
 from reflex.event import EventChain, EventHandler, EventSpec
 from reflex.style import Style
 from numbers import Number
-from typing import Any, Dict
 from reflex.components.chakra import (
     ChakraComponent,
     LiteralButtonSize,
     LiteralInputVariant,
 )
 from reflex.components.component import Component
-from reflex.constants import EventTriggers
+from reflex.event import EventHandler
 from reflex.vars import Var
 
 class NumberInput(ChakraComponent):
-    def get_event_triggers(self) -> Dict[str, Any]: ...
     @overload
     @classmethod
     def create(  # type: ignore

reflex/components/chakra/forms/pininput.py

@@ -2,12 +2,12 @@
 
 from __future__ import annotations
 
-from typing import Any, Optional, Union
+from typing import Optional
 
 from reflex.components.chakra import ChakraComponent, LiteralInputVariant
 from reflex.components.component import Component
 from reflex.components.tags.tag import Tag
-from reflex.constants import EventTriggers
+from reflex.event import EventHandler
 from reflex.utils import format
 from reflex.utils.imports import ImportDict, merge_imports
 from reflex.vars import Var
@@ -63,6 +63,12 @@ class PinInput(ChakraComponent):
     # The name of the form field
     name: Var[str]
 
+    # Fired when the pin input is changed.
+    on_change: EventHandler[lambda e0: [e0]]
+
+    # Fired when the pin input is completed.
+    on_complete: EventHandler[lambda e0: [e0]]
+
     def _get_imports(self) -> ImportDict:
         """Include PinInputField explicitly because it may not be a child component at compile time.
 
@@ -76,18 +82,6 @@ def _get_imports(self) -> ImportDict:
             range_var._var_data.imports if range_var._var_data is not None else {},
         )
 
-    def get_event_triggers(self) -> dict[str, Union[Var, Any]]:
-        """Get the event triggers that pass the component's value to the handler.
-
-        Returns:
-            A dict mapping the event trigger to the var that is passed to the handler.
-        """
-        return {
-            **super().get_event_triggers(),
-            EventTriggers.ON_CHANGE: lambda e0: [e0],
-            EventTriggers.ON_COMPLETE: lambda e0: [e0],
-        }
-
     def get_ref(self) -> str | None:
         """Override ref handling to handle array refs.
 

reflex/components/chakra/forms/pininput.pyi

@@ -7,17 +7,16 @@ 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 typing import Any, Optional, Union
+from typing import Optional
 from reflex.components.chakra import ChakraComponent, LiteralInputVariant
 from reflex.components.component import Component
 from reflex.components.tags.tag import Tag
-from reflex.constants import EventTriggers
+from reflex.event import EventHandler
 from reflex.utils import format
 from reflex.utils.imports import ImportDict, merge_imports
 from reflex.vars import Var
 
 class PinInput(ChakraComponent):
-    def get_event_triggers(self) -> dict[str, Union[Var, Any]]: ...
     def get_ref(self) -> str | None: ...
     @overload
     @classmethod