artisan-build/verbs-flux

Turn your Verbs events into Flux forms.

dev-main 2024-11-06 20:29 UTC

Requires

• php: >8.2

Requires (Dev)

• hirethunk/verbs: ^0.6.4
• illuminate/support: ^11.30
• livewire/flux: ^1.0
• livewire/flux-pro: ^1.0
• phpstan/phpstan: ^1.12

Suggests

• hirethunk/verbs: If you don't know, then this package is not for you. dummy.
• livewire/flux: If you don't know, then this package is not for you. dummy.

MIT

• Ed Grosvenor
• Len Woodward

README

Turn your Verbs events into Flux forms.

Usage

First, install the package: composer install artisan-build/verbs-flux

Next, add some attributes to your event to indicate what type of fields should be used:

namespace App\Events;

use App\States\UserBalance;
+ use ArtisanBuild\VerbsFlux\Attributes\EventForm;
+ use ArtisanBuild\VerbsFlux\Attributes\EventInput;
+ use ArtisanBuild\VerbsFlux\Enums\InputTypes;
use Thunk\Verbs\Attributes\Autodiscovery\StateId;
use Thunk\Verbs\Event;

+ #[EventForm()]
class FundsAdded extends Event
{
    #[StateId(UserBalance::class)]
    public int $userId;

+     #[EventInput(
+         type: InputTypes::Number,
+         label: 'Amount',
+         rules: ['required', 'numeric', 'min:0.01'],
+     )]
    public float $amount;

+     #[EventInput(
+         type: InputTypes::Text,
+         label: 'Notes',
+     )]
    public string $notes;

Finally, add a livewire component and indicate which event it should use:

<livewire:event-form :event="\App\Events\FundsAdded::class" />

Tip: you can include this inside a modal like this:

<flux:modal.trigger name="adjust-balance">
    <flux:button>Add Transaction</flux:button>
</flux:modal.trigger>

<flux:modal name="adjust-balance" class="md:w-96 space-y-6">
    <livewire:event-form :event="\App\Events\FundsAdded::class" />
</flux:modal>