Nova Icon
This package allows you to render a SVG icon as a custom field.
Available Icons | Examples | Roadmap
Installation
composer require scadini/nova-iconUsage
use NovaIcon\Icon;public function fields()
{
return [
ID::make()->sortable(),
Text::make('Name'),
Icon::make('Approved')
->icon('entypo:check'),
];
}
The simplest way to add an icon is by using the icon() method.
This method accepts either a string or a closure containing the vendor name and the icon name separated by a colon:
Icon::make('Approved')->icon('entypo:check'); Icon::make('Approved')->icon(function () {
return 'entypo:check';
});To apply css classes, you can chain the css() method. This method accepts a string, an array, or a closure:
Icon::make('Approved')->icon('entypo:check')->css('text-info h-12 w-12');
Icon::make('Approved')->icon('entypo:check')->css(['text-info', 'h-12', 'w-12']);
Icon::make('Approved')
->icon('entypo:check')
->css(function () {
return 'text-info h-12 w-12'; // or ['text-info', 'h-12', 'w-12']
}
);To hide an icon for a specific row, you can use the hide() method. This method accepts a closure:
Icon::make('Approved')
->icon('entypo:check')
->hide(function () {
return $this->role === 'admin';
});Example
Here's an example about using this component. Let's say a user has a preferred internet platform:
Icon::make('Platform')
->icon(function () {
return 'entypo:' . $this->platform;
})
->css(function () {
$options = [
'youtube' => 'text-danger',
'vimeo' => 'text-success'
];
return $options[$this->platform];
})
Available Icons
The icons available are organized by their vendor name.
Currently, the only vendor available is Entypo, but there are plans to include Zondicons library.
For the icon names you can use this reference table
Roadmap
- Add all icons from Entypo
- Add all icons from Zondicons
- Make icons clickable to perform actions or view resources
