Revert "Use DebounceInput wrapper for fully controlled Editable" (#1670)
This commit is contained in:
parent
81fd9d1e9c
commit
82dc237f44
@ -2,8 +2,6 @@
|
|||||||
|
|
||||||
from typing import Dict
|
from typing import Dict
|
||||||
|
|
||||||
from reflex.components.component import Component
|
|
||||||
from reflex.components.forms.debounce import DebounceInput
|
|
||||||
from reflex.components.libs.chakra import ChakraComponent
|
from reflex.components.libs.chakra import ChakraComponent
|
||||||
from reflex.event import EVENT_ARG
|
from reflex.event import EVENT_ARG
|
||||||
from reflex.vars import Var
|
from reflex.vars import Var
|
||||||
@ -38,29 +36,6 @@ class Editable(ChakraComponent):
|
|||||||
# The initial value of the Editable in both edit and preview mode.
|
# The initial value of the Editable in both edit and preview mode.
|
||||||
default_value: Var[str]
|
default_value: Var[str]
|
||||||
|
|
||||||
@classmethod
|
|
||||||
def create(cls, *children, **props) -> Component:
|
|
||||||
"""Create an Editable component.
|
|
||||||
|
|
||||||
Args:
|
|
||||||
children: The children of the component.
|
|
||||||
props: The properties of the component.
|
|
||||||
|
|
||||||
Returns:
|
|
||||||
The component.
|
|
||||||
"""
|
|
||||||
if (
|
|
||||||
isinstance(props.get("value"), Var) and props.get("on_change")
|
|
||||||
) or "debounce_timeout" in props:
|
|
||||||
# Create a debounced input if the user requests full control to avoid typing jank
|
|
||||||
# Currently default to 50ms, which appears to be a good balance
|
|
||||||
debounce_timeout = props.pop("debounce_timeout", 50)
|
|
||||||
return DebounceInput.create(
|
|
||||||
super().create(*children, **props),
|
|
||||||
debounce_timeout=debounce_timeout,
|
|
||||||
)
|
|
||||||
return super().create(*children, **props)
|
|
||||||
|
|
||||||
def get_controlled_triggers(self) -> Dict[str, Var]:
|
def get_controlled_triggers(self) -> Dict[str, Var]:
|
||||||
"""Get the event triggers that pass the component's value to the handler.
|
"""Get the event triggers that pass the component's value to the handler.
|
||||||
|
|
||||||
|
@ -1,48 +0,0 @@
|
|||||||
import reflex as rx
|
|
||||||
|
|
||||||
|
|
||||||
class S(rx.State):
|
|
||||||
"""Example state for debounce tests."""
|
|
||||||
|
|
||||||
value: str = ""
|
|
||||||
|
|
||||||
def on_change(self, v: str):
|
|
||||||
"""Dummy on_change handler.
|
|
||||||
|
|
||||||
Args:
|
|
||||||
v: The changed value.
|
|
||||||
"""
|
|
||||||
pass
|
|
||||||
|
|
||||||
|
|
||||||
def test_full_control_implicit_debounce_editable():
|
|
||||||
"""DebounceInput is used when value and on_change are used together."""
|
|
||||||
tag = rx.editable(
|
|
||||||
value=S.value,
|
|
||||||
on_change=S.on_change,
|
|
||||||
)._render()
|
|
||||||
assert tag.props["debounceTimeout"].name == "50"
|
|
||||||
assert len(tag.props["onChange"].events) == 1
|
|
||||||
assert tag.props["onChange"].events[0].handler == S.on_change
|
|
||||||
assert tag.contents == ""
|
|
||||||
|
|
||||||
|
|
||||||
def test_full_control_explicit_debounce_editable():
|
|
||||||
"""DebounceInput is used when user specifies `debounce_timeout`."""
|
|
||||||
tag = rx.editable(
|
|
||||||
on_change=S.on_change,
|
|
||||||
debounce_timeout=33,
|
|
||||||
)._render()
|
|
||||||
assert tag.props["debounceTimeout"].name == "33"
|
|
||||||
assert len(tag.props["onChange"].events) == 1
|
|
||||||
assert tag.props["onChange"].events[0].handler == S.on_change
|
|
||||||
assert tag.contents == ""
|
|
||||||
|
|
||||||
|
|
||||||
def test_editable_no_debounce():
|
|
||||||
"""DebounceInput is not used for regular editable."""
|
|
||||||
tag = rx.editable(
|
|
||||||
placeholder=S.value,
|
|
||||||
)._render()
|
|
||||||
assert "debounceTimeout" not in tag.props
|
|
||||||
assert tag.contents == ""
|
|
Loading…
Reference in New Issue
Block a user