@props([
'type' => 'text',
'name' => '',
])

@switch($type)
@case('hidden')
@case('text')
@case('email')
@case('password')
@case('number')
<v-field v-slot="{ field, errors }" {{ $attributes->only(['name', ':name', 'value', ':value', 'v-model', 'rules', ':rules', 'label', ':label']) }} name="{{ $name }}">
    <input type="{{ $type }}" name="{{ $name }}" v-bind="field" :class="[errors.length ? 'border !border-red-500 hover:border-red-500' : '']" {{ $attributes->except(['value', ':value', 'v-model', 'rules', ':rules', 'label', ':label'])->merge(['class' => 'mb-1.5 w-full border border-input px-5 py-3 text-base text-title font-normal text-placeholder::placeholder transition-all hover:border-gray-400 focus:border-gray-400 max-sm:px-4 max-md:py-2 max-sm:text-sm']) }}>
</v-field>
@break

@case('file')
<v-field v-slot="{ field, errors }" {{ $attributes->only(['name', ':name', 'value', ':value', 'v-model', 'rules', ':rules', ':rules', 'label', ':label']) }} name="{{ $name }}">
    <input type="{{ $type }}" name="{{ $name }}" :class="[errors.length ? 'border !border-red-500 hover:border-red-500' : '']" {{ $attributes->except(['value', ':value', 'v-model', 'rules', ':rules', 'label', ':label'])->merge(['class' => 'mb-1.5 w-full border border-input px-5 py-3 text-base text-title text-placeholder::placeholder transition-all hover:border-gray-400 focus:border-gray-400 max-sm:px-4 max-md:py-2 max-sm:text-sm']) }}>
</v-field>
@break

@case('color')
<v-field v-slot="{ field, errors }" {{ $attributes->except('class') }} name="{{ $name }}">
    <input type="{{ $type }}" :class="[errors.length ? 'border !border-red-500' : '']" v-bind="field" {{ $attributes->except(['value'])->merge(['class' => 'w-full appearance-none border border-input text-base text-title text-placeholder::placeholder transition-all hover:border-gray-400 ']) }}>
</v-field>
@break

@case('textarea')
<v-field v-slot="{ field, errors }" {{ $attributes->only(['name', ':name', 'value', ':value', 'v-model', 'rules', ':rules', 'label', ':label']) }} name="{{ $name }}">
    <textarea type="{{ $type }}" name="{{ $name }}" v-bind="field" :class="[errors.length ? 'border !border-red-500 hover:border-red-500' : '']" {{ $attributes->except(['value', ':value', 'v-model', 'rules', ':rules', 'label', ':label'])->merge(['class' => 'mb-1.5 w-full border border-input px-5 py-3 text-base text-title font-normal text-placeholder::placeholder transition-all hover:border-gray-400 focus:border-gray-400']) }}>
            </textarea>

    @if ($attributes->get('tinymce', false) || $attributes->get(':tinymce', false))
    <x-yas_member::tinymce :selector="'textarea#' . $attributes->get('id')" :prompt="stripcslashes($attributes->get('prompt', ''))" ::field="field">
    </x-yas_member::tinymce>
    @endif
</v-field>
@break

@case('date')
<v-field v-slot="{ field, errors }" {{ $attributes->only(['name', ':name', 'value', ':value', 'v-model', 'rules', ':rules', 'label', ':label']) }} name="{{ $name }}">
    <x-yas_member::flat-picker.date>
        <input name="{{ $name }}" v-bind="field" :class="[errors.length ? 'border !border-red-500 hover:border-red-500' : '']" {{ $attributes->except(['value', ':value', 'v-model', 'rules', ':rules', 'label', ':label'])->merge(['class' => 'mb-1.5 w-full border border-input px-5 py-3 text-base text-title text-placeholder::placeholder transition-all hover:border-gray-400 focus:border-gray-400 max-sm:px-4 max-md:py-2 max-sm:text-sm']) }} autocomplete="off">
    </x-yas_member::flat-picker.date>
</v-field>
@break

@case('datetime')
<v-field v-slot="{ field, errors }" {{ $attributes->only(['name', ':name', 'value', ':value', 'v-model', 'rules', ':rules', 'label', ':label']) }} name="{{ $name }}">
    <x-yas_member::flat-picker.datetime>
        <input name="{{ $name }}" v-bind="field" :class="[errors.length ? 'border !border-red-500 hover:border-red-500' : '']" {{ $attributes->except(['value', ':value', 'v-model', 'rules', ':rules', 'label', ':label'])->merge(['class' => 'mb-1.5 w-full border border-input px-5 py-3 text-base text-title text-placeholder::placeholder transition-all hover:border-gray-400 focus:border-gray-400 max-sm:px-4 max-md:py-2 max-sm:text-sm']) }} autocomplete="off">
    </x-yas_member::flat-picker.datetime>
</v-field>
@break

