ComboBox - Scrolls to end of popup when typing #7573
Comments
|
Technically the tracked scroll position isn't changing (e.g. |
|
NVM, disregard. Forgot the initial open is unfiltered. It does decrease the size in the example I provided as you stated. |
DH-18088 & DH-18087: ComboBox now clears search filter when opening the ComboBox unless it is triggered by user input. ### Testing - Typing in a combobox should open it filtered by the search text - Clicking the dropdown should open the CombBox unfiltered - Typing while open should filter results > Note that there seems to be a Spectrum bug that can cause some weird scrolling behavior when typing in an opened ComboBox adobe/react-spectrum#7573 #### menu_trigger="focus" - Clicking search input should open it unfiltered Here's a script with a few different configurations ```python import deephaven.ui as ui from deephaven import time_table import datetime # Ticking table with initial row count of 200 that adds a row every second initial_row_count = 200 _table = time_table( "PT1S", start_time=datetime.datetime.now() - datetime.timedelta(seconds=initial_row_count), ).update( [ "Int=new Integer(i)", "Text=new String(`Display `+i)", ] ) item_list = [ui.item(f"Display {i}") for i in range(1, 201)] # Basic ComboBox @ui.component def ui_combo_box_basic(): value, set_value = ui.use_state("Display 91") return ui.combo_box( item_list, label=f"Basic ({value})", selected_key=value, on_change=set_value, width="size-3000" ) # Uncontrolled ComboBox (Table source) @ui.component def ui_combo_box_uncontrolled(table): value, set_value = ui.use_state("") combo1 = ui.combo_box( ui.item_table_source(table, key_column="Text", label_column="Text"), default_selected_key="Display 92", label=f"Uncontrolled Table Source ({value or 'None'})", on_change=set_value, width="size-3000" ) return combo1 # Controlled ComboBox (Table source) @ui.component def ui_combo_box_controlled(table, menu_trigger): value, set_value = ui.use_state("Display 93") combo1 = ui.combo_box( ui.item_table_source(table, key_column="Text", label_column="Text"), selected_key=value, label=f"Controlled Table Source ({value}) {menu_trigger or ''}", menu_trigger=menu_trigger, on_change=set_value, width="size-3000" ) btn = ui.button("Set Value", on_press=lambda: set_value("Display 104")) return combo1, btn # Controlled input ComboBox (Table source) @ui.component def ui_combo_box_input_controlled(table, menu_trigger): input_value, set_input_value = ui.use_state("Display 94") value, set_value = ui.use_state("Display 94") combo1 = ui.combo_box( ui.item_table_source(table, key_column="Text", label_column="Text"), input_value=input_value, on_input_change=set_input_value, default_selected_key=value, label=f"Controlled Input Table Source ({value}) {menu_trigger or ''}", menu_trigger=menu_trigger, on_change=set_value, width="size-3000" ) btn = ui.button("Set Input", on_press=lambda: set_input_value("Display 104")) return combo1, btn # Layout @ui.component def ui_layout(): return ( ui_combo_box_basic(), ui_combo_box_uncontrolled(_table), ui_combo_box_controlled(_table, None), ui_combo_box_controlled(_table, "focus"), ui_combo_box_input_controlled(_table, None), ) tests = ui_layout() ```
|
Talked with the team, ideally we'd want to do some kind of scroll anchoring where we'd try to bring the previously focused option back into view after the collection changes. If said option no longer exists then we'd reset scroll position to the top of the list. |
Provide a general summary of the issue here
In certain cases typing in an open ComboBox causes it to scroll to the end of the list.
🤔 Expected Behavior?
I would expect the ComboBox would scroll to a more intuitive position while typing such as the beginning of the filtered list, the selected item, or no scrolling at all.
😯 Current Behavior
It currently scrolls to the end of the list in certain scenarios (see codesandbox)
💁 Possible Solution
No response
🔦 Context
No response
🖥️ Steps to Reproduce
Code sandbox example
Version
3.38.0
What browsers are you seeing the problem on?
Chrome
If other, please specify.
No response
What operating system are you using?
MacOS
🧢 Your Company/Team
No response
🕷 Tracking Issue
No response
The text was updated successfully, but these errors were encountered: