April Ui
A Laravel Blade component library with Alpine JS and Livewire support.
#April UI
April UI is a Laravel Blade component library with Tailwind CSS and Alpine JS. It keeps the Laravel component workflow: use package views by default and publish application overrides only when you need to change markup.
#Requirements
- PHP 8.3 or newer
- Laravel 12 or Laravel 13
- Tailwind CSS 4 when using the package stylesheet
#Install
composer require yungifez/april-ui
Add @aprilStyles and @aprilScripts to your layout, then use the components:
<april:button>Save changes</april:button>
The rich text editor is optional. Add @aprilEditorScripts only to layouts that render <april:editor> so the TipTap
editor bundle is not loaded for the rest of the application.
April UI keeps components in vendor/ by default. Use the package commands when you need more control:
php artisan april:list
php artisan april:publish button
php artisan april:update --diff
php artisan april:doctor
april:publish delegates to Laravel's vendor publishing system. Published views go to
resources/views/vendor/april/components, where Laravel loads them as overrides. Use php artisan april:publish --all
to publish every component.
#MCP server
Run php artisan april:mcp as a local MCP server. It exposes component listing, search, source resources, and
vendor-path publishing over newline-delimited JSON-RPC.
Use php artisan april:mcp:install to add the server to the project's .mcp.json beside Laravel Boost. For Codex,
use php artisan april:mcp:install --codex to update the project-scoped .codex/config.toml. The command is safe to
run more than once. A .toml path passed to --config is also handled as a Codex configuration.
#Official website
You can find the official docs on the April UI website.
#Contributing
Read CONTRIBUTING.md before opening a pull request.
#Livewire data tables
The Livewire adapter ships with April UI. Install April UI and Livewire in your Laravel application:
composer require yungifez/april-ui livewire/livewire
Then extend Yungifez\\AprilUI\\Livewire\\DataTableComponent, provide a query builder, and define columns with Yungifez\\AprilUI\\Livewire\\Columns\\Column. The adapter adds server-side search, sorting, pagination, URL state, and row selection while the base april:data-table component remains usable without Livewire.