@aware property values lost when rendering a named slot with `{{ $slotName }}`

Laravel Version

12.32.5

PHP Version

8.2.29

Database Driver & Version

No response

Description

When analyzing the behavior of the Blade components, the following sequence can be observed:

• In x-slot:search, the is-grouped property is defined, and its value is true.
• In x-form.field, the value of isGrouped is also true, as defined in the component’s @props.
• However, in x-form.input, the value of isGrouped becomes false (the default).

This indicates that the property value is lost during the rendering of the slot inside the x-table component.

The reason lies in how Blade handles named slots. When the search slot is rendered using {{ $search }} within x-table, Blade re-renders the slot content as a new, isolated instance, without preserving the parent component’s context or properties (x-form.field).

As a result:

• The x-slot:search keeps is-grouped=true.
• The x-form.field also sees isGrouped=true while it renders.
• But when {{ $search }} is used, the slot content is rendered outside the x-field scope, so inner components like x-form.input and x-form.button do not receive the @aware values.

In contrast, inside x-form.field, when {{ $slot }} is used, Blade maintains the component scope, and the aware variables remain accessible — which explains why x-input correctly recognizes the isGrouped value in that case.

In summary:

The value of the isGrouped (or hasAddons) property is lost when the slot content is rendered outside the scope of the component that defines it, such as when using {{ $search }}. This happens because Blade recompiles the slot content in isolation, without preserving variables and properties propagated through @aware.

Steps To Reproduce

{{-- component: field --}}
@props([
    'hasAddons' => false,
    'isGrouped' => false,
])

<fieldset @class([
    'field',
    'has-addons' => $hasAddons,
    'is-grouped' => $isGrouped,
])>
    {{ $slot }}
</fieldset>

{{-- component: input --}}
@aware([
    'hasAddons' => false,
    'isGrouped' => false,
])

@props([
   // ...
])

@if ($hasAddons || $isGrouped)
    <input {{ $attributes }} />
@else
    <fieldset class="field">
        <input {{ $attributes }} />
    </fieldset>
@endif

{{-- component: table --}}
<div>
    @isset($search)
        <x-form>
            <x-form.field :is-grouped="$search->attributes->has('is-grouped')">
                {{ $search }}
            </x-form.field>
        </x-form>
    @endisset

    <table>
        {{ $slot }}
    </table>
</div>

{{-- view: home --}}
@section('main')
    <x-table>
        <x-slot:search is-grouped>
            <x-form.input placeholder="Título" name="title" is-size="normal" is-expanded />
            <x-form.button icon="search" is-size="normal" />
        </x-slot>
        @forelse ($posts as $post)
            <tr> ... </tr>
        @empty
            <tr> is empty </tr>
        @endforelse
    </x-table>
@endsection

Sources:

• button
• input
• field
• table
• home