@props([
        'label' , 'name', 'options'
])

<label for="example-text-input" class="col-form-label col-sm">{{$label}}</label> <!-- Adjusted label text -->
<div class="col-sm-4">
    <select id="{{$name}}" name="{{$name}}" class="single-select" style="width: 100%;"> <!-- Set width to 100% -->
        @foreach($options as $option)
            <option value="{{$option->id}}">{{$option->name}}</option>
        @endforeach
    </select>
    @error($name)
    <span class="invalid-feedback" role="alert">
        <strong>{{ $message }}</strong>
    </span>
    @enderror
</div>

<script>
    $(document).ready(function() {
        $('.js-example-basic-single').select2();
    });
</script>