🔪 Blade AliasComponent not working as intended

[tnylea]

Howdy friends 👋

I have a Blade-related question/issue that I was hoping someone could help me with 🙏

Note

Scroll down to view a short 30-second video demonstrating the issue.

ℹ️ Here's what I am doing

I am using Blade::component inside of my AppServiceProvider to create shorter names for my Blade components, like so

Blade::component('filament::components.badge', 'badge');
Blade::component('ui.button', 'button');
Blade::component('filament::components.icon', 'icon');
Blade::component('filament::components.icon-button', 'icon-button');
Blade::component('filament::components.link', 'link');
Blade::component('filament::components.modal.index', 'modal');
Blade::component('filament::components.tabs.index', 'tabs');
Blade::component('filament::components.tabs.item', 'tabs.item');

However, I've also noticed that Blade offers an aliasComponent method, which appears to be more suitable for my needs. Unfortunately, when I use this method:

Blade::aliasComponent('ui.button', 'button');

and try to render the <x-button> blade component. I receive the following error ⚠️ Unable to locate a class or view for component [button].

🎬 Short Video

Here is a quick 30 second video of the issue within a blank Laravel application:

alias-component-not-working-as-expected.mp4

As you can see, the Blade::component method functions correctly; however, the Blade::aliasComponent is not working as I would have expected.

🙋‍♂️ The Question

Does it look like there is an error with the aliasComponent method, or am I not using it as intended? 🤷‍♂️

Really appreciate you guys! Look forward to hearing back soon.

Thanks a ton!

[ahinkle]

The aliasComponent is structured to function similarly to directives. Implementing the @ symbol to indicate a directive, as opposed to a component, should resolve your issue:

framework/src/Illuminate/View/Compilers/BladeCompiler.php

Lines 896 to 905 in c4e8cf5

	$this->directive($alias, function ($expression) use ($path) {
	return $expression
	? "<?php \$__env->startComponent('{$path}', {$expression}); ?>"
	: "<?php \$__env->startComponent('{$path}'); ?>";
	});
	$this->directive('end'.$alias, function ($expression) {
	return '<?php echo $__env->renderComponent(); ?>';
	});
	}

Before

<x-button type="danger" />

After

@button(['type' = 'danger'])

// or

@button
     .... content
@endbutton