calcite-input with calcite-dropdown

[MauricioBarrera]

Hello everyone.

I'm trying to create a component based on calcite-input and calcite-dropdown. The idea is a text-input that when the user starts typing, triggers a query to a REST service, and populates a dropdown with distinct values for a specific field. Something like an "autocomplete" based on content from a service.

It looks like this: 

I've gotten it to work, kind of. The issue I'm having is with the Dropdown component. It has an accessibility parameter that opens/closes the dropdown when the Space bar is used. This is preventing the input of having spaces entered by the user.

I've tried preventing the default behaviour of the onKeyDown event both on the input and the dropdown component, but it did not work.

Has anyone had a similar issue, or encountered a similar use case and solved it using this, or other, Calcite Components?

Thanks in advance.

[MattDriscoll]

Hi @MauricioBarrera 

> I've gotten it to work, kind of. The issue I'm having is with the Dropdown component. It has an accessibility parameter that opens/closes the dropdown when the Space bar is used. This is preventing the input of having spaces entered by the user.

This seems like a bug. I think its because the event is being emitted internally on the component. If we move the event to the host dropdown element then preventing it should not cause the space key to do anything.

I've created an issue to get this fixed: https://github.com/Esri/calcite-design-system/issues/9750