@php
    $keywords = $field['keywords'];
    // $selectedServices = [];
    // if (!empty($services)) {
    //     $selectedServices = json_decode($services, true) ?? [];
    // }

    // $defaultOptions = [
    //     'Flu vaccinations',
    //     'COVID vaccinations',
    //     'Blood pressure checks',
    //     'Medicine blister packs',
    //     'Smoking cessation',
    //     'Weight management',
    //     'Travel health advice',
    //     'Passport photos',
    //     'Vaccinations',
    //     'Health checks',
    //     'Blister packs',
    //     'Delivery services',
    //     'blood pressure monitors',
    // ];

    // $allOptions = array_unique(array_merge($defaultOptions, $selectedServices));

@endphp

<div class="form-group col-md-12">
    <div id="services-wrapper" class="card">
        <div class="card-header ">
            <label class="fw-bold mb-2">{{ $field['label'] ?? 'Verify Keywords' }}</label>
        </div>
        <div class="card-body">
            <input id="keywords" value="{{ $keywords }}" autocomplete="off" name="keywords" placeholder="Verify Keywords">

            </select>
        </div>
    </div>
</div>

@push('after_scripts')
<script>
document.addEventListener('DOMContentLoaded', function () {
    new TomSelect("#keywords",{
        create: true,
        sortField: {
            field: "text",
            direction: "asc"
        }
    });
});
</script>
@endpush