Fix: Actualizar sintaxis de componentes Nuxt UI v4 y corregir errores de TypeScript

- Actualizar UModal para usar v-model:open en lugar de v-model
- Envolver contenido de UModal en slot #content según nueva sintaxis
- Corregir tipos en CameraCapture: agregar verificación de objeto antes de spread
- Cambiar tipo de retorno de getAppIconUrl de null a undefined
- Comentar capture_links en manifest PWA (propiedad experimental no soportada en tipos)
- Resolver todos los errores de TypeScript y warnings de hidratación

Errores corregidos:
- TS2353: width no existe en tipo ui de UModal
- TS2698: Spread types solo de tipos objeto
- TS18048: camera posiblemente undefined
- TS2322: null no asignable a undefined
- TS2353: capture_links no existe en ManifestOptions

nuxt4/app/components/CameraCapture.vue

@@ -212,12 +212,14 @@ const startCamera = async () => {
 
   // Si tenemos un deviceId específico, úsalo
   if (cameras.value.length > 0 && cameras.value[currentCameraIndex.value]) {
-    const camera = cameras.value[currentCameraIndex.value]
+    const camera = cameras.value[currentCameraIndex.value]!
+    if (typeof constraints.video === 'object' && constraints.video !== null) {
       constraints.video = {
         ...constraints.video,
         deviceId: { exact: camera.deviceId }
       } as MediaTrackConstraints
     }
+  }
 
   try {
     stream.value = await getUserMedia(constraints)

nuxt4/app/components/UserProfileForm.vue

@@ -287,8 +287,9 @@
     </form>
 
     <!-- Modal de cámara -->
-    <UModal v-model="showCamera" :ui="{ width: 'max-w-3xl' }">
+    <UModal v-model:open="showCamera">
-      <div class="camera-modal">
+      <template #content>
+        <div class="camera-modal max-w-3xl mx-auto">
           <div class="modal-header">
             <h3 class="modal-title">
               <UIcon name="i-heroicons-camera" class="w-6 h-6" />
@@ -303,6 +304,7 @@
             />
           </div>
         </div>
+      </template>
     </UModal>
   </div>
 </template>

nuxt4/app/components/auth/ApplicationsList.vue

@@ -180,10 +180,10 @@ const searchQuery = ref<string>(searchCookie.value || '')
 const failedIcons = ref<Set<string>>(new Set())
 
 // Función para obtener la URL del icono de una app
-const getAppIconUrl = (app: Application): string | null => {
+const getAppIconUrl = (app: Application): string | undefined => {
   // Si el icono ya falló, no intentar de nuevo
   if (failedIcons.value.has(app.pk)) {
-    return null
+    return undefined
   }
 
   // Intentar primero ícono local basado en slug
@@ -204,7 +204,7 @@ const getAppIconUrl = (app: Application): string | null => {
       const url = new URL(app.launchUrl)
       return `${url.origin}${app.icon.startsWith('/') ? '' : '/'}${app.icon}`
     } catch {
-      return null
+      return undefined
     }
   }
 
@@ -214,7 +214,7 @@ const getAppIconUrl = (app: Application): string | null => {
     // Intentar primero apple-touch-icon (suele ser de mejor calidad)
     return `${url.origin}/apple-touch-icon.png`
   } catch {
-    return null
+    return undefined
   }
 }
 

nuxt4/nuxt.config.ts

@@ -47,7 +47,8 @@ export default defineNuxtConfig({
         client_mode: 'navigate-existing'
       },
       // Capturar todos los enlaces que apunten a esta app
-      capture_links: 'existing-client-navigate',
+      // NOTA: capture_links es experimental y no está en los tipos de ManifestOptions
+      // capture_links: 'existing-client-navigate',
       // Extender scope a otros subdominios de Nucleo V3
       scope_extensions: [
         {