@innertia-solutions/innertia-nuxt 0.1.1

package/error.vue

@@ -0,0 +1,78 @@
+<script setup lang="ts">
+definePageMeta({ layout: false })
+
+const props = defineProps<{
+  error: {
+    statusCode: number
+    statusMessage?: string
+    message?: string
+  }
+}>()
+
+const config = {
+  404: {
+    title: 'Página no encontrada',
+    description: 'La página que buscas no existe o fue movida.',
+    icon: '404',
+  },
+  403: {
+    title: 'Acceso denegado',
+    description: 'No tienes permisos para ver esta página.',
+    icon: '403',
+  },
+  500: {
+    title: 'Error del servidor',
+    description: 'Algo salió mal. Intenta nuevamente en unos momentos.',
+    icon: '500',
+  },
+} as const
+
+type KnownCode = keyof typeof config
+
+const current = computed(() => {
+  const code = props.error.statusCode as KnownCode
+  return config[code] ?? {
+    title: 'Error inesperado',
+    description: props.error.statusMessage || props.error.message || 'Ocurrió un error desconocido.',
+    icon: String(props.error.statusCode),
+  }
+})
+
+function goBack() {
+  if (window.history.length > 1) {
+    window.history.back()
+  } else {
+    navigateTo('/')
+  }
+}
+</script>
+
+<template>
+  <div class="min-h-screen flex items-center justify-center bg-slate-50 dark:bg-slate-900 px-4">
+    <div class="max-w-md w-full text-center space-y-4">
+      <div class="text-7xl font-bold text-slate-200 dark:text-slate-700 select-none">
+        {{ current.icon }}
+      </div>
+      <h1 class="text-2xl font-semibold text-slate-800 dark:text-white">
+        {{ current.title }}
+      </h1>
+      <p class="text-slate-500 dark:text-slate-400">
+        {{ current.description }}
+      </p>
+      <div class="flex items-center justify-center gap-3 pt-2">
+        <button
+          class="px-4 py-2 rounded-lg border border-slate-200 dark:border-slate-700 text-sm text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-800"
+          @click="goBack"
+        >
+          Volver
+        </button>
+        <NuxtLink
+          to="/"
+          class="px-4 py-2 rounded-lg bg-slate-800 dark:bg-slate-700 text-white text-sm hover:bg-slate-700 dark:hover:bg-slate-600"
+        >
+          Ir al inicio
+        </NuxtLink>
+      </div>
+    </div>
+  </div>
+</template>

package/middleware/01.detect-subdomain.global.ts

@@ -0,0 +1,43 @@
+// useTenantStore auto-imported from saas stores.
+// Server-only: lee el hostname de la request para extraer el subdomain del tenant.
+// Solo activo en mode === 'saas'.
+export default defineNuxtRouteMiddleware((to) => {
+  // Modo no-saas → no hay tenant que detectar
+  if (!useInnertiaMode().hasTenant()) return
+
+  // Evitar loop infinito: si ya estamos en la página de error de tenant, no redirigir de nuevo.
+  if (to.path === '/tenant-error') return
+
+  if (!import.meta.server) return
+
+  const config = useRuntimeConfig()
+  const requestUrl = useRequestURL()
+  const hostname = requestUrl.hostname // ej. "acme.app.com" o "localhost"
+
+  const parts = hostname.split('.')
+
+  // Hostname bare (localhost, IP) sin subdominio → usar slug "local" en dev, error en prod
+  const isBareLocalhost = hostname === 'localhost' || /^\d+(\.\d+){3}$/.test(hostname)
+
+  if (isBareLocalhost) {
+    return navigateTo('/tenant-error?reason=no-subdomain')
+  }
+
+  // Hostname bare sin subdominio (ej. "tudominio.com") → sin tenant
+  if (parts.length < 2 || parts[0] === 'www' || /^\d+$/.test(parts[0])) {
+    return navigateTo('/tenant-error?reason=no-subdomain')
+  }
+
+  const subdomain = parts[0]
+
+  // Reservado: subdomain admin bypasea el flujo de tenant
+  if (subdomain === 'admin') {
+    useState('isAdminContext', () => false).value = true
+    return
+  }
+
+  // Guardar slug en useState (SSR-safe) y en tenantStore (Pinia)
+  useState<string>('tenantSlug', () => '').value = subdomain
+  const tenantStore = useTenantStore()
+  tenantStore.setSlug(subdomain)
+})

package/middleware/02.validate-tenant.global.ts

@@ -0,0 +1,67 @@
+// useTenantStore auto-imported.
+// Server-only: valida el tenant via GET /ping con X-Tenant header.
+// Usa la URL interna del backend (apiInternalUrl) para evitar pasar por el proxy de Nitro.
+// Solo activo en mode === 'saas'.
+export default defineNuxtRouteMiddleware(async (to) => {
+  // Modo no-saas → no hay tenant que validar
+  if (!useInnertiaMode().hasTenant()) return
+
+  if (!import.meta.server) return
+
+  // Rutas públicas que no requieren tenant válido
+  const publicRoutes = ['/tenant-error', '/404']
+  const isPublic =
+    publicRoutes.some(r => to.path.startsWith(r)) ||
+    to.path.startsWith('/auth/')
+
+  if (isPublic) return
+
+  // Skip en contexto admin
+  if (useState('isAdminContext', () => false).value) return
+
+  const tenantSlug = useState<string>('tenantSlug', () => '').value
+
+  console.log(`[tenant:validate] path=${to.path} slug="${tenantSlug}"`)
+
+  if (!tenantSlug) {
+    console.warn('[tenant:validate] sin slug → /tenant-error?reason=no-subdomain')
+    return navigateTo('/tenant-error?reason=no-subdomain')
+  }
+
+  // URL interna del backend (no pasa por el proxy Nitro — no existe en SSR)
+  const config = useRuntimeConfig()
+  const internalUrl = (config as any).apiInternalUrl || 'http://api:80'
+  const pingUrl = `${internalUrl}/ping`
+
+  console.log(`[tenant:validate] ping → ${pingUrl} (X-Tenant: ${tenantSlug})`)
+
+  try {
+    const data = await $fetch<{ ok: boolean; tenant: { id: number; status: string; config: any } }>(
+      pingUrl,
+      {
+        headers: { 'X-Tenant': tenantSlug, 'Accept': 'application/json' },
+        timeout: 5000,
+      }
+    )
+
+    console.log(`[tenant:validate] respuesta:`, JSON.stringify(data))
+
+    if (!data?.ok) {
+      console.warn('[tenant:validate] tenant inactivo → /tenant-error?reason=inactive')
+      return navigateTo('/tenant-error?reason=inactive')
+    }
+
+    const tenantStore = useTenantStore()
+    tenantStore.setTenant(data.tenant.id, data.tenant.config ?? {})
+    console.log(`[tenant:validate] OK — tenant id=${data.tenant.id} status=${data.tenant.status}`)
+  } catch (e: any) {
+    const status = e?.response?.status
+    if (status === 404) {
+      console.warn(`[tenant:validate] 404 tenant no encontrado → inactive`)
+      return navigateTo('/tenant-error?reason=inactive')
+    }
+    const reason = e?.message?.includes('timeout') ? 'timeout' : 'unreachable'
+    console.error(`[tenant:validate] error → ${reason}`, e?.message)
+    return navigateTo(`/tenant-error?reason=${reason}`)
+  }
+})

package/middleware/03.apps.global.ts

@@ -0,0 +1,88 @@
+/**
+ * Middleware global que se ejecuta en cada navegación.
+ *
+ * Lee la declaración de apps desde `appConfig.innertia.apps`. Si el producto
+ * no declara apps, este middleware no hace nada (feature inactivo).
+ *
+ * Cuando hay apps declaradas, resuelve qué "app" (contexto) está intentando
+ * acceder el usuario según el prefijo de URL y:
+ *   1. Si la URL no cae en ningún app declarado → pasa (deja seguir)
+ *   2. Si la URL es la ruta de login del app → pasa (sin chequeo de permisos)
+ *   3. Si el usuario no está autenticado → deja que el middleware `auth` redirija
+ *   4. Si `availableContexts` está vacío (SSR sin hidratar) → intenta fetchMe()
+ *      y si falla, pasa sin redirigir (mejor renderizar que redirigir mal)
+ *   5. Si el usuario está autenticado pero NO tiene acceso al contexto del app →
+ *      redirige al primer app accesible (o a su loginPath si no tiene ninguno)
+ *   6. Si todo OK pero `currentContext !== app.context` → sincroniza el contexto
+ *      en el authStore y recarga permisos vía fetchMe()
+ *
+ * Esto es lo que permite el "cambio de contexto implícito por URL" sin botón.
+ *
+ * Numeración 03. para correr DESPUÉS de los middlewares saas
+ * (01.detect-subdomain, 02.validate-tenant).
+ */
+import type { AppDefinition } from '../app.config'
+
+export default defineNuxtRouteMiddleware(async (to) => {
+  const appConfig = useAppConfig()
+  const apps = (appConfig.innertia?.apps ?? {}) as Record<string, AppDefinition>
+  const list = Object.values(apps)
+
+  // Si el producto no declaró apps, el feature está inactivo
+  if (list.length === 0) return
+
+  // ¿La ruta cae bajo algún app?
+  const targetApp = list.find(app =>
+    to.path === app.path || to.path.startsWith(app.path + '/')
+  )
+
+  if (!targetApp) return  // ruta pública / fuera de apps
+
+  // La ruta de login del propio app no requiere permisos del contexto
+  if (to.path === targetApp.loginPath) return
+
+  const authStore = useAuthStore()
+
+  // Si no está autenticado, deja que el middleware `auth` de la página haga el redirect
+  if (!authStore.isAuthenticated()) return
+
+  // ── Hidratación defensiva ─────────────────────────────────────────────────
+  // `availableContexts` se persiste en localStorage, que NO se lee en SSR.
+  // El plugin auth-init hace fetchMe en SSR pero puede fallar silenciosamente
+  // (ej. tenant no resuelto). Si llegamos con token válido pero array vacío,
+  // intentamos cargar los contextos antes de decidir el redirect.
+  if ((authStore.availableContexts ?? []).length === 0) {
+    try {
+      const { fetchMe } = useAuth()
+      await fetchMe()
+    } catch {
+      // no podemos resolver — pasamos: mejor renderizar la página que redirigir mal
+      return
+    }
+  }
+
+  const userContexts = (authStore.availableContexts ?? []) as string[]
+
+  // Si tras hidratar seguimos sin contextos, NO redirigimos.
+  if (userContexts.length === 0) return
+
+  // ¿Tiene acceso al contexto del app?
+  if (!userContexts.includes(targetApp.context)) {
+    const fallback = list.find(app => userContexts.includes(app.context))
+    if (fallback) {
+      return navigateTo(fallback.home, { replace: true })
+    }
+    return navigateTo(list[0]?.loginPath ?? '/', { replace: true })
+  }
+
+  // Sincronizar currentContext silenciosamente si cambia
+  if (authStore.currentContext !== targetApp.context) {
+    authStore.setCurrentContext(targetApp.context)
+    try {
+      const { fetchMe } = useAuth()
+      await fetchMe()
+    } catch {
+      // best-effort
+    }
+  }
+})

package/middleware/auth.ts

@@ -0,0 +1,9 @@
+// Redirect unauthenticated users to login.
+// useAuthStore auto-imported from nuxt-app stores.
+export default defineNuxtRouteMiddleware(() => {
+  const authStore = useAuthStore()
+  const config = useRuntimeConfig()
+  if (!authStore.isAuthenticated()) {
+    return navigateTo(config.public.loginPath || '/login')
+  }
+})

package/middleware/guest.ts

@@ -0,0 +1,9 @@
+// Redirect already-authenticated users away from guest-only pages (login, register).
+// useAuthStore auto-imported from nuxt-app stores.
+export default defineNuxtRouteMiddleware(() => {
+  const authStore = useAuthStore()
+  const config = useRuntimeConfig()
+  if (authStore.isAuthenticated()) {
+    return navigateTo(config.public.homePath || '/')
+  }
+})

package/nuxt.config.ts

