laravel-vuexy-admin/resources/views/components/form/checkbox.blade.php

@props([
    // Identificador único
    'uid' => uniqid(),

    // Modelo de Livewire (si aplica)
    'model' => '',

    // Etiqueta y clases de la etiqueta
    'label' => '',
    'labelClass' => '',

    // Clases generales
    'align' => 'start',
    'size' => 'md', // Tamaño del checkbox/switch: sm, md, lg
    'mb0' => false, // Remover margen inferior
    'parentClass' => '',

    // Estilos del checkbox
    'switch' => false, // Cambiar a modo switch
    'switchType' => 'default', // 'default' o 'square'
    'color' => 'primary', // Bootstrap color: primary, secondary, success, danger, etc.
    'withIcon' => false, // Si el switch usa íconos en On/Off

    // Diseño de disposición
    'inline' => false, // Modo inline en lugar de bloque

    // Texto de ayuda
    'helperText' => '',

    // Atributos adicionales
    'attributes' => new \Illuminate\View\ComponentAttributeBag([]),
])

@php
    // **Configuración de valores base**
    $livewireModel = $attributes->get('wire:model', $model);
    $name = $attributes->get('name', $livewireModel);
    $inputId = $attributes->get('id', $name . '_' . $uid);
    $checked = $attributes->get('checked', false);
    $disabled = $attributes->get('disabled', false);

    // **Manejo de errores**
    $errorKey = $livewireModel ?: $name;
    $hasError = $errors->has($errorKey);
    $errorClass = $hasError ? 'is-invalid' : '';

    // **Clases dinámicas**
    $alignClass = match ($align) {
        'center' => 'text-center',
        'end' => 'text-end',
        default => '',
    };

    $sizeClass = match ($size) {
        'sm' => 'switch-sm',
        'lg' => 'switch-lg',
        default => '',
    };

    $switchTypeClass = $switchType === 'square' ? 'switch-square' : '';
    $switchColorClass = "switch-{$color}";
    $checkColorClass  = "form-check-{$color}";

    // **Fusionar atributos con clases dinámicas**
    $checkboxAttributes = $attributes->merge([
        'id' => $inputId,
        'name' => $name,
        'type' => 'checkbox',
    ]);

    // **Detectar si se usa input-group**
    $requiresInputGroup = $attributes->get('inline');
@endphp

@if ($switch)
    {{-- ============================ MODO SWITCH ============================ --}}
    <div class="{{ $alignClass }} {{ $inline ? 'd-inline-block' : '' }} {{ $parentClass }} {{ $mb0 ? '' : 'mb-2' }}">
        <label class="switch {{ $switchTypeClass }} {{ $switchColorClass }} {{ $sizeClass }} {{ $labelClass }}">
            <input
                {{ $livewireModel ? "wire:model=$livewireModel" : '' }}
                {{ $disabled ? 'disabled' : '' }}
                {{ $checked ? 'checked' : '' }}
                {!! $checkboxAttributes->class("switch-input $errorClass")->toHtml() !!}
            />
            {{-- El Switch Slider --}}
            <span class="switch-toggle-slider">
                @if ($withIcon)
                    <span class="switch-on">
                        <i class="ti ti-check"></i>
                    </span>
                    <span class="switch-off">
                        <i class="ti ti-x"></i>
                    </span>
                @endif
            </span>
            {{-- Etiqueta textual a la derecha del switch --}}
            <span class="switch-label">
                {{ $label }}
            </span>
        </label>

        {{-- Texto de ayuda y error --}}
        @isset($helperText)
            <div class="form-text">{{ $helperText }}</div>
        @endisset
        @if ($hasError)
            <span class="text-danger">{{ $errors->first($errorKey) }}</span>
        @endif
    </div>

@else
    {{-- ============================ MODO CHECKBOX ============================ --}}
    <div class="form-check {{ $checkColorClass }} {{ $alignClass }} {{ $sizeClass }} {{ $inline ? 'form-check-inline' : '' }} {{ $parentClass }} {{ $mb0 ? '' : 'mb-4' }}">
        <input
            {{ $livewireModel ? "wire:model=$livewireModel" : '' }}
            {{ $disabled ? 'disabled' : '' }}
            {{ $checked ? 'checked' : '' }}
            {!! $checkboxAttributes->class("form-check-input $errorClass")->toHtml() !!}
        >

        <label for="{{ $inputId }}" class="form-check-label {{ $labelClass }}">
            {{ $label }}
        </label>

        {{-- Texto de ayuda y error --}}
        @isset($helperText)
            <div class="form-text">{{ $helperText }}</div>
        @endisset
        @if ($hasError)
            <span class="text-danger">{{ $errors->first($errorKey) }}</span>
        @endif
    </div>
@endif