{{-- Using the @aware directive to get the parent data in the sub-component --}}
@aware(['company'])

{{-- {{ dd($company) }} --}}
<div class="row">

    <h6 class="text-primary">{{ $title }}</h6>

    {{-- Note: If you have any problem understanding the structure, use dd($company) to inspect the array. --}}
    {{-- Note: for all inputs, using dynamic binding for the value --}}

    <div class="col-md-3">
        <x-input-label for="name" :value="__('Name')" />
        <x-text-input name="{{ $name }}" placeholder="Enter Name" :value="old($name, $company[$name] ?? '')" />
    </div>
    <div class="col-md-3">
        <x-input-label for="email" :value="__('Email')" />
        <x-text-input name="{{ $email }}" placeholder="example@gmail.com"
            :value="old($email, $company[$email] ?? '')" />
    </div>
    <div class="col-md-3">
        <x-input-label for="phone" :value="__('Phone')" />
        <x-text-input name="{{ $phone }}" placeholder="Enter Phone Number"
            :value="old($phone, $company[$phone] ?? '')" />
    </div>
    <div class="col-md-12 mt-3">
        <x-input-label for="communication" :value="__('Communication')" />
        <x-text-area name="{{ $communication }}" placeholder="Enter Text Here...."
            :value="old($communication, $company[$communication] ?? '')" />
    </div>
</div>