@props(['isError' => false, 'isWarning' => false, 'disabled' => false, 'required' => false, 'focusSelected' => true, 'mask' => null])
@php
    $attributes = $attributes->merge(
        ['class' => "block w-full p-2 text-sm appearance-none peer
                     border border-gray-300 rounded-lg
                     focus:outline-none focus:ring-0 focus:border-blue-600 focus:border-2
                     disabled:bg-gray-200 disabled:cursor-text h-form-input"
        ]);

    if ($isError) {
        $attributes = $attributes->merge(['class' => 'border-red-500']);
    } else if($isWarning) {
        $attributes = $attributes->merge(['class' => 'border-yellow-500']);
    }
    $wire_model_attributes = Arr::map(\App\Enums\ELivewireModelType::cases(), fn($case) => $case->attribute())
@endphp
@if ($attributes->get('type') == 'date')
    <input
            x-data="dateField(@entangle($attributes->wire('model')))"
            x-model="value"
            x-ref="input"
            @blur="changeDate($event)"
            x-init="
            new Pikaday({
                field: $refs.input,
                format: 'YYYY-MM-DD',
                toString(date) {
                    const day = ('0' + date.getDate()).slice(-2);
                    const month = ('0' + (date.getMonth() + 1)).slice(-2);
                    const year = date.getFullYear();
                    return `${year}-${month}-${day}`;
                },
                parse(dateString) {
                    const parts = dateString.split('/');
                    const year = parseInt(parts[0], 10);
                    const month = parseInt(parts[1], 10) - 1;
                    const day = parseInt(parts[2], 10);
                    return new Date(year, month, day);
                },
                i18n: {
                    previousMonth: '前月',
                    nextMonth: '次月',
                    months: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
                    weekdays: ['日', '月', '火', '水', '木', '金', '土'],
                    weekdaysShort: ['日', '月', '火', '水', '木', '金', '土']
                },
             })"
            @change="$dispatch('input', $el.value)"
            {{$attributes->except('type')}}
            @required($required)
            @disabled($disabled)
            @if($focusSelected) onfocus="this.select();" @endif
            @if($mask) x-mask="{{$mask}}" @endif
    />
@elseif($attributes->get('type') == 'month')
    <input
            x-data="dateField(@entangle($attributes->wire('model')))"
            x-model="value"
            x-ref="input"
            @keydown.enter="changeDate($event, true)"
            @change="$dispatch('input', $el.value)"
            {{$attributes->except('type')}}
            @required($required)
            @disabled($disabled)
            @if($focusSelected) onfocus="this.select();" @endif
{{--            @if($mask) x-mask="{{$mask}}" @endif--}}
    />
@elseif($attributes->get('type') == 'time')
    <input
            x-data="dateField(@entangle($attributes->wire('model')).live)"
            x-model.lazy="value"
            x-ref="input"
            x-mask="99:99"
            @blur="changeTime($event, true)"
            {{$attributes->except(['type', ...$wire_model_attributes])}}
            @required($required)
            @disabled($disabled)
            @if($focusSelected) onfocus="this.select();" @endif
    />
@else
    <input {{$attributes->merge(['class'=>'h-form-input '])}}"
    @required($required)
    @disabled($disabled)
    @if($focusSelected)
        onfocus="this.select();"
    @endif
    @if($mask)
        x-mask="{{$mask}}"
    @endif
    />
@endif