├── LICENSE.md
├── README.md
├── composer.json
├── config
    └── livewire-wizard.php
├── resources
    └── views
    │   ├── step-header.blade.php
    │   ├── steps-footer.blade.php
    │   ├── steps-header.blade.php
    │   └── wizard.blade.php
└── src
    ├── Components
        └── Step.php
    ├── Concerns
        ├── BelongsToLivewire.php
        ├── HasHooks.php
        ├── HasState.php
        └── HasSteps.php
    ├── Contracts
        └── WizardForm.php
    ├── LivewireWizardServiceProvider.php
    └── WizardComponent.php


/LICENSE.md:
--------------------------------------------------------------------------------
 1 | The MIT License (MIT)
 2 | 
 3 | Copyright (c) Vildan Bina <vildanbina@gmail.com>
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in
13 | all copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21 | THE SOFTWARE.
22 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
  1 | [![Latest Stable Version](https://poser.pugx.org/vildanbina/livewire-wizard/v)](https://packagist.org/packages/vildanbina/livewire-wizard)
  2 | [![Total Downloads](https://poser.pugx.org/vildanbina/livewire-wizard/downloads)](https://packagist.org/packages/vildanbina/livewire-wizard)
  3 | [![Latest Unstable Version](https://poser.pugx.org/vildanbina/livewire-wizard/v/unstable)](https://packagist.org/packages/vildanbina/livewire-wizard)
  4 | [![License](https://poser.pugx.org/vildanbina/livewire-wizard/license)](https://packagist.org/packages/vildanbina/livewire-wizard)
  5 | [![PHP Version Require](https://poser.pugx.org/vildanbina/livewire-wizard/require/php)](https://packagist.org/packages/vildanbina/livewire-wizard)
  6 | 
  7 | A dynamic Laravel Livewire component for multi steps form.
  8 | 
  9 | ![Multi steps form](https://user-images.githubusercontent.com/51203303/155848196-e3569891-cb63-499d-8079-a63a30925b77.png)
 10 | 
 11 | ## Installation
 12 | 
 13 | You can install the package via composer:
 14 | 
 15 | ``` bash
 16 | composer require vildanbina/livewire-wizard
 17 | ```
 18 | 
 19 | For UI design this package require [WireUI package](https://livewire-wireui.com) for details.
 20 | 
 21 | ## Alpine
 22 | 
 23 | Livewire Wizard requires [Alpine](https://github.com/alpinejs/alpine). You can use the official CDN to quickly include Alpine:
 24 | 
 25 | ```html
 26 | <!-- Alpine v2 -->
 27 | <script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v2.x.x/dist/alpine.min.js" defer></script>
 28 | 
 29 | <!-- Alpine v3 -->
 30 | <script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>
 31 | ```
 32 | 
 33 | ## TailwindCSS
 34 | 
 35 | The base modal is made with TailwindCSS. If you use a different CSS framework I recommend that you publish the modal template and change the markup to include the required classes for your CSS framework.
 36 | 
 37 | ```shell
 38 | php artisan vendor:publish --tag=livewire-wizard-views
 39 | ```
 40 | 
 41 | ## Usage
 42 | 
 43 | ### Creating a wizard form
 44 | 
 45 | You can create livewire component `php artisan make:livewire UserWizard` to make the initial Livewire component. Open your component class and make sure it extends the `WizardComponent` class:
 46 | 
 47 | ```php
 48 | <?php
 49 | 
 50 | namespace App\Livewire;
 51 | 
 52 | use Vildanbina\LivewireWizard\WizardComponent;
 53 | use App\Models\User;
 54 | 
 55 | class UserWizard extends WizardComponent
 56 | {
 57 |     // My custom class property
 58 |     public $userId;
 59 |     
 60 |     /*
 61 |      * Will return App\Models\User instance or will create empty User (based on $userId parameter) 
 62 |      */
 63 |     public function model()
 64 |     {
 65 |         return User::findOrNew($this->userId);
 66 |     }
 67 | }
 68 | ```
 69 | 
 70 | When you need to display wizard form, based on above example we need to pass `$userId` value and to display wizard form:
 71 | 
 72 | ```html 
 73 | <livewire:user-wizard user-id="3"/>
 74 | ```
 75 | 
 76 | Or when you want to create new user, let blank `user-id` attribute, or don't put that.
 77 | 
 78 | When you want to reset form, ex. To reset to the first step, and clear filled fields. You can use:
 79 | 
 80 | ```php
 81 | $wizardFormInstance->resetForm();
 82 | ```
 83 | 
 84 | When you want to have current step instance. You can use:
 85 | 
 86 | ```php
 87 | $wizardFormInstance->getCurrentStep();
 88 | ```
 89 | 
 90 | When you want to go to specific step. You can use:
 91 | 
 92 | ```php
 93 | $wizardFormInstance->setStep($step);
 94 | ```
 95 | 
 96 | Or, you want to go in the next step:
 97 | 
 98 | ```php
 99 | $wizardFormInstance->goToNextStep();
100 | ```
101 | 
102 | Or, you want to go in the prev step:
103 | 
104 | ```php
105 | $wizardFormInstance->goToPrevStep();
106 | ```
107 | 
108 | ### Creating a wizard step
109 | 
110 | You can create wizard form step. Open or create your step class (at `App\Steps` folder) and make sure it extends the `Step` class:
111 | 
112 | ```php
113 | <?php
114 | 
115 | namespace App\Steps;
116 | 
117 | use Vildanbina\LivewireWizard\Components\Step;
118 | use Illuminate\Validation\Rule;
119 | 
120 | class General extends Step
121 | {
122 |     // Step view located at resources/views/steps/general.blade.php 
123 |     protected string $view = 'steps.general';
124 | 
125 |     /*
126 |      * Initialize step fields
127 |      */
128 |     public function mount()
129 |     {
130 |         $this->mergeState([
131 |             'name'                  => $this->model->name,
132 |             'email'                 => $this->model->email,
133 |         ]);
134 |     }
135 |     
136 |     /*
137 |     * Step icon 
138 |     */
139 |     public function icon(): string
140 |     {
141 |         return 'check';
142 |     }
143 | 
144 |     /*
145 |      * When Wizard Form has submitted
146 |      */
147 |     public function save($state)
148 |     {
149 |         $user = $this->model;
150 | 
151 |         $user->name     = $state['name'];
152 |         $user->email    = $state['email'];
153 |         
154 |         $user->save();
155 |     }
156 | 
157 |     /*
158 |      * Step Validation
159 |      */
160 |     public function validate()
161 |     {
162 |         return [
163 |             [
164 |                 'state.name'     => ['required', Rule::unique('users', 'name')->ignoreModel($this->model)],
165 |                 'state.email'    => ['required', Rule::unique('users', 'email')->ignoreModel($this->model)],
166 |             ],
167 |             [],
168 |             [
169 |                 'state.name'     => __('Name'),
170 |                 'state.email'    => __('Email'),
171 |             ],
172 |         ];
173 |     }
174 | 
175 |     /*
176 |      * Step Title
177 |      */
178 |     public function title(): string
179 |     {
180 |         return __('General');
181 |     }
182 | }
183 | ```
184 | 
185 | **Note:** Remember to use the prefix `state.` in the `wire:model` attribute in views, for example: `wire:model="state.name"`
186 | 
187 | 
188 | 
189 | 
190 | 
191 | In Step class, you can use livewire hooks example:
192 | 
193 | ```php
194 | use Vildanbina\LivewireWizard\Components\Step;
195 | 
196 | class General extends Step
197 | {
198 |     public function onStepIn($newStep)
199 |     {
200 |         // Something you want
201 |     }
202 | 
203 |     public function onStepOut($oldStep)
204 |     {
205 |         // Something you want
206 |     }
207 | 
208 |     public function updating($name, $value)
209 |     {
210 |         // Something you want
211 |     }
212 | 
213 |     public function updatingState($name, $value)
214 |     {
215 |         // Something you want
216 |     }
217 |     
218 |     public function updated($name, $value)
219 |     {
220 |         // Something you want
221 |     }
222 | 
223 |     public function updatedState($name, $value)
224 |     {
225 |         // Something you want
226 |     }
227 | }
228 | ```
229 | 
230 | Each step need to have view, you can pass view path in `$view` property.
231 | 
232 | After create step class, you need to put that step to wizard form:
233 | 
234 | ```php
235 | <?php
236 | 
237 | namespace App\Livewire;
238 | 
239 | use App\Steps\General;
240 | use Vildanbina\LivewireWizard\WizardComponent;
241 | 
242 | class UserWizard extends WizardComponent
243 | {
244 |     public array $steps = [
245 |         General::class,
246 |         // Other steps...
247 |     ];
248 |    
249 |     ...
250 | }
251 | ```
252 | 
253 | ## Building Tailwind CSS for production
254 | 
255 | Because some classes are dynamically build and to compile js you should add some classes to the purge safelist so your `tailwind.config.js` should look something like this:
256 | 
257 | ```js
258 | module.exports = {
259 |     presets: [
260 |         require("./vendor/wireui/wireui/tailwind.config.js")
261 |     ],
262 |     content: [
263 |         "./resources/**/*.blade.php",
264 |         "./resources/**/*.js",
265 |         "./resources/**/*.vue",
266 | 
267 |         "./vendor/vildanbina/livewire-wizard/resources/views/*.blade.php",
268 |         "./vendor/wireui/wireui/resources/**/*.blade.php",
269 |         "./vendor/wireui/wireui/ts/**/*.ts",
270 |         "./vendor/wireui/wireui/src/View/**/*.php"
271 |     ],
272 |     plugins: [
273 |         require("@tailwindcss/forms"),
274 |     ],
275 | };
276 | 
277 | ```
278 | 
279 | If you haven't installed `tailwindcss/forms` plugin, install it: `npm install -D @tailwindcss/forms`
280 | 
281 | ## Contributing
282 | 
283 | Please see [CONTRIBUTING](.github/CONTRIBUTING.md) for details.
284 | 
285 | ## Security Vulnerabilities
286 | 
287 | Please e-mail vildanbina@gmail.com to report any security vulnerabilities instead of the issue tracker.
288 | 
289 | ## Credits
290 | 
291 | - [Vildan Bina](https://github.com/vildanbina)
292 | - [All Contributors](../../contributors)
293 | 
294 | ## License
295 | 
296 | The MIT License (MIT). Please see [License File](LICENSE.md) for more information.
297 | 


--------------------------------------------------------------------------------
/composer.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "vildanbina/livewire-wizard-beta",
 3 |     "description": "Laravel Livewire Wizard (Multi-Step Form) component",
 4 |     "keywords": [
 5 |         "laravel",
 6 |         "livewire",
 7 |         "multi-steps",
 8 |         "wizard",
 9 |         "form"
10 |     ],
11 |     "homepage": "https://github.com/vildanbina/livewire-wizard",
12 |     "license": "MIT",
13 |     "authors": [
14 |         {
15 |             "name": "Vildan Bina",
16 |             "email": "vildanbina@gmail.com",
17 |             "role": "Developer"
18 |         }
19 |     ],
20 |     "require": {
21 |         "php": "^8.1",
22 |         "livewire/livewire": "^3.0",
23 |         "spatie/laravel-package-tools": "^1.9",
24 |         "wireui/wireui": "^1.18"
25 |     },
26 |     "autoload": {
27 |         "psr-4": {
28 |             "Vildanbina\\LivewireWizard\\": "src"
29 |         }
30 |     },
31 |     "extra": {
32 |         "laravel": {
33 |             "providers": [
34 |                 "Vildanbina\\LivewireWizard\\LivewireWizardServiceProvider"
35 |             ],
36 |             "aliases": {
37 |                 "LivewireWizard": "Vildanbina\\LivewireWizard\\Facades\\LivewireWizard"
38 |             }
39 |         }
40 |     },
41 |     "minimum-stability": "dev",
42 |     "prefer-stable": true
43 | }
44 | 


--------------------------------------------------------------------------------
/config/livewire-wizard.php:
--------------------------------------------------------------------------------
1 | <?php
2 | 
3 | return [
4 | 
5 | ];
6 | 


--------------------------------------------------------------------------------
/resources/views/step-header.blade.php:
--------------------------------------------------------------------------------
 1 | @php
 2 |     $isStepValid = $stepInstance->isValid();
 3 |     $isFailedStep = $stepInstance->validationFails;
 4 |     $stepIsGreaterOrEqualThan = $this->stepIsGreaterOrEqualThan($stepInstance->getOrder());
 5 | @endphp
 6 | <div class="w-1/3">
 7 |     <div class="relative mb-2">
 8 |         @if(!$loop->first)
 9 |             <div class="absolute" style="width: calc(100% - 2.5rem - 1rem); top: 50%; transform: translate(-50%, -50%)">
10 |                 <div class="bg-gray-200 rounded flex-1">
11 |                     <div
12 |                         @class([
13 |                             'rounded py-0.5',
14 |                             'bg-green-300' => $stepIsGreaterOrEqualThan && !$isFailedStep,
15 |                             'bg-red-300' => $isFailedStep,
16 |                             'w-full' => $isFailedStep || $stepIsGreaterOrEqualThan,
17 |                             'w-0' =>  !($isFailedStep || $stepIsGreaterOrEqualThan)
18 |                         ])
19 |                     ></div>
20 |                 </div>
21 |             </div>
22 |         @endif
23 | 
24 |         <div class="grid place-items-center">
25 |             <x-button.circle
26 |                 :positive="$stepIsGreaterOrEqualThan && !$isFailedStep"
27 |                 :negative="$isFailedStep"
28 |                 wire:click="setStep({{ $stepInstance->getOrder() }})"
29 |                 icon="{{ $stepInstance->icon() }}"
30 |             />
31 |         </div>
32 |     </div>
33 |     <div class="text-xs text-center md:text-base">{{ $stepInstance->title() }}</div>
34 | </div>
35 | 


--------------------------------------------------------------------------------
/resources/views/steps-footer.blade.php:
--------------------------------------------------------------------------------
 1 | <div class="p-2 flex flex-row-reverse justify-between">
 2 |     @if($this->hasNextStep())
 3 |         <x-button lg primary  right-icon="chevron-right" wire:click="goToNextStep" spinner="goToNextStep" :label="__('Next')"/>
 4 |     @else
 5 |         <x-button lg primary type="submit" spinner="submit" :label="__('Submit')"/>
 6 |     @endif
 7 |     @if($this->hasPrevStep())
 8 |         <x-button lg dark :label="__('Back')" icon="chevron-left" wire:click="goToPrevStep" spinner="goToPrevStep"/>
 9 |     @endif
10 | </div>
11 | 


--------------------------------------------------------------------------------
/resources/views/steps-header.blade.php:
--------------------------------------------------------------------------------
1 | <div class="w-full py-2">
2 |     <div class="flex">
3 |         @foreach($stepInstances as $stepInstance)
4 |             @include('livewire-wizard::step-header')
5 |         @endforeach
6 |     </div>
7 | </div>
8 | 


--------------------------------------------------------------------------------
/resources/views/wizard.blade.php:
--------------------------------------------------------------------------------
 1 | <div>
 2 |     <form wire:submit="save">
 3 |         @include('livewire-wizard::steps-header')
 4 |         <div class="container p-4 mx-auto">
 5 |             <x-errors class="mb-4"/>
 6 |             {{ $this->getCurrentStep() }}
 7 |         </div>
 8 | 
 9 |         @include('livewire-wizard::steps-footer')
10 |     </form>
11 | </div>
12 | 


--------------------------------------------------------------------------------
/src/Components/Step.php:
--------------------------------------------------------------------------------
  1 | <?php
  2 | 
  3 | namespace Vildanbina\LivewireWizard\Components;
  4 | 
  5 | use Illuminate\Contracts\Support\Htmlable;
  6 | use Illuminate\Contracts\View\View;
  7 | use Illuminate\Database\Eloquent\Model;
  8 | use Illuminate\View\Component as ViewComponent;
  9 | use Vildanbina\LivewireWizard\Concerns\BelongsToLivewire;
 10 | use Vildanbina\LivewireWizard\Concerns\HasHooks;
 11 | use Vildanbina\LivewireWizard\Contracts\WizardForm;
 12 | 
 13 | abstract class Step extends ViewComponent implements Htmlable
 14 | {
 15 |     use BelongsToLivewire;
 16 |     use HasHooks;
 17 | 
 18 |     public ?int $order = null;
 19 |     public null|array|Model $model = null;
 20 |     protected string $view;
 21 |     public bool $validationFails = false;
 22 | 
 23 |     public function __construct(WizardForm $livewire)
 24 |     {
 25 |         $this
 26 |             ->setLivewire($livewire)
 27 |             ->setModel($livewire->getModel());
 28 |     }
 29 | 
 30 |     public static function make(WizardForm $livewire): static
 31 |     {
 32 |         return new static($livewire);
 33 |     }
 34 | 
 35 |     public function getModel(): ?Model
 36 |     {
 37 |         return $this->model;
 38 |     }
 39 | 
 40 |     public function setModel(?Model $model): Step
 41 |     {
 42 |         $this->model = $model;
 43 |         return $this;
 44 |     }
 45 | 
 46 |     public function icon(): string
 47 |     {
 48 |         return 'check';
 49 |     }
 50 | 
 51 |     public function isValid(): bool
 52 |     {
 53 |         if (method_exists($this, 'validate')) {
 54 |             return !validator(['state' => $this->livewire->state], ...$this->validate())->fails();
 55 |         }
 56 | 
 57 |         return true;
 58 |     }
 59 | 
 60 |     public function setState(array $state = [])
 61 |     {
 62 |         $this->getLivewire()->state = $state;
 63 |     }
 64 | 
 65 |     public function mergeState(array $state = [])
 66 |     {
 67 |         $this->getLivewire()->mergeState($state);
 68 |     }
 69 | 
 70 |     public function putState($key, $value = null, $default = null)
 71 |     {
 72 |         $this->getLivewire()->putState($key, $value, $default);
 73 |     }
 74 | 
 75 |     abstract public function title(): string;
 76 | 
 77 |     public function getOrder(): ?int
 78 |     {
 79 |         return $this->order;
 80 |     }
 81 | 
 82 |     public function setOrder(int $order): static
 83 |     {
 84 |         $this->order = $order;
 85 |         return $this;
 86 |     }
 87 | 
 88 |     public function setView(string $view): static
 89 |     {
 90 |         $this->view = $view;
 91 | 
 92 |         return $this;
 93 |     }
 94 | 
 95 |     public function toHtml(): string
 96 |     {
 97 |         return $this->render()->render();
 98 |     }
 99 | 
100 |     public function render(): View
101 |     {
102 |         return view($this->getView(), array_merge($this->data(), [
103 |             'container' => $this,
104 |         ]));
105 |     }
106 | 
107 |     public function getView(): string
108 |     {
109 |         return $this->view;
110 |     }
111 | }
112 | 


--------------------------------------------------------------------------------
/src/Concerns/BelongsToLivewire.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | namespace Vildanbina\LivewireWizard\Concerns;
 4 | 
 5 | use Vildanbina\LivewireWizard\Contracts\WizardForm;
 6 | 
 7 | trait BelongsToLivewire
 8 | {
 9 |     protected WizardForm $livewire;
10 | 
11 |     public function setLivewire(WizardForm $livewire): static
12 |     {
13 |         $this->livewire = $livewire;
14 | 
15 |         return $this;
16 |     }
17 | 
18 |     public function getLivewire(): WizardForm
19 |     {
20 |         return $this->livewire;
21 |     }
22 | }
23 | 


--------------------------------------------------------------------------------
/src/Concerns/HasHooks.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | namespace Vildanbina\LivewireWizard\Concerns;
 4 | 
 5 | trait HasHooks
 6 | {
 7 |     public function callHook(string $hook, ...$args): void
 8 |     {
 9 |         if (!method_exists($this, $hook)) {
10 |             return;
11 |         }
12 | 
13 |         $this->{$hook}(...$args);
14 |     }
15 | }
16 | 


--------------------------------------------------------------------------------
/src/Concerns/HasState.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | namespace Vildanbina\LivewireWizard\Concerns;
 4 | 
 5 | trait HasState
 6 | {
 7 |     public array $state = [];
 8 | 
 9 |     public function getState(): array
10 |     {
11 |         return $this->state;
12 |     }
13 | 
14 |     public function setState(array $state): static
15 |     {
16 |         $this->state = $state;
17 |         return $this;
18 |     }
19 | 
20 |     public function mergeState(array $state): static
21 |     {
22 |         $this->state = array_merge($this->state, $state);
23 |         return $this;
24 |     }
25 | 
26 |     public function putState($key, $value = null, $default = null): static
27 |     {
28 |         data_set($this->state, $key, $value, $default);
29 |         return $this;
30 |     }
31 | }
32 | 


--------------------------------------------------------------------------------
/src/Concerns/HasSteps.php:
--------------------------------------------------------------------------------
  1 | <?php
  2 | 
  3 | namespace Vildanbina\LivewireWizard\Concerns;
  4 | 
  5 | use Arr;
  6 | use Livewire\Attributes\Url;
  7 | 
  8 | trait HasSteps
  9 | {
 10 |     #[Url(keep: true)]
 11 |     public int $activeStep = 0;
 12 |     public array $steps = [];
 13 | 
 14 |     public function stepIs($step): bool
 15 |     {
 16 |         return $this->activeStep == $step;
 17 |     }
 18 | 
 19 |     public function stepIsGreaterOrEqualThan($step): bool
 20 |     {
 21 |         return $this->activeStep >= $step;
 22 |     }
 23 | 
 24 |     public function stepIsLessOrEqualThan($step): bool
 25 |     {
 26 |         return $this->activeStep <= $step;
 27 |     }
 28 | 
 29 |     public function goToNextStep($step = null): void
 30 |     {
 31 |         $this->setStep($this->nextStep($step));
 32 |     }
 33 | 
 34 |     public function setStep($step): void
 35 |     {
 36 |         $this->callHook('beforeSetStep', $this->activeStep, $step);
 37 | 
 38 |         if ($this->hasPrevStep($step)) {
 39 |             $this->stepsValidation($this->prevStep($step));
 40 |         }
 41 | 
 42 |         $this->getCurrentStep()->callHook('onStepOut', $this->activeStep);
 43 | 
 44 |         $this->activeStep = $step;
 45 | 
 46 |         $this->getCurrentStep()->callHook('onStepIn', $step);
 47 | 
 48 |         $this->callHook('afterSetStep', $this->activeStep, $step);
 49 |     }
 50 | 
 51 |     public function hasPrevStep($step = null): bool
 52 |     {
 53 |         $step ??= $this->activeStep;
 54 |         return Arr::has($this->steps(), (int) $step - 1);
 55 |     }
 56 | 
 57 |     public function prevStep($step = null): int
 58 |     {
 59 |         $step ??= $this->activeStep;
 60 |         return $this->hasPrevStep($step) ? $step - 1 : $step;
 61 |     }
 62 | 
 63 |     public function nextStep($step = null): int
 64 |     {
 65 |         $step ??= $this->activeStep;
 66 |         return $this->hasNextStep() ? $step + 1 : $step;
 67 |     }
 68 | 
 69 |     public function hasNextStep($step = null): bool
 70 |     {
 71 |         $step ??= $this->activeStep;
 72 |         return Arr::has($this->steps(), $step + 1);
 73 |     }
 74 | 
 75 |     public function stepIsGreaterThan($step): bool
 76 |     {
 77 |         return $this->activeStep > $step;
 78 |     }
 79 | 
 80 |     public function totalSteps(): int
 81 |     {
 82 |         return count($this->steps());
 83 |     }
 84 | 
 85 |     public function goToPrevStep($step = null): void
 86 |     {
 87 |         $this->setStep($this->prevStep($step));
 88 |     }
 89 | 
 90 |     public function stepIsLessThan($step): bool
 91 |     {
 92 |         return $this->activeStep < $step;
 93 |     }
 94 | 
 95 |     protected function queryStringHasSteps()
 96 |     {
 97 |         if ($this->saveStepState) {
 98 |             return ['activeStep'];
 99 |         }
100 | 
101 |         return [];
102 |     }
103 | }
104 | 


--------------------------------------------------------------------------------
/src/Contracts/WizardForm.php:
--------------------------------------------------------------------------------
1 | <?php
2 | 
3 | namespace Vildanbina\LivewireWizard\Contracts;
4 | 
5 | interface WizardForm
6 | {
7 | }
8 | 


--------------------------------------------------------------------------------
/src/LivewireWizardServiceProvider.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | namespace Vildanbina\LivewireWizard;
 4 | 
 5 | use Spatie\LaravelPackageTools\Package;
 6 | use Spatie\LaravelPackageTools\PackageServiceProvider;
 7 | 
 8 | class LivewireWizardServiceProvider extends PackageServiceProvider
 9 | {
10 |     public function configurePackage(Package $package): void
11 |     {
12 |         $package
13 |             ->name('livewire-wizard')
14 |             ->hasConfigFile()
15 |             ->hasViews();
16 |     }
17 | }
18 | 


--------------------------------------------------------------------------------
/src/WizardComponent.php:
--------------------------------------------------------------------------------
  1 | <?php
  2 | 
  3 | namespace Vildanbina\LivewireWizard;
  4 | 
  5 | use Closure;
  6 | use Exception;
  7 | use Illuminate\Contracts\View\View;
  8 | use Illuminate\Database\Eloquent\Model;
  9 | use Livewire\Component;
 10 | use Str;
 11 | use Vildanbina\LivewireWizard\Components\Step;
 12 | use Vildanbina\LivewireWizard\Concerns\HasHooks;
 13 | use Vildanbina\LivewireWizard\Concerns\HasState;
 14 | use Vildanbina\LivewireWizard\Concerns\HasSteps;
 15 | use Vildanbina\LivewireWizard\Contracts\WizardForm;
 16 | 
 17 | abstract class WizardComponent extends Component implements WizardForm
 18 | {
 19 |     use HasSteps;
 20 |     use HasHooks;
 21 |     use HasState;
 22 | 
 23 |     public bool $saveStepState = true;
 24 |     public null|array|Model $model = null;
 25 |     protected array $cachedSteps = [];
 26 | 
 27 |     protected $queryString = [];
 28 |     public function resetForm(): void
 29 |     {
 30 |         $this->callHook('beforeResetForm');
 31 | 
 32 |         $this->setStep(array_key_first($this->steps()));
 33 |         $this->mount();
 34 | 
 35 |         $this->callHook('afterResetForm');
 36 |     }
 37 | 
 38 |     public function steps(): array
 39 |     {
 40 |         if (property_exists($this, 'steps')) {
 41 |             return $this->steps;
 42 |         }
 43 | 
 44 |         return [];
 45 |     }
 46 | 
 47 |     public function mount()
 48 |     {
 49 |         $this->callHook('beforeMount', ...func_get_args());
 50 | 
 51 |         if (method_exists($this, 'model')) {
 52 |             $this->model = $this->model();
 53 |         }
 54 | 
 55 |         $this->stepClasses(function (Step $step) {
 56 |             
 57 |             if (method_exists($this, 'model')) {
 58 |                 $step->setModel($this->model);
 59 |             }
 60 |             
 61 |             if (method_exists($step, 'mount')) {
 62 |                 $step->mount();
 63 |             }
 64 | 
 65 |             if ($step->getOrder() < $this->activeStep && !$step->isValid()) {
 66 |                 $this->setStep($step->getOrder());
 67 |             }
 68 |         });
 69 | 
 70 |         $this->callHook('afterMount', ...func_get_args());
 71 |     }
 72 | 
 73 |     protected function stepClasses(null|Closure $callback = null): array
 74 |     {
 75 | 
 76 |         if (filled($this->cachedSteps)) {
 77 |             return collect($this->cachedSteps)
 78 |                 ->each(fn(Step $step, $index) => value($callback, $step, $index))
 79 |                 ->toArray();
 80 |         }
 81 | 
 82 |         if (filled($this->steps())) {
 83 |             $this->cachedSteps = collect($this->steps())
 84 |                 ->map(function ($step, $index) use ($callback) {
 85 |                     if (class_exists($step) && is_subclass_of($step, Step::class)) {
 86 |                         $stepInstance = $step::make($this);
 87 | 
 88 |                         if (is_null($stepInstance->getOrder())) {
 89 |                             $stepInstance->setOrder($index);
 90 |                         }
 91 | 
 92 |                         return $stepInstance;
 93 |                     }
 94 |                     return null;
 95 |                 })
 96 |                 ->filter()
 97 |                 ->sortBy('order')
 98 |                 ->values()
 99 |                 ->toArray();
100 | 
101 |             if ($callback instanceof Closure) {
102 |                 return $this->stepClasses($callback);
103 |             }
104 |         }
105 | 
106 |         return $this->cachedSteps;
107 |     }
108 | 
109 |     public function getModel(): ?Model
110 |     {
111 |         return $this->model;
112 |     }
113 | 
114 |     public function updated($name, $value): void
115 |     {
116 |         $this->callHooksStep('updated', $name, $value);
117 |     }
118 | 
119 |     private function callHooksStep($hook, $name, $value): void
120 |     {
121 |         $stepInstance = $this->getCurrentStep();
122 |         $name         = Str::of($name);
123 | 
124 |         $propertyName     = $name->studly()->before('.');
125 |         $keyAfterFirstDot = $name->contains('.') ? $name->after('.')->__toString() : null;
126 |         $keyAfterLastDot  = $name->contains('.') ? $name->afterLast('.')->__toString() : null;
127 | 
128 |         $beforeMethod = $hook . $propertyName;
129 | 
130 |         $beforeNestedMethod = $name->contains('.')
131 |             ? $hook . $name->replace('.', '_')->studly()
132 |             : false;
133 | 
134 |         $stepInstance->callHook($beforeMethod, $value, $keyAfterFirstDot);
135 | 
136 |         if ($beforeNestedMethod) {
137 |             $stepInstance->callHook($beforeNestedMethod, $value, $keyAfterLastDot);
138 |         }
139 |     }
140 | 
141 |     public function getCurrentStep(): ?Step
142 |     {
143 |         return $this->getStepInstance($this->activeStep);
144 |     }
145 | 
146 |     public function getStepInstance($step): ?Step
147 |     {
148 |         if (($stepInstance = data_get($this->stepClasses(), $step)) && !$stepInstance instanceof Step) {
149 |             throw new Exception(get_class($stepInstance) . ' must bee ' . Step::class . ' instance');
150 |         }
151 | 
152 |         return $stepInstance;
153 |     }
154 | 
155 |     public function updating($name, $value): void
156 |     {
157 |         $this->callHooksStep('updating', $name, $value);
158 |     }
159 | 
160 |     public function save(): void
161 |     {
162 |         $this->callHook('beforeValidate');
163 | 
164 |         $this->stepsValidation();
165 | 
166 |         $this->callHook('afterValidate');
167 | 
168 |         $state = $this->mutateStateBeforeSave($this->getState());
169 | 
170 |         $this->callHook('beforeSave');
171 | 
172 |         $this->stepClasses(function (Step $stepInstance) use ($state) {
173 |             if (method_exists($stepInstance, 'save')) {
174 |                 $stepInstance->save($state);
175 |             }
176 |         });
177 | 
178 |         $this->callHook('afterSave');
179 |     }
180 | 
181 |     protected function stepsValidation($step = null): void
182 |     {
183 |         [$rules, $messages, $attributes] = [[], [], []];
184 |         $step = $step ?? max(array_keys($this->steps()));
185 | 
186 |         $this->stepClasses(function (Step $stepInstance) use ($step, &$rules, &$messages, &$attributes) {
187 | 
188 |             if (method_exists($stepInstance, 'validate') && $stepInstance->getOrder() <= $step) {
189 |                 $stepValidate = $stepInstance->validate();
190 |                 $stepInstance->validationFails = !$stepInstance->isValid();
191 | 
192 |                 $rules      = array_merge($rules, $stepValidate[0] ?? []);
193 |                 $messages   = array_merge($messages, $stepValidate[1] ?? []);
194 |                 $attributes = array_merge($attributes, $stepValidate[2] ?? []);
195 |             }
196 |         });
197 | 
198 |         if (filled($rules)) {
199 |             $this->validate($rules, $messages, $attributes);
200 |         }
201 |     }
202 | 
203 |     public function mutateStateBeforeSave(array $state = []): array
204 |     {
205 |         return $state;
206 |     }
207 | 
208 |     public function render(): View
209 |     {
210 |         return view('livewire-wizard::wizard', [
211 |             'stepInstances' => $this->stepClasses(),
212 |         ]);
213 |     }
214 | }
215 | 


--------------------------------------------------------------------------------