46 lines
2.2 KiB
PHP
46 lines
2.2 KiB
PHP
@props(['label', 'name','id', 'type'=>'text', 'value'=>'', 'placeholder'=>''])
|
|
|
|
@php
|
|
$hasError = $errors->has($name);
|
|
@endphp
|
|
|
|
<div {{ $attributes }}>
|
|
@if(isset($label) && is_object($label))
|
|
<label for="{{ $id ?? $name }}" {{ $label->attributes->merge(['class' => 'block text-sm/6 font-medium text-gray-900 dark:text-white']) }}>
|
|
{{ $label }}
|
|
</label>
|
|
@else
|
|
<label for="{{ $id ?? $name }}" class="block text-sm/6 font-medium text-gray-900 dark:text-white">
|
|
{{ $label }}
|
|
</label>
|
|
@endif
|
|
|
|
<div class="mt-2 grid grid-cols-1">
|
|
<input
|
|
id="{{ $id ?? $name }}"
|
|
type="{{ $type }}"
|
|
name="{{ $name }}"
|
|
value="{{ old($name, $value) }}"
|
|
placeholder="{{ $placeholder }}"
|
|
@if($hasError) aria-invalid="true" aria-describedby="{{ $id ?? $name }}-error" @endif
|
|
@class([
|
|
'block w-full rounded-md bg-white py-1.5 outline-1 -outline-offset-1 focus:outline-2 focus:-outline-offset-2 sm:text-sm/6 dark:bg-white/5',
|
|
'col-start-1 row-start-1 pr-10 pl-3 text-red-900 outline-red-300 placeholder:text-red-300 focus:outline-red-600 sm:pr-9 dark:text-red-400 dark:outline-red-500/50 dark:placeholder:text-red-400/70 dark:focus:outline-red-400' => $hasError,
|
|
'px-3 text-base text-gray-900 outline-gray-300 placeholder:text-gray-400 focus:outline-indigo-600 dark:text-white dark:outline-white/10 dark:placeholder:text-gray-500 dark:focus:outline-indigo-500' => !$hasError,
|
|
])
|
|
/>
|
|
|
|
@if($hasError)
|
|
<svg viewBox="0 0 16 16" fill="currentColor" data-slot="icon" aria-hidden="true"
|
|
class="pointer-events-none col-start-1 row-start-1 mr-3 size-5 self-center justify-self-end text-red-500 sm:size-4 dark:text-red-400">
|
|
<path d="M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14ZM8 4a.75.75 0 0 1 .75.75v3a.75.75 0 0 1-1.5 0v-3A.75.75 0 0 1 8 4Zm0 8a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"
|
|
clip-rule="evenodd" fill-rule="evenodd"/>
|
|
</svg>
|
|
@endif
|
|
</div>
|
|
|
|
@error($name)
|
|
<p id="{{ $id ?? $name }}-error" class="mt-2 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
|
|
@enderror
|
|
</div>
|