@case('select')
<v-field v-slot="{ field, errors }" {{ $attributes->only(['name', ':name', 'value', ':value', 'v-model', 'rules', ':rules', 'label', ':label']) }} name="{{ $name }}">
    <select name="{{ $name }}" v-bind="field" :class="[errors.length ? 'border !border-red-500' : '']" {{ $attributes->except(['value', ':value', 'v-model', 'rules', ':rules', 'label', ':label'])->merge(['class' => 'custom-select mb-1.5 w-full border border-input bg-white px-5 py-3 text-base text-title text-placeholder::placeholder  transition-all hover:border-gray-400 focus-visible:outline-none max-md:py-2 max-sm:px-4 max-sm:text-sm']) }}>
        {{ $slot }}
    </select>
</v-field>
@break

@case('multiselect')
<v-field as="select" v-slot="{ value }" :class="[errors && errors['{{ $name }}'] ? 'border !border-red-500' : '']" {{ $attributes->except([])->merge(['class' => 'mb-1.5 w-full border border-input bg-white px-5 py-3 text-base text-title text-placeholder::placeholder transition-all hover:border-gray-400 focus-visible:outline-none max-md:py-2 max-sm:px-4 max-sm:text-sm']) }} name="{{ $name }}" multiple>
    {{ $slot }}
</v-field>
@break

@case('checkbox')
<v-field type="checkbox" class="hidden" v-slot="{ field }" {{ $attributes->only(['name', ':name', 'value', ':value', 'v-model', 'rules', ':rules', 'label', ':label', 'key', ':key']) }} name="{{ $name }}">
    <input type="checkbox" v-bind="field" class="peer sr-only" {{ $attributes->except(['rules', 'label', ':label', 'key', ':key']) }} name="{{ $name }}" />
</v-field>

<label class="icon-uncheck peer-checked:icon-check-box cursor-pointer text-2xl peer-checked:text-highlight" {{ $attributes->except(['value', ':value', 'v-model', 'rules', ':rules', 'label', ':label', 'key', ':key']) }}>
</label>
@break

@case('radio')
<v-field type="radio" class="hidden" v-slot="{ field }" {{ $attributes->only(['name', ':name', 'value', ':value', 'v-model', 'rules', ':rules', 'label', ':label', 'key', ':key']) }} name="{{ $name }}">
    <input type="radio" name="{{ $name }}" v-bind="field" class="peer sr-only" {{ $attributes->except(['rules', 'label', ':label', 'key', ':key']) }} />
</v-field>

<label class="icon-radio-unselect peer-checked:icon-radio-select cursor-pointer text-2xl peer-checked:text-highlight" {{ $attributes->except(['value', ':value', 'v-model', 'rules', ':rules', 'label', ':label', 'key', ':key']) }}>
</label>
@break

@case('switch')
<label class="relative inline-flex cursor-pointer items-center">
    <v-field type="checkbox" class="hidden" v-slot="{ field }" {{ $attributes->only(['name', ':name', 'value', ':value', 'v-model', 'rules', ':rules', 'label', ':label', 'key', ':key']) }} name="{{ $name }}">
        <input type="checkbox" name="{{ $name }}" id="{{ $name }}" class="peer sr-only" v-bind="field" {{ $attributes->except(['v-model', 'rules', ':rules', 'label', ':label', 'key', ':key']) }} />
    </v-field>

    <label class="peer h-5 w-9 cursor-pointer bg-gray-200 after:absolute after:left-0.5 after:top-0.5 after:h-4 after:w-4 after:border after:border-gray-300 after:bg-white after:transition-all after:content-[''] peer-checked:bg-primarymain peer-checked:after:translate-x-full peer-checked:after:border-white peer-focus:outline-none peer-focus:ring-blue-300" for="{{ $name }}"></label>
</label>
@break

@case('image')
<x-yas_member::media ::class="[errors && errors['{{ $name }}'] ? 'border !border-red-500' : '']" {{ $attributes }} name="{{ $name }}" />
@break

@case('price')
    <v-field
        v-slot="{ field, errors }"
        {{ $attributes->only(['name', ':name', 'value', ':value', 'v-model', 'rules', ':rules', 'label', ':label']) }}
        name="{{ $name }}"
    >
        <div
            class="mb-1.5 w-full border border-input px-5 py-3 text-base text-title font-normal text-placeholder::placeholder transition-all hover:border-gray-400 focus:border-gray-400 max-sm:px-4 max-md:py-2 max-sm:text-sm px-6 py-5 max-md:py-3 max-sm:py-3.5"
            :class="[errors.length ? 'border !border-red-600 hover:border-red-600' : '']"
        >
            @if (isset($currency))
                <span {{ $currency->attributes->merge(['class' => 'py-2.5 text-gray-500 ltr:pl-4 rtl:pr-4']) }}>
                    {{ $currency }}
                </span>
            @else
                <span class="py-2.5 text-gray-500 rtl:pr-4">
                    {{ core()->currencySymbol(core()->getBaseCurrencyCode()) }}
                </span>
            @endif

            <input
                type="text"
                name="{{ $name }}"
                v-bind="field"
                {{ $attributes->except(['value', ':value', 'v-model', 'rules', ':rules', 'label', ':label'])->merge(['class' => '']) }}
            />
        </div>
    </v-field>

    @break


@case('custom')
<v-field {{ $attributes }}>
    {{ $slot }}
</v-field>
@endswitch