Larastrap provides many "container" components: those having a child HTML block to be wrapped within the container itself. All of them share a few parameters.
obj is used in particular for x-larastrap::form , but can be used in any Container to define a source for values in child nodes.
@php
$obj = (object) ['name' => 'Foo', 'bio' => 'A very smart guy!', 'email' => 'foo@bar.baz'];
@endphp
<x-larastrap::accordion :obj="$obj">
<x-larastrap::accordionitem label="Contacts">
<x-larastrap::text name="name" readonly squeeze />
<x-larastrap::text name="email" readonly squeeze />
</x-larastrap::accordionitem>
<x-larastrap::accordionitem label="Bio">
<x-larastrap::text name="bio" readonly squeeze />
</x-larastrap::accordionitem>
</x-larastrap::accordion>
<div class="accordion" id="accordion-6a445adc06a2c3828dd83b65449437e6">
<div class="accordion-item">
<h2 class="accordion-header" id="head-accordionitem-88e1e0b91692bc7ea5649af4f3b8cfa5">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#accordionitem-88e1e0b91692bc7ea5649af4f3b8cfa5" aria-expanded="false" aria-controls="accordionitem-88e1e0b91692bc7ea5649af4f3b8cfa5">Contacts</button>
</h2>
<div id="accordionitem-88e1e0b91692bc7ea5649af4f3b8cfa5" class="accordion-collapse collapse" aria-labelledby="head-accordionitem-88e1e0b91692bc7ea5649af4f3b8cfa5" data-bs-parent="#accordion-6a445adc06a2c3828dd83b65449437e6">
<div class="accordion-body">
<input id="input-79710f8451566c9b39eca6f5c562d024" type="text" class="form-control-plaintext" name="name" value="Foo" readonly> <input id="input-a98fd74b49307943abeb1d2521cb06d0" type="text" class="form-control-plaintext" name="email" value="foo@bar.baz" readonly>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="head-accordionitem-6c9ea7e06dc06f3caeac55b62c72d8e7">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#accordionitem-6c9ea7e06dc06f3caeac55b62c72d8e7" aria-expanded="false" aria-controls="accordionitem-6c9ea7e06dc06f3caeac55b62c72d8e7">Bio</button>
</h2>
<div id="accordionitem-6c9ea7e06dc06f3caeac55b62c72d8e7" class="accordion-collapse collapse" aria-labelledby="head-accordionitem-6c9ea7e06dc06f3caeac55b62c72d8e7" data-bs-parent="#accordion-6a445adc06a2c3828dd83b65449437e6">
<div class="accordion-body">
<input id="input-74b6812ab62770769c039e35540fc56c" type="text" class="form-control-plaintext" name="bio" value="A very smart guy!" readonly>
</div>
</div>
</div>
</div>