@@ -0,0 +1,42 @@
+import tailwindcss from '@tailwindcss/vite'
+
+// @innertia-solutions/innertia-nuxt — capa base unificada.
+// Provee: core (utilities, pusher, seo) + app (auth, context, vue-query)
+//       + saas (multitenancy) + spark (tema visual, components, layouts)
+export default defineNuxtConfig({
+  modules: [
+    '@nuxtjs/seo',
+    '@pinia/nuxt',
+    'pinia-plugin-persistedstate/nuxt', // requerido para persistir auth, dockedPreviews, etc.
+  ],
+  css: ['@innertia-solutions/innertia-nuxt/spark.css'],
+  components: [
+    { path: './components', pathPrefix: true, prefix: '' },
+  ],
+  imports: {
+    dirs: ['stores', 'composables'],
+    presets: [
+      {
+        from: '@tanstack/vue-query',
+        imports: ['useQuery', 'useMutation', 'useQueryClient', 'useInfiniteQuery'],
+      },
+    ],
+  },
+  runtimeConfig: {
+    public: {
+      loginPath: '/backoffice/login',
+      homePath: '/backoffice',
+    },
+  },
+  appConfig: {
+    spark: {
+      theme: 'default', // default | harvest | retro | ocean | autumn | moon | bubblegum | olive | cashmere
+    },
+  },
+  vite: {
+    plugins: [tailwindcss()],
+    optimizeDeps: {
+      include: ['pusher-js'],
+    },
+  },
+})

package/package.json

@@ -0,0 +1,60 @@
+{
+  "name": "@innertia-solutions/innertia-nuxt",
+  "version": "0.1.1",
+  "description": "Innertia Solutions — Nuxt layer unificada: core, auth, multitenancy, theme y app contexts",
+  "keywords": [
+    "nuxt",
+    "vue",
+    "pinia",
+    "saas",
+    "multitenancy",
+    "innertia"
+  ],
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/innertia-solutions/innertia-nuxt"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "main": "./nuxt.config.ts",
+  "exports": {
+    ".": "./nuxt.config.ts",
+    "./spark.css": "./spark.css"
+  },
+  "peerDependencies": {
+    "nuxt": ">=4.0.0",
+    "vue": ">=3.5.0",
+    "pinia": ">=3.0.0",
+    "@pinia/nuxt": ">=0.11.0",
+    "pinia-plugin-persistedstate": ">=4.0.0"
+  },
+  "dependencies": {
+    "@nuxtjs/seo": "^3.4.0",
+    "@pinia/nuxt": "^0.11.3",
+    "@tabler/icons-vue": "^3.44.0",
+    "@tailwindcss/aspect-ratio": "^0.4.2",
+    "@tailwindcss/forms": "^0.5.10",
+    "@tailwindcss/vite": "^4.0.0",
+    "@tanstack/vue-query": "^5.100.10",
+    "@tanstack/vue-table": "^8.21.3",
+    "@vueuse/core": "^14.3.0",
+    "date-fns": "^4.1.0",
+    "date-fns-tz": "^3.2.0",
+    "dayjs": "^1.11.0",
+    "pinia-plugin-persistedstate": "^4.7.1",
+    "preline": "^3.2.3",
+    "pusher-js": "^8.5.0",
+    "tailwindcss": "^4.0.0",
+    "uuid": "^13.0.0",
+    "vanilla-calendar-pro": "^3.1.0"
+  },
+  "devDependencies": {
+    "nuxt": "^4.4.2",
+    "vue": "^3.5.0",
+    "@pinia/nuxt": "^0.11.3",
+    "pinia": "^3.0.4",
+    "pinia-plugin-persistedstate": "^4.7.1"
+  }
+}

package/pages/tenant-error.vue

