All rules

Sheath rule

blade-component-self-closing

Blade components without content should use self-closing syntax.
Package
Core
Category
Blade
Default severity
info by default
Auto-fix
Auto-fix available

#Why

Self-closing syntax makes it immediately clear that the component has no slot content.

#Examples

#Bad

<!-- Components with no content should self-close -->

<x-alert></x-alert>

<x-button type="submit"></x-button>

<x-icon name="home"></x-icon>

<x-forms.input name="email"></x-forms.input>

#Good

<!-- Self-closing components -->

<x-alert />

<x-button type="submit" />

<x-icon name="home" />

<x-forms.input name="email" />



<!-- Components with content should NOT self-close -->

<x-alert>

    Something went wrong!

</x-alert>



<x-button>

    Click me

</x-button>

#What Gets Checked

This requirement applies to both forms:

  • Standard Blade components: <x-component></x-component>
  • Namespaced components: <x-forms.input></x-forms.input>

#Auto-fix

Auto-fix converts empty component pairs to self-closing:

<!-- Before -->

<x-alert></x-alert>



<!-- After -->

<x-alert />

#Notes

  • Only components with no content between tags are flagged
  • Whitespace is Laravel slot content, so whitespace-only components are preserved
  • Components with actual content are not affected

#Related Rules