first commit

resources/views/components/multiselect.blade.php

@@ -0,0 +1,40 @@
+@props([
+    'options' => [],
+    'selected' => [],
+    'name' => 'multiselect',
+    'id' => 'multiselect-' . Str::random(5),
+    'wireModel' => null // Nuevo prop para el modelo Livewire
+])
+
+<div 
+    x-data="{ 
+        open: false, 
+        selected: @if($wireModel) @entangle($wireModel) @else {{ json_encode($selected) }} @endif 
+    }" 
+    class="relative"
+    <div 
+        @click="open = !open" 
+        class="cursor-pointer p-2 border rounded-lg flex items-center justify-between"
+    >
+        <span x-text="selected.length ? selected.join(', ') : 'Seleccione opciones'"></span>
+        <x-icons icon="chevron-down" class="w-4 h-4 ml-2" />
+    </div>
+    
+    <div 
+        x-show="open" 
+        @click.away="open = false" 
+        class="absolute z-50 w-full mt-1 bg-white border rounded-lg shadow-lg max-h-60 overflow-auto"
+    >
+        <template x-for="(option, index) in {{ json_encode($options) }}">
+            <label class="flex items-center px-4 py-2 hover:bg-gray-100">
+                <input 
+                    type="checkbox" 
+                    x-model="selected" 
+                    :value="option.value" 
+                    class="rounded border-gray-300 text-blue-600 shadow-sm focus:ring-blue-500"
+                >
+                <span x-text="option.label" class="ml-2"></span>
+            </label>
+        </template>
+    </div>
+</div>