diff --git a/integration/test_input.py b/integration/test_input.py index fed8a29c0..6b203c2ff 100644 --- a/integration/test_input.py +++ b/integration/test_input.py @@ -20,23 +20,33 @@ def FullyControlledInput(): @app.add_page def index(): return rx.fragment( - rx.chakra.input( + rx.input( value=State.router.session.client_token, is_read_only=True, id="token" ), - rx.chakra.input( + rx.input( id="debounce_input_input", on_change=State.set_text, # type: ignore value=State.text, ), - rx.chakra.input(value=State.text, id="value_input", is_read_only=True), - rx.chakra.input(on_change=State.set_text, id="on_change_input"), # type: ignore + rx.input(value=State.text, id="value_input", is_read_only=True), + rx.input(on_change=State.set_text, id="on_change_input"), # type: ignore rx.el.input( value=State.text, id="plain_value_input", disabled=True, _disabled={"background_color": "#EEE"}, ), - rx.button("CLEAR", on_click=rx.set_value("on_change_input", "")), + rx.input(default_value="default", id="default_input"), + rx.el.input( + type="text", default_value="default plain", id="plain_default_input" + ), + rx.checkbox(default_checked=True, id="default_checkbox"), + rx.el.input( + type="checkbox", default_checked=True, id="plain_default_checkbox" + ), + rx.button( + "CLEAR", on_click=rx.set_value("on_change_input", ""), id="clear" + ), ) @@ -79,12 +89,38 @@ async def test_fully_controlled_input(fully_controlled_input: AppHarness): state = await fully_controlled_input.get_state(f"{token}_state.state") return state.substates["state"].text + # ensure defaults are set correctly + assert ( + fully_controlled_input.poll_for_value( + driver.find_element(By.ID, "default_input") + ) + == "default" + ) + assert ( + fully_controlled_input.poll_for_value( + driver.find_element(By.ID, "plain_default_input") + ) + == "default plain" + ) + assert ( + fully_controlled_input.poll_for_value( + driver.find_element(By.ID, "default_checkbox") + ) + == "on" + ) + assert ( + fully_controlled_input.poll_for_value( + driver.find_element(By.ID, "plain_default_checkbox") + ) + == "on" + ) + # find the input and wait for it to have the initial state value debounce_input = driver.find_element(By.ID, "debounce_input_input") value_input = driver.find_element(By.ID, "value_input") on_change_input = driver.find_element(By.ID, "on_change_input") plain_value_input = driver.find_element(By.ID, "plain_value_input") - clear_button = driver.find_element(By.TAG_NAME, "button") + clear_button = driver.find_element(By.ID, "clear") assert fully_controlled_input.poll_for_value(debounce_input) == "initial" assert fully_controlled_input.poll_for_value(value_input) == "initial" assert fully_controlled_input.poll_for_value(plain_value_input) == "initial" diff --git a/reflex/components/el/elements/forms.py b/reflex/components/el/elements/forms.py index 141181732..bdeff695b 100644 --- a/reflex/components/el/elements/forms.py +++ b/reflex/components/el/elements/forms.py @@ -125,6 +125,12 @@ class Input(BaseHTML): # Indicates whether the input is checked (for checkboxes and radio buttons) checked: Var[Union[str, int, bool]] + # The initial value (for checkboxes and radio buttons) + default_checked: Var[bool] + + # The initial value for a text field + default_value: Var[str] + # Name part of the input to submit in 'dir' and 'name' pair when form is submitted dirname: Var[Union[str, int, bool]] diff --git a/reflex/components/el/elements/forms.pyi b/reflex/components/el/elements/forms.pyi index dd681a35a..e179fdb84 100644 --- a/reflex/components/el/elements/forms.pyi +++ b/reflex/components/el/elements/forms.pyi @@ -598,6 +598,8 @@ class Input(BaseHTML): checked: Optional[ Union[Var[Union[str, int, bool]], Union[str, int, bool]] ] = None, + default_checked: Optional[Union[Var[bool], bool]] = None, + default_value: Optional[Union[Var[str], str]] = None, dirname: Optional[ Union[Var[Union[str, int, bool]], Union[str, int, bool]] ] = None, @@ -767,6 +769,8 @@ class Input(BaseHTML): auto_focus: Automatically focuses the input when the page loads capture: Captures media from the user (camera or microphone) checked: Indicates whether the input is checked (for checkboxes and radio buttons) + default_checked: The initial value (for checkboxes and radio buttons) + default_value: The initial value for a text field dirname: Name part of the input to submit in 'dir' and 'name' pair when form is submitted disabled: Disables the input form: Associates the input with a form (by id) diff --git a/reflex/components/radix/themes/components/text_field.pyi b/reflex/components/radix/themes/components/text_field.pyi index 24239f93d..6cadcaa11 100644 --- a/reflex/components/radix/themes/components/text_field.pyi +++ b/reflex/components/radix/themes/components/text_field.pyi @@ -256,6 +256,8 @@ class TextFieldInput(el.Input, TextFieldRoot): checked: Optional[ Union[Var[Union[str, int, bool]], Union[str, int, bool]] ] = None, + default_checked: Optional[Union[Var[bool], bool]] = None, + default_value: Optional[Union[Var[str], str]] = None, dirname: Optional[ Union[Var[Union[str, int, bool]], Union[str, int, bool]] ] = None, @@ -499,6 +501,8 @@ class TextFieldInput(el.Input, TextFieldRoot): auto_focus: Automatically focuses the input when the page loads capture: Captures media from the user (camera or microphone) checked: Indicates whether the input is checked (for checkboxes and radio buttons) + default_checked: The initial value (for checkboxes and radio buttons) + default_value: The initial value for a text field dirname: Name part of the input to submit in 'dir' and 'name' pair when form is submitted disabled: Disables the input form: Associates the input with a form (by id)