Laravel Livewire Dropdown Keyboard Navigation Fix
Budget: ₹1,500 – ₹3,000 INR
I'm working on a Laravel 12 + Livewire 3 project using Mary UI components.
Bug Description:
In the `<x-choices-offline>` searchable dropdowns (used for Product, Size, etc.), the dropdown works fine with a mouse. But keyboard navigation is broken:
- Arrow keys (up/down) do not scroll through options
- Tab key doesn’t select an item or move to the next input
- Enter does not select the item
Expected Behavior:
- Arrow keys should allow selection from the dropdown
- Tab should auto-select the item and move to the next field
- Enter should select the current highlighted result
I need a fix for this, preserving my current setup using:
- Laravel 12
- Livewire 3
- Mary UI
- Alpine.js
Only freelancers experienced with Livewire and custom UI component behavior should apply.
Bug Description:
In the `<x-choices-offline>` searchable dropdowns (used for Product, Size, etc.), the dropdown works fine with a mouse. But keyboard navigation is broken:
- Arrow keys (up/down) do not scroll through options
- Tab key doesn’t select an item or move to the next input
- Enter does not select the item
Expected Behavior:
- Arrow keys should allow selection from the dropdown
- Tab should auto-select the item and move to the next field
- Enter should select the current highlighted result
I need a fix for this, preserving my current setup using:
- Laravel 12
- Livewire 3
- Mary UI
- Alpine.js
Only freelancers experienced with Livewire and custom UI component behavior should apply.