Laravel-livewire-wizard
Headless Livewire components to build wizards
This package offers lightweight Livewire components that allow you to easily build a wizard. With "wizard" we mean a multi-step process in which each step has its own screen.
Here's how a wizard component class could look like.
use Spatie\LivewireWizard\Components\WizardComponent;
class CheckoutWizardComponent extends WizardComponent
{
public function steps() : array
{
return [
CartStepComponent::class,
DeliveryAddressStepComponent::class,
ConfirmOrderStepComponent::class,
];
}
}
A step is class that extends StepComponent
(which in its turn extends Livewire\Component
). You can do anything in here that you can do with a regular Livewire component.
namespace App\Components;
class CartStepComponent extends StepComponent
{
public function render()
{
return view('checkout-wizard.steps.cart');
}
}
You can easily control which step is displayed, access state of other steps, and build any navigation you desire.
In this repo on GitHub, you'll find a demo Laravel application that uses the laravel-livewire-wizard package to create a simple checkout flow.