### Install with FilaFluxKit CLI Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Simplified setup using the FilaFluxKit CLI. Requires the CLI to be installed globally via Composer. ```bash filafluxkit new my-app --kit=jeffersongoncalves/filafluxkitv5 ``` -------------------------------- ### Run easy installation script Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Automates installation: installs Composer dependencies, sets up environment, generates app key, sets up database, runs migrations, installs Node dependencies, builds assets, and configures Herd if used. ```bash php install.php ``` -------------------------------- ### Set up environment file (Docker) Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Copies the example environment file to create the .env file. ```bash cp .env.example .env ``` -------------------------------- ### Set up environment and generate app key Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Sets up the environment file by copying the example and generates the application encryption key. ```bash cp .env.example .env php artisan key:generate ``` -------------------------------- ### Run the development server Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Starts the Laravel development server. ```bash php artisan serve ``` -------------------------------- ### Install filament-flux on a new panel Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Installs filament-flux on a new panel and rebuilds assets. Replace {panel-id} with the actual panel ID. ```bash php artisan filament-flux:install --panel={panel-id} pnpm build ``` -------------------------------- ### Install JavaScript dependencies Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Installs JavaScript dependencies for the project. ```bash pnpm install ``` -------------------------------- ### Install Composer dependencies Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Installs Composer (PHP) dependencies for the project. ```bash composer install ``` -------------------------------- ### Start Sail containers Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Starts the Laravel Sail containers in detached mode. The development server is handled automatically, so php artisan serve is not needed. ```bash ./vendor/bin/sail up -d ``` -------------------------------- ### Register FilamentFluxPlugin with all layers Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Registers the filament-flux plugin on a Filament panel, enabling all three layers: form field replacement, navigation replacement, and atomic Blade component replacement. This is the default setup for the kit. ```php FilamentFluxPlugin::make() ->useEverywhere() // Form Fields (container bindings) ->useFluxNavigation() // Sidebar + topbar items ->useFluxComponents(); // Atomic Blade components ``` -------------------------------- ### Move into project directory Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Moves into the project directory. ```bash cd my-app ``` -------------------------------- ### Build frontend assets Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Builds frontend assets for production. ```bash pnpm run build ``` -------------------------------- ### Run database migrations Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Runs database migrations after configuring the database in the .env file. ```bash php artisan migrate ``` -------------------------------- ### Configure useFluxNavigation options Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Configures navigation replacement: enables sidebar and topbar, while shell and themeSwitcher are opt-in and disabled by default. The shell is invasive, so enable with caution. ```php FilamentFluxPlugin::make()->useFluxNavigation([ 'sidebar' => true, 'topbar' => true, 'shell' => false, // outer / shell — invasive, opt-in 'themeSwitcher' => false, // single theme switcher — opt-in ]); ``` -------------------------------- ### Run Development Server with composer dev or Individual Commands Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Commands to run the development server. The first command runs the server with logs, queues, and asset compilation. The second set runs each component separately: the Laravel server, the queue listener with one retry attempt, and the frontend asset compiler. ```bash composer dev ``` ```bash php artisan serve php artisan queue:listen --tries=1 pnpm run dev ``` -------------------------------- ### Create Laravel app with FilaFluxKit v5 Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Creates a new Laravel application using the FilaFluxKit v5 starter kit with MySQL as the database. Requires PHP 8.3 or higher, Composer, Node.js, and PNPM. ```bash laravel new my-app --using=jeffersongoncalves/filafluxkitv5 --database=mysql ``` -------------------------------- ### Import Flux and filament-flux CSS in panel theme Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Imports the required CSS for each panel theme: Filament's theme, Livewire Flux, and filament-flux. These imports are present in the panel provider files listed in the documentation. ```css @import '../../../../vendor/filament/filament/resources/css/theme.css'; @import '../../../../vendor/livewire/flux/dist/flux.css'; @import '../../../../vendor/jeffersongoncalves/filament-flux/dist/filament-flux.css'; ``` -------------------------------- ### Configure custom ports for Docker Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Configures custom ports for the application, MySQL, Redis, and Mailpit to avoid conflicts with other services. ```bash # Application Port (ex: 8080) APP_PORT=8080 # MySQL Port (ex: 3306) FORWARD_DB_PORT=3306 # Redis Port (ex: 6379) FORWARD_REDIS_PORT=6379 # Mailpit Port (ex: 1025) FORWARD_MAILPIT_PORT=1025 ``` -------------------------------- ### Configure filament-flux plugin options Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Configures plugin options: sets a CSS scope class (or null for Flux's native zinc palette), injects appearance and scripts. Use to customize styling and asset injection. ```php FilamentFluxPlugin::make() ->scopeClass('filament-flux-scope') // CSS scope wrapper; pass null to use Flux's native zinc palette ->injectAppearance(true) // @fluxAppearance in + theme bridge ->injectScripts(true); // @fluxScripts before ``` -------------------------------- ### Attach to application container Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Attaches to the application container to run commands inside it. ```bash ./vendor/bin/sail shell ``` -------------------------------- ### Generate application key (Docker) Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Generates the application encryption key inside the Sail container. ```bash php artisan key:generate ``` -------------------------------- ### Opt in to Flux Blade component replacement Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Opts in to Flux replacement for specific atomic Blade components. Omit or set false to keep Filament's original view for that component. ```php FilamentFluxPlugin::make()->useFluxComponents([ 'badge' => true, 'avatar' => true, 'icon' => true, // omit/false → keep Filament's view ]); ``` -------------------------------- ### Opt out of Flux form field replacement Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md Opts out of Flux replacement for specific form fields (select and otp) while keeping the rest replaced. Use this to preserve native behavior for those fields. ```php FilamentFluxPlugin::make()->useEverywhere([ 'select' => false, // keep native