[BUG] - Console errors out when typing in autocomplete component

[srivatsa17]

NextUI Version

2.2.9

Describe the bug

Typing in the Autocomplete component errors out on console with message stopPropagation is now the default behavior for events in React Spectrum. You can use continuePropagation() to revert this behavior.

Your Example Website or App

No response

Steps to Reproduce the Bug or Issue

1. Write a simple autocomplete component and try to write on the input field
2. Console will error out with the above mentioned issue.

Expected behavior

No errors should be logged to the console. Also i see that the bug is fixed in this https://github.com/adobe/react-spectrum/issues/2263. Maybe upgrading react-spectrum may solve this issue.

Screenshots or Videos

Operating System Version

macOS

Browser

Firefox

[wehrhaus]

I'm encountering the same issue. I've got a thread going in the discord channel: https://discord.com/channels/856545348885676062/1179925079447056394

[e-Naeim]

I have the same issue

[NiiightmareXD]

I have the same issue

[ekajaya740]

I have the same issue

[black197]

seems like duplicate of #1909

[ModzabazeR]

I have the same issue

[amirstepT]

Putting this in my <Autocomplete> solved the problem. Don't ask me how but it solved it.

onKeyDown={(e) => e.continuePropagation()}

[AirP0WeR]

Same bug to me. @amirstepT solution help me. But I gott Erron in VScode

[NiroopR1999]

Putting this in my <Autocomplete> solved the problem. Don't ask me how but it solved it.

onKeyDown={(e) => e.continuePropagation()}

This indeed solved the solved the problem thank you.

[amirstepT]

Same bug to me. @amirstepT solution help me. But I gott Erron in VScode

The error is a typescript error that can be fixed if you do this:

onKeyDown={(e: any) => e.continuePropagation()}

[manuel-mauky]

I get the same error message with the <Dropdown> when I'm trying to use a custom component as <DropdownTrigger>. See this code example. This is based on this issue with the only difference that I'm using <Button> instead of <button>. Now, when you navigate to the button via keyboard (tab) and press Enter the same warning appears.

For the <DropdownTrigger>/<Dropdown> the trick with continuePropagation does not work due to e.continuePropagation is not a function (so it's not TypeScript issue but an exception at runtime).

It seems to be related as it's the same error message but I can also create a separate bug ticket?

[jacknie84]

solved it. thank you. Another way in typescript.

onKeyDown={(e) => {
  if ("continuePropagation" in e) {
    e.continuePropagation()
  }
}}