Combobox

An input with a searchable list of selectable options.

Component Code 
<april:combobox name="framework" placeholder="Select a framework" class="max-w-sm" x-teleport="body">
    <slot:empty>No framework found.</slot:empty>
    <april:combobox-option value="laravel">Laravel</april:combobox-option>
    <april:combobox-option value="livewire">Livewire</april:combobox-option>
    <april:combobox-option value="alpine">Alpine.js</april:combobox-option>
    <april:combobox-option value="tailwind">Tailwind CSS</april:combobox-option>
</april:combobox>

Each option is a child component because a combobox can contain multiple options. The default slot holds those options, while empty provides the empty-state message.

<april:combobox name="framework" placeholder="Select a framework">
    <slot:empty>No framework found.</slot:empty>
    <april:combobox-option value="laravel">Laravel</april:combobox-option>
    <april:combobox-option value="livewire">Livewire</april:combobox-option>
</april:combobox>

The selected value is submitted under the name attribute. The component dispatches value-change with { detail: { value } }; the existing change event remains available.

The panel stays in the component flow by default. Use x-teleport="body" when the panel must escape an overflow or stacking context, just like the other April overlay components.

Use value for the initial selection or wire:model for a Livewire-bound value. Values are compared as strings so numeric model IDs work with option values rendered in HTML. The trigger supports Enter, Space, and Arrow Down; the search field supports Arrow Up, Arrow Down, Enter, and Escape.

Publishing Views

Use the following commands to publish these views:

php artisan april:publish combobox
php artisan april:publish combobox-option
April UI keeps package views in `vendor/` by default. The command uses Laravel's vendor publishing system and copies overrides to `resources/views/vendor/april/components`. To publish all components, run: 
php artisan april:publish --all
Review local overrides after an upgrade with `php artisan april:update --diff`.