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.
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"
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.
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
}
}
composer test
Please see CHANGELOG for more information on what has changed recently.
Please see CONTRIBUTING for details.
Please review our security policy on how to report security vulnerabilities.
The MIT License (MIT). Please see License File for more information.