@props([
    'type' => 'text',
    'name' => null,
    'value' => null,
    'placeholder' => null,
    'required' => false,
    'disabled' => false,
    'size' => 'md', // sm, md, lg
    'error' => null,
])

@php
    $sizeClasses = [
        'sm' => 'px-2.5 py-1.5 text-xs',
        'md' => 'px-3 py-2 text-xs',
        'lg' => 'px-3.5 py-2.5 text-sm',
    ];

    $isDateType = in_array($type, ['date', 'datetime-local', 'time', 'month', 'week']);

    $dateClasses = $isDateType
        ? '[&::-webkit-calendar-picker-indicator]:color-scheme:auto '
        : '';

    $errors = $errors ?? new \Illuminate\Support\ViewErrorBag;
    $hasError = (bool) ($error ?? ($name && $errors->has($name)));
    $borderClasses = $hasError
        ? 'border-rose-500/80 focus:border-rose-500 focus:ring-1 focus:ring-rose-500/40'
        : 'border-slate-700/60 focus:border-indigo-500 focus:ring-1 focus:ring-indigo-500/40';

    $classes = 'w-full bg-white/5 border rounded-lg text-white outline-none placeholder-slate-500 transition-colors disabled:opacity-50 disabled:cursor-not-allowed ' . ($sizeClasses[$size] ?? $sizeClasses['md']) . ' ' . $borderClasses . ' ' . $dateClasses;
@endphp

<input
    type="{{ $type }}"
    @if($name) name="{{ $name }}" @endif
    @if($value !== null) value="{{ $value }}" @endif
    @if($placeholder) placeholder="{{ $placeholder }}" @endif
    @if($required) required @endif
    @if($disabled) disabled @endif
    {{ $attributes->twMerge(['class' => $classes]) }}
/>