Unable to locate a class or view for component [tabler-mail].

[simplexx]

Not sure if it's me, but my tabler icons throw an error after migrating from the ryangjchandler/blade-tabler-icons lib.
The error is:
InvalidArgumentException
PHP 8.2.13
Laravel 10.48.27
Unable to locate a class or view for component [tabler-mail].

The icon is added like this in the blade file:

<tabler-plus class="size-4" />

For the migration, I just removed the other lib and added this one using composer require.

After removing this lib and installing the other again, everything started working fine again.

[secondnetwork]

The error occurs because the x- prefix is missing before the component name when using Tabler icons in Laravel. In Laravel, custom Blade components that are defined in a specific namespace often need to be used with such a prefix.

To fix the error, you should change the line in your Blade file to:

<x-tabler-mail class="size-4" />

Adding the x- prefix should ensure that Laravel correctly recognizes the component, and the InvalidArgumentException error will no longer occur. Make sure to do this for any other Tabler icons you are using as well.

Additionally, you can also utilize the @svg directive when working with Blade Kit icons. This directive allows you to directly insert SVGs into your Blade templates, providing you with more flexibility when using icons.

Here’s an example of how to use the @svg directive:

@svg('tabler-mail', ['class' => 'size-4'])

In this example, the SVG icon tabler-mail is included with the class size-4. This is a useful alternative if you want to insert SVGs directly without using a Blade component.

I also tested this with Laravel version 9

[simplexx]

My bad, the code above was copied after I payed around for an hour or so trying to make it somehow work (with no luck).
All my icons in the project are actually added starting with <x-... For example:

I just tried to install the lib again, here are the exact steps I took:

initial situation
Everything is working as expected. The installed icon lib is ryangjchandler/blade-tabler-icons

Steps:

1. Uninstalling ryangjchandler/blade-tabler-icons -> Using: composer remove ryangjchandler/blade-tabler-icons
   Outcome: No issues, worked

2. Installing this lib -> Using: composer require secondnetwork/blade-tabler-icons
   Outcome: No issues, worked

3. Trying to load the "Home" dashboard page, which contains tabler icons added like this:
   Outcome: Error message as described in the initial post: Unable to locate a class or view for component [tabler-plus].

4. For testing purposes, I replaced all icons on this page so they use the svg directive.
   Outcome: Icons work, no error

[simplexx]

I did some digging into the code and found the problem and how to fix it:

Why is there an issue?
different prefix is used during register (tabler vs. tabler-icons)

Code that causes the issue:

    public function register(): void
    {
        $this->registerConfig();

        $this->callAfterResolving(Factory::class, function (Factory $factory, Container $container) {
            $config = $container->make('config')->get('blade-tabler-icons', []);

            $factory->add('tabler-icons', array_merge(['path' => __DIR__.'/../resources/svg'], $config));
        });
    }

Code that fixes the issue:

    public function register(): void
    {
        $this->registerConfig();
    
        $this->callAfterResolving(Factory::class, function (Factory $factory, Container $container) {
            $config = $container->make('config')->get('blade-tabler-icons', []);
            
            // Change 'tabler-icons' to 'tabler' to match the prefix of the ryangjchandler/blade-tabler-icons lib
            $factory->add('tabler', array_merge(['path' => __DIR__.'/../resources/svg'], $config));
        });
    }

Would be nice if you could merge this fix so I can use the new lib in composer.

[secondnetwork]

Hello simplexx,

Thank you for your detailed explanation of the issue and the solution you discovered. I'm glad to inform you that your proposed changes have been implemented.

The adjustment from 'tabler-icons' to 'tabler' has been made to ensure compatibility with the ryangjchandler/blade-tabler-icons library. This should resolve the issues you were experiencing.

[simplexx]

Awesome, thanks 👍