@props([
    'label' => null,
    'id',
    'name',
    'value' => 1,
    'checked' => false,
    'labelOn' => __('Active'),
    'labelOff' => __('Inactive'),
    'isSingleInput' => false,
])

<div class="form-group" {{ $attributes }}>
    @if ($label)
        <label class="form-label" for="{{ $id }}">{!! $label !!}</label>
    @endif
    <div class="custom-control custom-switch">
        {!! Form::checkbox($name, $value, $checked, [
            'id' => $id,
            'data-label-on' => $labelOn,
            'data-label-off' => $labelOff,
            'class' => 'custom-control-input ' . $attributes['class'],
            'attributes' => $attributes->except('class'),
        ]) !!}
        <label class="custom-control-label" for="{{ $id }}">{{ $value ? $labelOn : $labelOff }}</label>
    </div>
    @error($name)
    <div class="invalid-feedback">{{ $message }}</div>
    @enderror
</div>

@once
    @push('scripts')
        <script>
            var updateFormSwitchLabel = function ($el) {
                var text = $el.is(':checked') ? $el.data('label-on') : $el.data('label-off');
                $el.parent().find('.custom-control-label').text(text)
            }

            $(function () {
                $('.custom-control.custom-switch').each(function (index, el) {
                    updateFormSwitchLabel($(this).find('input'));
                });

                $('.custom-control.custom-switch input').on('change', function () {
                    updateFormSwitchLabel($(this));
                });
            });
        </script>
    @endpush
@endonce