x-slot:{name} is not properly formatted

[Rizky92]

Context (Environment)

There is a new method sometime between laravel 8 and 9 that allow x-slot to suffix with parameter name using colon like <x-slot:head>. Because the formatter couldn't figure out which closing tag it belongs, the formatter does not handle the closing tag properly, thus resulting in something like this:

Current Behavior

see image above

Expected Behavior

Steps to Reproduce

1. Create a blade component contains a property.
2. Call blade component and its property in a view. The property should be called like x-slot:property.
3. Run formatter, notice the closing is aligned with children content

[shufo]

Thanks @Rizky92

This seems to be because the closing tag does not have the same name so HTML Formatter used in blade-formatter is unable to find a matching tag.

To avoid this, Make sure to match the names of the starting and closing tags

e.g. https://github.com/laravel/framework/pull/42574#:~:text=%3Cx%2Dmy%2Dlayout%3E%0A%20%20%20%20%3Cx%2Dslot%3Amy%2Dslot%3E%0A%20%20%20%20%20%20%20%20%3Cdiv%3EMy%20super%20cool%20content%3C/div%3E%0A%20%20%20%20%3C/x%2Dslot%3Amy%2Dslot%3E%0A%3C/x%2Dmy%2Dlayout%3E

<x-my-layout>
    <x-slot:my-slot>
        <div>My super cool content</div>
    </x-slot:my-slot>
</x-my-layout>

The name of the closing tag itself seems to be arbitrary as long as there is a prefix of x-slot, so x-slot or colon prefixed x-slot:~ is fine.

[github-actions[bot]]

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 5 days