Example of Blade components in jcergolj/laravellte

File resources/views/components/profile/element.blade.php (link to Github)
@props(['user', 'livewire'])

<li class="list-group-item" x-data="{ show: false}"  @close.window="show = false" x-cloak>
    <div class="row" x-show="!show" x-transition:enter="fade">
        {{ $element }}

        <div class="col-4 col-md-4">
            <a href="#" class="float-right" x-on:click="show = true">Edit</a>
        </div>
    </div>

    {{ $livewire }}
</li>
File resources/views/profile/users/index.blade.php (link to Github)
//
                    <ul class="list-group list-group-unbordered mb-3">
                        <x-profile.element :user="$user">
                            <x-slot name="element">
                                <div class="col-md-12">
                                    <b>Email</b>
                                </div>
                                <div class="col-8 col-md-8">
                                    {{ $user->email }}
                                </div>
                            </x-slot>

                            <x-slot name="livewire">
                                <livewire:profile.update-email />
                            </x-slot>
                        </x-profile.element>
                        //
                    </ul>
//

Additional resources on blade components: