Command menu
<x-portal::button variant="outline" x-on:click="$dispatch('open-command')">Open</x-portal::button>
<x-portal::command>
<x-portal::command.search x-on:keyup="console.log($el.value)" />
<x-portal::command.content>
<x-portal::command.group label="Suggestions">
<x-portal::command.item href="">
<x-tabler-calendar-event-filled class="h-5" />
Calendar
</x-portal::command.item>
<x-portal::command.item href="">
<x-tabler-mood-smile class="h-5" />
Search Emoji
</x-portal::command.item>
<x-portal::command.item href="">
<x-tabler-calculator class="h-5" />
Calculator
</x-portal::command.item>
</x-portal::command.group>
<x-portal::command.group label="Setting">
<x-portal::command.item href="">
<x-tabler-user class="h-5" />
Profile
</x-portal::command.item>
<x-portal::command.item href="">
<x-tabler-credit-card class="h-5" />
Billing
</x-portal::command.item>
<x-portal::command.item href="">
<x-tabler-settings class="h-5" />
Settings
</x-portal::command.item>
</x-portal::command.group>
</x-portal::command.content>
</x-portal::command>
If you want to customize the components, you can publish them by running the following command :
php artisan vendor:publish --tag=portal-ui:command --force