Laravel Livewire Async Select: красивые выпадающие списки без головной боли

Привет, коллеги!
Наткнулся в англоязычном сообществе на интересный пакет и хочу поделиться находкой с вами!

Livewire Async Select — это готовый компонент для Laravel, который создает красивые выпадающие списки с асинхронной загрузкой данных. Под капотом — связка Livewire и Alpine.js.

В вашем Blade-шаблоне:

<livewire:async-select wire:model="userId" endpoint="/api/users/search" placeholder="Найдите пользователя..." />

И соответствующий роут в API:

Route::get('/api/users/search', function (Request $request) { $search = $request->get('search', ''); $users = User::query() ->when($search, fn($q) => $q->where('name', 'like', "%{$search}%")) ->limit(20) ->get() ->map(fn($user) => [ 'value' => $user->id, 'label' => $user->name, ]); return response()->json(['data' => $users]); });

- Асинхронная загрузка - не грузит всю базу при открытии страницы

- Встроенный поиск с умным debouncing (не дёргает API на каждое нажатие)

- Красивые чипсы для множественного выбора Без jQuery - только современный Alpine.js

- Готовые стили под Tailwind CSS

- Полная кастомизация через слоты

- Нативная интеграция с Livewire

Select2 с jQuery зависимостями
Самостоятельная реализация debounce
Кастомные стили для каждого проекта
Проблемы с реактивностью в Livewire

Поиск пользователей в админ-панелях
Выбор товаров в корзине заказа
Фильтрация по категориям в каталогах
Любые формы с большими справочниками

Коллеги, а какие инструменты используете для подобных задач? Поделитесь в комментариях вашими любимыми пакетами или решениями.

Laravel Livewire Async Select: красивые выпадающие списки без головной боли

Простой пример "как начать"

Почему это лучше стандартных решений?

Что было раньше:

Где это пригодится?