@@ -0,0 +1,50 @@
+<script setup lang="ts">
+definePageMeta({ layout: false })
+
+const route = useRoute()
+const reason = computed(() => route.query.reason as string | undefined)
+
+const messages = {
+  'no-subdomain': {
+    title: 'Acceso no válido',
+    description: 'No se encontró un espacio de trabajo en esta dirección. Verifica que estés usando la URL correcta.',
+  },
+  'inactive': {
+    title: 'Espacio de trabajo inactivo',
+    description: 'Este espacio de trabajo ha sido desactivado. Contacta al administrador.',
+  },
+  'timeout': {
+    title: 'Sin respuesta del servidor',
+    description: 'El servidor tardó demasiado en responder. Intenta nuevamente en unos momentos.',
+  },
+  'unreachable': {
+    title: 'Servicio no disponible',
+    description: 'No se pudo conectar con el servidor. Verifica tu conexión e intenta nuevamente.',
+  },
+} as const
+
+const fallback = { title: 'Error inesperado', description: 'Ocurrió un problema al cargar tu espacio de trabajo.' }
+const current = computed(() => messages[reason.value as keyof typeof messages] ?? fallback)
+</script>
+
+<template>
+  <div class="min-h-screen flex items-center justify-center bg-slate-50 dark:bg-slate-900 px-4">
+    <div class="max-w-md w-full text-center space-y-4">
+      <div class="text-6xl font-bold text-slate-300 dark:text-slate-700 select-none">
+        :(
+      </div>
+      <h1 class="text-2xl font-semibold text-slate-800 dark:text-white">
+        {{ current.title }}
+      </h1>
+      <p class="text-slate-500 dark:text-slate-400">
+        {{ current.description }}
+      </p>
+      <button
+        class="mt-4 px-4 py-2 rounded-lg bg-slate-800 text-white text-sm hover:bg-slate-700 dark:bg-slate-700 dark:hover:bg-slate-600"
+        @click="$router.go(0)"
+      >
+        Reintentar
+      </button>
+    </div>
+  </div>
+</template>

package/plugins/api-auth.ts

@@ -0,0 +1,12 @@
+// Registers the Authorization header interceptor into the shared registry.
+// Universal: useCookie reads request cookies in SSR and document.cookie on client.
+export default defineNuxtPlugin(() => {
+  const { add } = useRequestInterceptors()
+
+  add((headers: Record<string, string>, options: Record<string, unknown>) => {
+    if (options.useToken !== false) {
+      const token = useAuthStore().getToken()
+      if (token) headers['Authorization'] = `Bearer ${token}`
+    }
+  })
+})

package/plugins/api-tenant.client.ts

@@ -0,0 +1,21 @@
+// Registra el interceptor del header X-Tenant.
+// El backend (ResolveTenantFromHeader) identifica el tenant por su key/slug,
+// no por UUID. Solo se envía cuando el tenant está validado (tenantId != null)
+// para evitar enviar el slug 'local' de dev que no existe en la DB.
+// useRequestInterceptors auto-imported desde nuxt-core.
+// useTenantStore auto-imported desde saas stores.
+// Solo activo en mode === 'saas'.
+export default defineNuxtPlugin(() => {
+  // Modo no-saas → no inyectar header de tenant
+  if (!useInnertiaMode().hasTenant()) return
+
+  const { add } = useRequestInterceptors()
+  const tenantStore = useTenantStore()
+
+  add((headers: Record<string, string>) => {
+    // Solo enviar si el tenant fue validado (tiene id) y tiene slug
+    if (tenantStore.tenantId && tenantStore.tenantSlug) {
+      headers['X-Tenant'] = tenantStore.tenantSlug
+    }
+  })
+})

package/plugins/appearance.ts

@@ -0,0 +1,8 @@
+// Reads the hs_theme cookie (set by SwitchColorTheme + applyAppearance) and applies
+// the dark class to <html> during SSR so there's no flash on first paint.
+export default defineNuxtPlugin(() => {
+  const cookie = useCookie('hs_theme')
+  if (cookie.value === 'dark') {
+    useHead({ htmlAttrs: { class: 'dark' } })
+  }
+})

package/plugins/auth-init.ts

@@ -0,0 +1,34 @@
+// Universal plugin: runs on both server (SSR) and client.
+// On SSR: token is read from cookie → fetches user from API → pinia state is serialized
+// into the Nuxt payload and transferred to the client → no hydration mismatch.
+// Avoids useQueryClient() because vue-query.ts runs after this plugin alphabetically.
+// Universal plugin: runs on both server (SSR) and client.
+// On SSR: token is read from cookie → fetches user from API → pinia state is serialized
+// into the Nuxt payload and transferred to the client → no hydration mismatch.
+// Avoids useQueryClient() because vue-query.ts runs after this plugin alphabetically.
+export default defineNuxtPlugin(async () => {
+  const authStore = useAuthStore()
+
+  // Use getToken() not authStore.token — pinia-plugin-persistedstate may not have
+  // hydrated the store yet in SSR, but getToken() reads useCookie() directly.
+  if (!authStore.getToken()) return
+
+  if (!authStore.isAuthenticated()) {
+    authStore.logout()
+    return
+  }
+
+  if (!authStore.user) {
+    try {
+      const api = useApi()
+      const data = await api.get('auth/me')
+      if (data) {
+        authStore.saveUser(data.user ?? data)
+        authStore.savePermissions(data.permissions ?? [])
+        authStore.availableContexts = data.availableContexts ?? []
+      }
+    } catch {
+      if (import.meta.client) authStore.logout()
+    }
+  }
+})

package/plugins/dark-state.client.ts

@@ -0,0 +1,29 @@
+export default defineNuxtPlugin(() => {
+  if (!process.client) return
+
+  const isDark = useState<boolean>('isDark', () => false)
+
+  const updateTheme = () => {
+    if (typeof document !== 'undefined') {
+      isDark.value = document.documentElement.classList.contains('dark')
+    }
+  }
+
+  let observer: MutationObserver | null = null
+
+  const initializeTheme = () => {
+    updateTheme()
+    if (observer) observer.disconnect()
+    observer = new MutationObserver(() => updateTheme())
+    observer.observe(document.documentElement, {
+      attributes: true,
+      attributeFilter: ['class'],
+    })
+  }
+
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', initializeTheme)
+  } else {
+    nextTick(initializeTheme)
+  }
+})

