← All plugins
MoonShine Heroicons Field
Heroicons field integration for MoonShine Laravel admin panel. This package adds a searchable icon picker field with support for all Heroicons styles (solid, outline, mini, micro). Features configurable default styles, Blade template integration, and caching support for optimal performance.
MoonShine Heroicons Field

Convenient Heroicons selection field for MoonShine
Installation
composer require bugo/moonshine-heroicons-field
composer require bugo/moonshine-heroicons-field
composer require bugo/moonshine-heroicons-field
composer require bugo/moonshine-heroicons-field
composer require bugo/moonshine-heroicons-field
Configuration
You can specify desired default style for icons:
.env
:
HEROICONS_STYLE=outline
HEROICONS_STYLE=outline
HEROICONS_STYLE=outline
HEROICONS_STYLE=outline
HEROICONS_STYLE=outline
config/heroicons-field.php
:
php artisan vendor:publish --tag=heroicons-field
php artisan vendor:publish --tag=heroicons-field
php artisan vendor:publish --tag=heroicons-field
php artisan vendor:publish --tag=heroicons-field
php artisan vendor:publish --tag=heroicons-field
return [
'style' => env('HEROICONS_STYLE', 'solid'),
];
/*
* Possible values:
* 's', 'solid' - Solid 24x24, Solid fill
* 'o', 'outline' - Outline 24x24, 1.5px stroke
* 'm', 'mini' - Mini 20x20, Solid fill
* 'c', 'micro' - Micro 16x16, Solid fill
*/
return [
'style' => env('HEROICONS_STYLE', 'solid'),
];
/*
* Possible values:
* 's', 'solid' - Solid 24x24, Solid fill
* 'o', 'outline' - Outline 24x24, 1.5px stroke
* 'm', 'mini' - Mini 20x20, Solid fill
* 'c', 'micro' - Micro 16x16, Solid fill
*/
return [
'style' => env('HEROICONS_STYLE', 'solid'),
];
/*
* Possible values:
* 's', 'solid' - Solid 24x24, Solid fill
* 'o', 'outline' - Outline 24x24, 1.5px stroke
* 'm', 'mini' - Mini 20x20, Solid fill
* 'c', 'micro' - Micro 16x16, Solid fill
*/
return [
'style' => env('HEROICONS_STYLE', 'solid'),
];
/*
* Possible values:
* 's', 'solid' - Solid 24x24, Solid fill
* 'o', 'outline' - Outline 24x24, 1.5px stroke
* 'm', 'mini' - Mini 20x20, Solid fill
* 'c', 'micro' - Micro 16x16, Solid fill
*/
return [
'style' => env('HEROICONS_STYLE', 'solid'),
];
Usage
You can use Icon
field in your resources:
<?php
declare(strict_types=1);
namespace App\MoonShine\Resources;
use Bugo\MoonShine\Heroicons\Fields\Icon;
use MoonShine\Resources\ModelResource;
class CustomResource extends ModelResource
{
public function fields(): array
{
return [
Icon::make('Icon')
->searchable()
->style('mini'),
];
}
}
<?php
declare(strict_types=1);
namespace App\MoonShine\Resources;
use Bugo\MoonShine\Heroicons\Fields\Icon;
use MoonShine\Resources\ModelResource;
/**
* @extends ModelResource<Custom>
*/
class CustomResource extends ModelResource
{
public function fields(): array
{
return [
Icon::make('Icon')
->searchable()
->style('mini'),
];
}
}
<?php
declare(strict_types=1);
namespace App\MoonShine\Resources;
use Bugo\MoonShine\Heroicons\Fields\Icon;
use MoonShine\Resources\ModelResource;
/**
* @extends ModelResource<Custom>
*/
class CustomResource extends ModelResource
{
public function fields(): array
{
return [
Icon::make('Icon')
->searchable()
->style('mini'),
];
}
}
<?php
declare(strict_types=1);
namespace App\MoonShine\Resources;
use Bugo\MoonShine\Heroicons\Fields\Icon;
use MoonShine\Resources\ModelResource;
/**
* @extends ModelResource<Custom>
*/
class CustomResource extends ModelResource
{
public function fields(): array
{
return [
Icon::make('Icon')
->searchable()
->style('mini'),
];
}
}
<?php
declare(strict_types=1);
namespace App\MoonShine\Resources;
use Bugo\MoonShine\Heroicons\Fields\Icon;
use MoonShine\Resources\ModelResource;
/**
* @extends ModelResource<Custom>
*/
class CustomResource extends ModelResource
{
public function fields(): array
{
return [
Icon::make('Icon')
->searchable()
->style('mini'),
];
}
}
All use cases of Blade Heroicons are also available for you.
Caching
When using icons in Blade templates, be sure to enable Caching.
Contributing
Pull requests are welcome. For major changes, please open an issue first
to discuss what you would like to change.
Please make sure to update tests as appropriate.