README

A dropdown field with flags and custom labels. The field can be used as a country or language selector in Filament forms.

This package utilizes flag-icons to display the country flags.

Installation

You can install the package via composer:

composer require ranium/filament-flags-dropdown

You can publish the config file with (optional):

php artisan vendor:publish --tag="filament-flags-dropdown-config"

Usage

You can now use the FlagsDropdown field in your form builder. You need to provide the options to display in the dropdown.

The options array keys should be the ISO 3166-1-alpha-2 code of the country and the value should be an array of value and label for the option. In the following example, IND will be saved in the database when India is chosen from the dropdown.

use Ranium\FlagsDropdown\Forms\Components\Fields\FlagsDropdown;

public static function form(Form $form): Form
{
    $countries = [
        'in' => ['value' => 'IND', 'label' => 'India'],
        'us' => ['value' => 'USA', 'label' => 'United States'],
    ];
    
    return $form
        ->schema([
            // ... Other fields
            FlagsDropdown::make('country')
                ->options($countries), // Chain your field modifiers here
            // Other fields
        ]);
}

If you want the dropdown to have the same value as the label then your options can be built like this:

$countries = [
    'in' => 'India',
    'us' => 'United States'
];

In this case the field's value will be "India" when that option is chosen.

Events

The field fires an event whenever its value is changed. You can listen to the event and bind it to a callable. The new and old values are passed as arguments to the callable.

use Filament\Pages\Page;
use Filament\Forms\Concerns\InteractsWithForms;
use Ranium\FlagsDropdown\Forms\Components\Fields\FlagsDropdown;

class Settings extends Page
{
    use InteractsWithForms;
    
    protected static ?string $navigationIcon = 'heroicon-o-document-text';

    protected static string $view = 'filament.pages.settings';
    
    protected function getFormSchema(): array
    {
        return [
            FlagsDropdown::make('language')                
                ->options(['in' => 'Hindi', 'gb' => 'English'])
                ->onChange($this->doSomething(...)),
        ];
    }
    
    public function doSomething(?string $newValue, ?string $oldValue)
    {
        // This method will be called whenever the value of the
        // dropdown changes in the frontend
    }
}

Testing

composer test

Changelog

Please see CHANGELOG for more information on what has changed recently.

Contributing

Please see CONTRIBUTING for details.

Security Vulnerabilities

Please review our security policy on how to report security vulnerabilities.

Credits

License

The MIT License (MIT). Please see License File for more information.

ranium / filament-flags-dropdown

Maintainers

Details