@props([
    'id' => null,
    'name',
    'value' => 1,
    'checked' => false,
    'label' => null,
    'required' => false,
    'disabled' => false,
    'class' => '',
])

@php
    $finalId = $id ?? $name;
    $isChecked = (bool) old($name, $checked);
@endphp

<div class="flex items-start gap-2">
    <input
        id="{{ $finalId }}"
        name="{{ $name }}"
        type="checkbox"
        value="{{ $value }}"
        @checked($isChecked)
        @required($required)
        @disabled($disabled)
        {{ $attributes->merge([
            'class' => "h-4 w-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500 transition $class"
        ]) }}
    />

    @if($label)
        <label for="{{ $finalId }}" class="text-sm text-gray-700 select-none cursor-pointer">
            {{ $label }}
        </label>
    @endif
</div>

@error($name)
    <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
@enderror