134 lines
4.4 KiB
PHP
134 lines
4.4 KiB
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
|