When I using @if within <x-slot name="body"> return TypeError: Illuminate\View\Compilers\ComponentTagCompiler::compile()

[mccarlosen]

• Laravel Version: 9.52.4
• PHP Version: 8.1.12
• Splade JS Version (npm): 1.3.1
• Splade PHP Version (composer): 1.3.1
• Dev environment (OS, Sail/Valet/etc): Linux Mint/Homestead

Description:

I'm using the <x-splade-table /> component and customizing the head and body. But I have found a problem when I use conditional @if.

Steps To Reproduce Issue:

No error:

<x-slot name="body">
  <tbody class="text-xs">
    @foreach($posts->resource as $post)
    <tr>
      <td class="pb-2 align-middle border-b pt-0 sm:border-x-0 lg:py-3 lg:px-3 lg:table-cell lg:static">
          <Link href="#">
              <div class="flex">
                  <div class="text-color1-500 text-center py-1 px-2 border border-color1-500 rounded-lg transition duration-150 ease-in-out hover:text-white hover:bg-color1-500">
                      Pay
                  </div>
              </div>
          </Link>
      </td>
      <td class="pb-2 align-middle border-b pt-0 sm:border-x-0 lg:py-3 lg:px-3 lg:table-cell lg:static">
          {{ $post->created_at }}
      </td>
      <!-- .... -->
    </tr>
    @endforeach
  </tbody>
</x-slot>

Error:

<x-slot name="body">
  <tbody class="text-xs">
    @foreach($posts->resource as $post)
    <tr>
      <td class="pb-2 align-middle border-b pt-0 sm:border-x-0 lg:py-3 lg:px-3 lg:table-cell lg:static">
          @if ($post->status == 'Pending')
          <Link href="#">
              <div class="flex">
                  <div class="text-color1-500 text-center py-1 px-2 border border-color1-500 rounded-lg transition duration-150 ease-in-out hover:text-white hover:bg-color1-500">
                      Pay
                  </div>
              </div>
          </Link>
          @else
          <!-- ... -->
          @endif
      </td>
      <td class="pb-2 align-middle border-b pt-0 sm:border-x-0 lg:py-3 lg:px-3 lg:table-cell lg:static">
          {{ $post->created_at }}
      </td>
      <!-- .... -->
    </tr>
    @endforeach
  </tbody>
</x-slot>