setting up front 1

resources/views/components/ui/field.blade.php

@@ -0,0 +1,35 @@
+@props([
+    'label'             => null,
+    'labelDescription'  => null,
+    'for'               => null,
+    'description'       => null,
+    'error'             => null,
+    'required'          => false,
+])
+
+<div {{ $attributes->merge(['class' => 'flex flex-col gap-2']) }}>
+
+    @if ($label)
+        <label
+            @if ($for) for="{{ $for }}" @endif
+        >{{ $label }}@if ($required)<span class="ml-1" aria-hidden="true">*</span>@endif @if ($labelDescription) <span class="text-sm text-neutral-500">({{ $labelDescription }})</span> @endif</label>
+    @endif
+
+    {{ $slot }}
+
+    @if ($description && ! $error)
+        <p
+            @if ($for) id="{{ $for }}-description" @endif
+            class="text-sm text-neutral-500"
+        >{{ $description }}</p>
+    @endif
+
+    @if ($error)
+        <p
+            @if ($for) id="{{ $for }}-error" @endif
+            role="alert"
+            class="text-sm text-red-600"
+        >{{ $error }}</p>
+    @endif
+
+</div>