Photo by Harpal Singh on Unsplash
I'm happy to say that Blade Icons is finally hitting its first major stable version. After releasing the new iteration of Blade Icons last year development continued to work towards a stable major release. In the past few months a lot of works has gone into bringing new features and ensure API stability. Blade Icons has now hit a point where it's mature and stable enough to bring a proper 1.0.0 release. Subsequently, new versions for Blade Heroicons & Blade Zondicons were released as well.
In this blog post we'll go over the new features that were added in.
Caching
The biggest hurdle so far when working with Blade Icons was that when you tried loading in large icon sets or several sets at once, that it introduced a pretty large performance hit when using Blade components. This has now been resolved with the new caching command.
You can now run php artisan icons:cache
to cache icons. Similar, you can run `php artisan icons:clear to clear the cache again.
Alternatively, you may now also choose to disable Blade components entirely.
More info can be found in the docs as well as in the pull request.
Default Icon Component
The new release adds a much requested default icon component. This gives you a different syntax other than named icon components.
<x-icon name="cloud" class="w-6 h-6" />
More info can be found in the docs as well as in the pull request.
Filesystem Disks
Blade Icons can now load icons from different filesystem disks through a new disk
config setting for an icon set. This gives you more flexibility where you can store your icons.
<?php
return [
'sets' => [
'default' => [
'path' => '/',
'disk' => 's3-icons',
],
],
];
More info can be found in the docs as well as in the pull request.
Fallback icons
With the addition of fallback icons, you can now define to which icon Blade Icons needs to fall back to when an icon for a specific set cannot be found.
<?php
return [
'sets' => [
'default' => [
'fallback' => 'cake',
],
],
];
You can also define a global fallback icon which will apply for all sets:
<?php
return [
'default' => 'heroicon-cake',
];
Note that fallback icons will not work with named Blade Icon components.
More info can be found in the docs as well as in the pull request.
Multiple Icon Paths
Icon sets can now have multiple paths where they store icons. This is useful if you want to organise your icons in a particularly way.
<?php
return [
'sets' => [
'default' => [
'paths' => [
'resources/images/icon-set',
'resources/images/other-icon-set',
],
],
],
];
More info can be found in the docs as well as in the pull request.
Default attributes
You can also optionally define some attributes which will be added to every icon. This is both available on a global config level or per icon set.
<?php
return [
'attributes' => [
'width' => 50,
'height' => 50,
],
];
More info can be found in the docs as well as in the pull request.
Conclusion
I think this new Blade Icons release is a major step forward for the package and will make it that much easier for you to handle SVG icons in your Laravel application. If you upgrade, make sure to read the changelog and the upgrade guide.
Thanks for making use of the package and let me know on Twitter what you think of the new release!
joedixon, iamriajul, assadikimaryem, jedgueruela, ikramsyakir, abeltiezazu liked this article