DioxusLabs / DioxusLabs/dioxus-components

Combobox: reopening the popup blanks the field, hiding the chosen option

Open Beginner friendly
#294 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
Rust
Stars
343
Forks
82
PR merge metrics
No merged PRs in 30d

Description

Version (commit hash): `bf007c15d0cf4d04d3181cc46cf12325aa773955` (`main` at the time of writing)

## Summary

Once an option has been chosen, opening the popup again clears the text out of the field. The
value itself survives (`aria-selected` stays on the chosen option and the field's text comes
back on close), but for as long as the popup is open the field reads as empty, which is
indistinguishable from "nothing is chosen". Since choosing a *different* option means opening the
popup, the selection appears to be discarded every time the user goes to change it.

Both ways of opening the popup do it: a click on the field, and `ArrowDown` from the field.

## Reproduction

```rust
use dioxus::prelude::*;
use dioxus_primitives::combobox;

#[component]
fn Example() -> Element {
rsx! {
combobox::Combobox:: { id: "raw",
combobox::ComboboxInput { id: "raw-input", placeholder: "Pick a fruit" }
combobox::ComboboxList { id: "raw-list",
for (index, fruit) in ["Apple", "Banana", "Cherry"].iter().copied().enumerate() {
combobox::ComboboxOption:: {
key: "{fruit}",
value: fruit.to_string(),
index,
"{fruit}"
}
}
}
}
}
}
```

1. Click the field, click **Banana**. The field reads `Banana`.
2. Click the field again to reopen.

## Expected

The field should not present as empty while the component is holding a value. The usual
behavior is that reopening shows the chosen value, with the text selected so that the first
keystroke still replaces it and filtering still starts from scratch.

## Cause

Two places in `primitives/src/combobox/components/input.rs`, and either alone is enough:

```rust
// what the field renders
let display_value = use_memo(move || {
if open() {
query.cloned() // <- the query, not the selection
} else {
ctx.selectable.selected_text().unwrap_or_default()
}
});

// what a click does
onclick: move |_| {
if !open() {
set_query.call(String::new()); // <- wipes the query first
ctx.set_open(true);
}
},
```

Contributor guide

No contributing guide indexed for this repository

Research direction

Start in primitives/src/combobox/components/input.rs, especially the display_value memo and the click handler described in the issue. Reproduce the Rust example by selecting Banana, reopening with a click and with ArrowDown, and verify that the selected value remains visible while the text is selected for replacement and filtering.

Written by the indexing model from the issue text.

Assessment

Tech stack
rust
Domain
frontend
Issue type
Bug
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Active
Clarity
Clearly specified
Newbie friendliness
85/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.