bug: Dropdown form input elements non functional

[mateors]

What version of FlyonUI are you using?

2.4.0

Which browsers are you seeing the problem on?

Edge

Reproduction URL

https://flyonui.com/docs/overlays/dropdown/

Describe your issue

Dropdown input fields are currently non-functional—typing into any of them is not possible.

[github-actions]

Hi @mateors

Thank you for your support in helping us improve FlyonUI!

We’ve received your submission and will respond within few business days. Our team handles issues one at a time, and we’ll be reviewing yours as soon as possible.

In the meantime, any additional details or a reproducible example would be greatly appreciated and will help us resolve the issue more efficiently.

Thank you for your patience and understanding!

[PruthviPraj00]

Hello @mateors,

Could you please provide more details? An example would help.

[mateors]

@PruthviPraj00 This is something you’ll need to simulate on your end. Please try entering any text into the yellow-marked input field. You won’t be able to type because the dropdown modal blocks interaction. This is the issue I’m currently facing, and I’ll share a few more related problems shortly.

[PruthviPraj00]

Hello @mateors, thank you for reporting the bug. We'll fix it in the next release.

[arnoldknott]

I've experienced the same or a very related issue with a select inside a dropdown.

Here's the boilerplate code from the documentation (version 2.4.0), with only the following modifications:

• the dropdown has the attribute [--auto-close:inside]
• the list items only contain a string, not a link.

<div class="dropdown relative inline-flex [--auto-close:inside]">
	<button
		id="dropdown-default"
		type="button"
		class="dropdown-toggle btn btn-primary"
		aria-haspopup="menu"
		aria-expanded="false"
		aria-label="Dropdown"
	>
		Dropdown
		<span class="icon-[tabler--chevron-down] dropdown-open:rotate-180 size-4"></span>
	</button>
	<ul
		class="dropdown-menu dropdown-open:opacity-100 hidden min-w-60"
		role="menu"
		aria-orientation="vertical"
		aria-labelledby="dropdown-default"
	>
		<li>Dropdown item 1</li>
		<li>Dropdown item 2</li>
		<li>
			<select class="select max-w-sm appearance-none" aria-label="select">
				<option disabled selected>Pick your favorite Movie</option>
				<option>The Godfather</option>
				<option>The Shawshank Redemption</option>
				<option>Pulp Fiction</option>
				<option>The Dark Knight</option>
				<option>Schindler's List</option>
			</select>
		</li>
	</ul>
</div>

I see an unexpected behaviour in Chrome (140.0.7339.133) on MacOS and in Safari as well as Chrome on iOS: the select immedeatly collapses after the being opened. No chance for the user to make a new selection.
Safari (18.6 (20621.3.11.11.3) and Firefox on MacOS (still) work as intended.

Thanks for being on it so quickly and I'm very much looking forward to your next release. 🙏

[mateors]

@PruthviPraj00 Any idea when the next release is scheduled?

[PruthviPraj00]

Hello @mateors,

We'll be releasing it before next weekend as we're also addressing other issues.

Thank you for your patience!

[areski]

Any temporary fix for the people in need :) ?

[PruthviPraj00]

Hello @areski and @mateors

We've released a fix for the bug. Please update to the latest version and check if the issue has been resolved. Cheers!

[areski]

@PruthviPraj00 Thanks for the release!
That fixed the issue, much appreciated!

[mateors]

@PruthviPraj00 Yes, the bug has been fixed and everything is working perfectly now.

[arnoldknott]

@PruthviPraj00 : I can also confirm, that the bug fix works. Thanks for your great work. 🙏