Laravel Livewire Wizard Laravel Package

title: Introduction weight: 1

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;

use Spatie\LivewireWizard\Components\StepComponent;

class CartStepComponent extends StepComponent
{
    // add any Livewire powered method you want

    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.