package/plugins/dockedPreviewsSync.client.js

@@ -0,0 +1,17 @@
+/**
+ * Sincroniza el store de previews minimizados entre pestañas del navegador.
+ * Escucha los eventos `storage` que dispara localStorage cuando otra pestaña escribe.
+ */
+export default defineNuxtPlugin(() => {
+  const store = useDockedPreviewsStore()
+
+  window.addEventListener('storage', (event) => {
+    if (event.key !== 'docked-previews' || !event.newValue) return
+    try {
+      const persisted = JSON.parse(event.newValue)
+      store.hydrate(persisted.items ?? [])
+    } catch {
+      // JSON inválido — ignorar
+    }
+  })
+})

package/plugins/preline.client.ts

@@ -0,0 +1,68 @@
+declare global {
+  interface Window {
+    HSStaticMethods?: { autoInit?: () => void }
+    HSSelect?: new (el: HTMLElement) => { destroy?: () => void }
+    HSThemeAppearance?: { init?: () => void }
+  }
+}
+
+export default defineNuxtPlugin(async () => {
+  if (!process.client) return
+
+  try {
+    await import('preline')
+
+    const initPreline = () => {
+      try { window.HSStaticMethods?.autoInit?.() } catch (_) {}
+      try { window.HSThemeAppearance?.init?.() } catch (_) {}
+    }
+
+    const performMultipleInits = () => {
+      initPreline()
+      setTimeout(initPreline, 50)
+      setTimeout(initPreline, 200)
+      setTimeout(initPreline, 500)
+    }
+
+    if (document.readyState === 'loading') {
+      document.addEventListener('DOMContentLoaded', performMultipleInits)
+    } else {
+      nextTick(performMultipleInits)
+    }
+
+    const nuxtApp = useNuxtApp()
+    nuxtApp.hooks.hookOnce('app:mounted', () => performMultipleInits())
+    nuxtApp.hooks.hook('page:finish', () => requestAnimationFrame(performMultipleInits))
+
+    const observer = new MutationObserver((mutations) => {
+      const hasPreline = mutations.some(({ addedNodes }) =>
+        Array.from(addedNodes).some((node) => {
+          if (node.nodeType !== Node.ELEMENT_NODE) return false
+          const el = node as Element
+          return (
+            el.querySelector?.('[data-hs-overlay],[data-hs-dropdown],[data-hs-select]') ||
+            el.hasAttribute?.('data-hs-overlay') ||
+            el.hasAttribute?.('data-hs-dropdown') ||
+            el.hasAttribute?.('data-hs-select') ||
+            (typeof el.className === 'string' && el.className.includes('hs-'))
+          )
+        })
+      )
+      if (hasPreline) {
+        setTimeout(initPreline, 10)
+        setTimeout(initPreline, 100)
+      }
+    })
+
+    if (document.readyState === 'loading') {
+      document.addEventListener('DOMContentLoaded', () =>
+        observer.observe(document.body, { childList: true, subtree: true })
+      )
+    } else {
+      observer.observe(document.body, { childList: true, subtree: true })
+    }
+
+  } catch (e) {
+    console.warn('[nuxt-core] Error al cargar Preline:', e)
+  }
+})

package/plugins/theme.client.ts

@@ -0,0 +1,7 @@
+export default defineNuxtPlugin(() => {
+  const appConfig = useAppConfig() as { spark?: { theme?: string } }
+  const theme = appConfig.spark?.theme
+  if (theme && theme !== 'default') {
+    document.documentElement.setAttribute('data-theme', `theme-${theme}`)
+  }
+})