PHP code example of tapp / filament-confetti

1. Go to this page and download the library: Download tapp/filament-confetti library. Choose the download type require.

2. Extract the ZIP file and open the index.php.

3. Add this code to the index.php.
    
        
<?php
require_once('vendor/autoload.php');

/* Start to develop here. Best regards https://php-download.com/ */

    

tapp / filament-confetti example snippets


use Tapp\FilamentConfetti\Actions\ConfettiAction;

// Basic confetti
ConfettiAction::make('celebrate')
    ->label('Celebrate! 🎉')
    ->basic()

// Fireworks
ConfettiAction::make('fireworks')
    ->label('Launch Fireworks')
    ->fireworks()

// With auto-fire
ConfettiAction::make('success')
    ->fireworks()
    ->autoFire()
    ->delay(500)

// Custom configuration
ConfettiAction::make('custom')
    ->confettiOptions([
        'particleCount' => 150,
        'spread' => 90,
        'origin' => ['y' => 0.5],
    ])
    ->colors(['#ff0000', '#00ff00', '#0000ff'])

use Tapp\FilamentConfetti\Components\Confetti;

// In a form schema
Confetti::make()
    ->stars()
    ->autoFire()
    ->delay(1000)

// With custom trigger
Confetti::make()
    ->fireworks()
    ->trigger('celebrate')

// Then trigger from JavaScript
// $dispatch('celebrate')

ConfettiAction::make('basic')
    ->basic()
    ->particleCount(100)
    ->colors(['#ff0000', '#00ff00', '#0000ff'])

ConfettiAction::make('fireworks')
    ->fireworks(duration: 5000)
    ->colors(['#FFE400', '#FFBD00', '#E89400'])

ConfettiAction::make('snow')
    ->snow(duration: 10000)
    ->colors(['#ffffff', '#99ccff'])

ConfettiAction::make('stars')
    ->stars()
    ->colors(['#FFE400', '#FFBD00', '#E89400', '#FFCA6C', '#FDFFB8'])

ConfettiAction::make('cannons')
    ->sideCannons(duration: 3000)
    ->particleCount(5)

ConfettiAction::make('realistic')
    ->realistic()
    ->particleCount(200)

ConfettiAction::make('school')
    ->school(duration: 3000)

ConfettiAction::make('random')
    ->randomDirection()

ConfettiAction::make('hearts')
    ->emoji('❤️')

ConfettiAction::make('unicorns')
    ->emoji('🦄')
    ->particleCount(50)

ConfettiAction::make('triangles')
    ->customShape('M0 10 L5 0 L10 10z')
    ->colors(['#ff0000', '#00ff00'])

ConfettiAction::make('advanced')
    ->confettiOptions([
        'particleCount' => 100,       // Number of confetti particles
        'angle' => 90,                // Launch angle in degrees
        'spread' => 45,               // Spread in degrees
        'startVelocity' => 45,        // Initial velocity in pixels
        'decay' => 0.9,               // Speed decay rate
        'gravity' => 1,               // Gravity strength
        'drift' => 0,                 // Horizontal drift
        'ticks' => 200,               // Animation duration
        'origin' => [                 // Launch origin point
            'x' => 0.5,               // 0 = left, 1 = right
            'y' => 0.5                // 0 = top, 1 = bottom
        ],
        'colors' => [                 // Array of color hex codes
            '#ff0000',
            '#00ff00',
            '#0000ff'
        ],
        'shapes' => [                 // Particle shapes
            'square',
            'circle',
            'star'
        ],
        'scalar' => 1,                // Size multiplier
        'zIndex' => 100,              // CSS z-index
    ])

ConfettiAction::make('combo')
    ->action(function () {
        // First burst
        $this->dispatch('confetti', [
            'options' => [
                'particleCount' => 50,
                'spread' => 70,
                'origin' => ['y' => 0.6]
            ]
        ]);
        
        // Second burst after delay
        $this->dispatch('confetti', [
            'options' => [
                'particleCount' => 30,
                'spread' => 90,
                'origin' => ['x' => 0.2, 'y' => 0.7]
            ]
        ]);
    })

ConfettiAction::make('dynamic')
    ->confettiOptions(fn () => [
        'particleCount' => rand(50, 150),
        'angle' => rand(55, 125),
        'colors' => $this->getUserFavoriteColors(),
    ])

use Filament\Forms\Form;
use YourVendor\FilamentConfetti\Actions\ConfettiAction;

public function form(Form $form): Form
{
    return $form
        ->schema([
            // ... your form fields
        ])
        ->statePath('data');
}

protected function getFormActions(): array
{
    return [
        Action::make('save')
            ->action(function () {
                // Save logic
                $this->save();
                
                // Trigger confetti
                $this->dispatch('confetti', [
                    'preset' => 'fireworks',
                    'options' => ['duration' => 3000]
                ]);
                
                Notification::make()
                    ->success()
                    ->title('Saved successfully!')
                    ->send();
            }),
    ];
}

use Filament\Pages\Page;
use YourVendor\FilamentConfetti\Components\Confetti;

class CelebrationPage extends Page
{
    protected static string $view = 'filament.pages.celebration';
    
    public function mount(): void
    {
        $this->dispatch('confetti', [
            'preset' => 'school',
            'options' => ['duration' => 5000]
        ]);
    }
}

use Filament\Tables\Actions\Action;

Action::make('celebrate')
    ->icon('heroicon-o-sparkles')
    ->action(function (Model $record) {
        $record->markAsCelebrated();
        
        $this->dispatch('confetti', [
            'preset' => 'stars',
            'options' => [
                'colors' => ['#FFE400', '#FFBD00', '#E89400']
            ]
        ]);
    })

Action::make('winner')
    ->modalHeading('Congratulations! 🎉')
    ->modalContent(view('filament.modals.winner'))
    ->modalActions([
        Action::make('claim')
            ->action(fn () => $this->claimPrize()),
    ])
    ->after(function () {
        $this->dispatch('confetti', [
            'preset' => 'realistic',
            'options' => ['particleCount' => 200]
        ]);
    })