@dargmuesli/nuxt-vio 23.0.0-beta.5 → 23.0.0-beta.6

package/.config/certificates/.gitignore

@@ -0,0 +1,2 @@
+*.crt
+*.key

package/app/app.config.ts

@@ -4,63 +4,3 @@ export default defineAppConfig({
     themeColor: undefined,
   },
 })
-
-declare module 'nuxt/schema' {
-  interface AppConfig {
-    vio: {
-      seo?: {
-        ogImage?: {
-          defaultComponent: string // TODO: keyof OgImageComponents
-        }
-      }
-      pages?: {
-        legalNotice?: {
-          contact: {
-            email: string
-          }
-          responsibility: {
-            address: {
-              city: string
-              name: string
-              street: string
-            }
-          }
-          tmg: {
-            address: {
-              city: string
-              name: string
-              street: string
-            }
-          }
-        }
-        privacyPolicy?: {
-          hostingCdn?: {
-            external: {
-              address: {
-                city: string
-                name: string
-                street: string
-              }
-            }
-          }
-          mandatoryInfo?: {
-            responsible: {
-              address: {
-                city: string
-                email: string
-                name: string
-                street: string
-              }
-            }
-          }
-        }
-      }
-      server?: {
-        middleware: {
-          headers: Record<string, string>
-        }
-      }
-      themeColor?: string
-    }
-  }
-}

package/app/components/vio/button/VioButtonHome.vue

@@ -1,7 +1,7 @@
 <template>
   <VioButtonColored
     :aria-label="t('home')"
-    :to="localePath('/')"
+    :to="localePath({ path: '/' })"
     @click="emit('click')"
   >
     {{ t('home') }}

package/app/components/vio/layout/VioLayoutBreadcrumbs.vue

@@ -4,7 +4,7 @@
       :aria-label="t('home')"
       data-testid="breadcrumb-prefix-/"
       :is-colored="false"
-      :to="localePath('/')"
+      :to="localePath({ path: '/' })"
     >
       <VioIconHome classes="h-6 w-6" />
     </VioLink>

package/nuxt.config.ts

@@ -52,6 +52,14 @@ export default defineNuxtConfig(
           enabled: true,
         },
       },
+      experimental: {
+        early404: true,
+        inlineErrorRendering: true,
+        prerenderErrorPages: true,
+        routeTypedFetch: true,
+        strictRouteTypes: true,
+        typedPages: true,
+      },
       modules: [
         '@dargmuesli/nuxt-cookie-control',
         '@nuxt/devtools',
@@ -118,7 +126,6 @@ export default defineNuxtConfig(
         compressPublicAssets: true,
         experimental: {
           asyncContext: true,
-          typedPages: true,
         },
       },
       runtimeConfig: {
@@ -173,20 +180,19 @@ export default defineNuxtConfig(
         },
       },
       typescript: {
-        nodeTsConfig: {
-          include: [resolve('./node')],
-        },
-        tsConfig: {
-          nodeTsConfig: {
-            include: [resolve('../.config'), resolve('../node')],
-          },
+        appTsConfig: {
           vueCompilerOptions: {
             htmlAttributes: [], // https://github.com/johnsoncodehk/volar/issues/1970#issuecomment-1276994634
           },
-          // compilerOptions: {
-          //   noErrorTruncation: true,
-          // },
         },
+        nodeTsConfig: {
+          include: [resolve('./node')],
+        },
+        // tsConfig: {
+        //   compilerOptions: {
+        //     noErrorTruncation: true,
+        //   },
+        // },
       },
       vite: {
         plugins: [
@@ -349,6 +355,7 @@ export default defineNuxtConfig(
       },
       seo: {
         minify: false, // TODO: enable (https://github.com/harlan-zw/nuxt-seo-utils/issues/103)
+        validateAppHead: false, // `app.head.htmlAttrs.lang` is only a fallback for the routeless SPA pages, as i18n sets the correct language per locale everywhere else.
       },
       shadcn: {
         prefix: '',

package/package.json

@@ -1,81 +1,80 @@
 {
   "dependencies": {
-    "@dargmuesli/nuxt-cookie-control": "9.3.3",
-    "@eslint/compat": "2.1.0",
+    "@dargmuesli/nuxt-cookie-control": "9.3.8",
+    "@eslint/compat": "2.1.1",
     "@heroicons/vue": "2.2.0",
-    "@http-util/status-i18n": "0.9.0",
+    "@http-util/status-i18n": "0.9.1",
     "@intlify/eslint-plugin-vue-i18n": "4.5.1",
-    "@lucide/vue": "1.33.0",
-    "@nuxt/devtools": "3.4.1",
+    "@lucide/vue": "1.53.0",
+    "@nuxt/devtools": "3.4.2",
     "@nuxt/eslint": "1.17.0",
     "@nuxt/image": "2.1.0",
     "@nuxtjs/color-mode": "4.0.1",
     "@nuxtjs/html-validator": "2.1.0",
     "@nuxtjs/i18n": "10.6.0",
-    "@nuxtjs/seo": "5.3.14",
+    "@nuxtjs/seo": "5.3.16",
     "@nuxtjs/turnstile": "1.1.3",
     "@pinia/nuxt": "1.0.2",
     "@sentry/nuxt": "10.71.0",
     "@tailwindcss/forms": "0.5.11",
     "@tailwindcss/typography": "0.5.20",
     "@tailwindcss/vite": "4.3.3",
-    "@takumi-rs/core": "2.10.0",
+    "@takumi-rs/core": "2.14.0",
     "@types/lodash-es": "4.17.12",
-    "@types/nodemailer": "8.0.1",
+    "@types/nodemailer": "8.0.2",
     "@urql/core": "6.0.3",
     "@urql/vue": "2.1.1",
     "@vuelidate/core": "2.0.3",
     "@vuelidate/validators": "2.0.4",
-    "@vueuse/core": "14.4.0",
+    "@vueuse/core": "15.0.0",
     "class-variance-authority": "0.7.1",
     "clsx": "2.1.1",
-    "eslint": "10.8.1",
+    "eslint": "10.12.0",
     "eslint-config-prettier": "10.1.8",
     "eslint-plugin-compat": "7.0.2",
     "eslint-plugin-prettier": "5.5.6",
     "eslint-plugin-yml": "3.8.1",
-    "globals": "17.11.0",
+    "globals": "17.13.0",
     "jiti": "2.7.0",
-    "jose": "6.2.9",
-    "nodemailer": "9.0.5",
+    "jose": "6.2.12",
+    "nodemailer": "10.0.16",
     "nuxt-gtag": "5.0.0",
     "nuxt-security": "2.6.0",
-    "reka-ui": "2.10.3",
+    "reka-ui": "2.11.0",
     "shadcn-nuxt": "2.8.2",
-    "tailwind-merge": "3.6.0",
+    "tailwind-merge": "3.7.0",
     "tw-animate-css": "1.4.0",
     "typescript": "6.0.3",
     "vue-sonner": "2.0.9",
-    "vue-tsc": "3.3.10"
+    "vue-tsc": "3.3.11"
   },
   "devDependencies": {
-    "@types/node": "24.13.3",
+    "@types/node": "24.19.1",
     "@urql/devtools": "2.0.3",
-    "@urql/exchange-graphcache": "9.0.1",
-    "@vueuse/core": "14.4.0",
+    "@urql/exchange-graphcache": "9.0.2",
+    "@vueuse/core": "15.0.0",
     "consola": "3.4.2",
     "defu": "6.1.7",
-    "h3": "1.15.11",
     "lodash-es": "4.18.1",
-    "nuxt": "4.5.2",
+    "nuxt": "4.6.1",
     "pinia": "4.0.3",
     "postcss-html": "2.0.0",
-    "prettier": "3.9.6",
+    "prettier": "3.9.9",
     "prettier-plugin-tailwindcss": "0.8.1",
     "serve": "14.2.6",
-    "sharp": "0.35.3",
-    "stylelint": "17.14.1",
+    "sharp": "0.35.5",
+    "stylelint": "17.16.0",
     "stylelint-config-html": "2.0.0",
     "stylelint-config-recommended": "18.0.0",
     "stylelint-config-recommended-vue": "2.0.0",
     "stylelint-config-standard": "40.0.0",
-    "stylelint-no-unsupported-browser-features": "8.1.1",
+    "stylelint-no-unsupported-browser-features": "8.1.2",
     "tailwindcss": "4.3.3",
-    "vue": "3.5.41",
-    "vue-router": "5.2.0"
+    "vue": "3.5.43",
+    "vue-router": "5.4.0"
   },
   "engines": {
-    "node": "24"
+    "node": "^24.15.0"
   },
   "files": [
     ".config",
@@ -92,7 +91,7 @@
   "main": "nuxt.config.ts",
   "name": "@dargmuesli/nuxt-vio",
   "peerDependencies": {
-    "nuxt": "^4.1.0",
+    "nuxt": "^4.6.0",
     "vue": "^3.5.21",
     "vue-router": "^4.5.1 || ^5.0.0"
   },
@@ -104,7 +103,7 @@
     "url": "git+https://github.com/dargmuesli/vio.git"
   },
   "type": "module",
-  "version": "23.0.0-beta.5",
+  "version": "23.0.0-beta.6",
   "scripts": {
     "build": "pnpm run build:node",
     "build:node": "NUXT_PUBLIC_I18N_BASE_URL=https://app.localhost:3001 nuxt build playground",

package/server/api/healthcheck.get.ts

@@ -1,5 +1,6 @@
+import { defineEventHandler } from 'nuxt/server'
+
 export default defineEventHandler((event) => {
-  const { res } = event.node
-  res.setHeader('Content-Type', 'text/plain')
-  res.end('OK')
+  event.res.headers.set('Content-Type', 'text/plain')
+  return 'OK'
 })

package/server/middleware/dateTime.ts

@@ -1,8 +1,11 @@
+import { defineEventHandler } from 'nuxt/server'
+
 export default defineEventHandler(async (event) => {
   const isTesting = useIsTesting()
   event.context.$timeZone = await getTimeZone({ event, isTesting })
 })
 
+// h3 handlers, `useEvent()` and the app's `ssrContext.event` still see h3's context
 declare module 'h3' {
   interface H3EventContext {
     $timeZone?: string

package/server/middleware/headers.ts

@@ -1,9 +1,11 @@
-export default defineEventHandler(async (event) => {
+import { defineEventHandler, useAppConfig } from 'nuxt/server'
+
+export default defineEventHandler((event) => {
   const config = useAppConfig(event)
 
   if (!config.vio.server) return
 
   for (const entry of Object.entries(config.vio.server.middleware.headers)) {
-    appendHeader(event, entry[0], entry[1])
+    event.res.headers.append(entry[0], entry[1])
   }
 })

package/server/plugins/nodemailer.ts

@@ -27,6 +27,7 @@ export default defineNitroPlugin((nitroApp) => {
   })
 })
 
+// h3 handlers and `useEvent()` still see h3's context
 declare module 'h3' {
   interface H3EventContext {
     $email?: {

package/server/utils/dateTime.ts

@@ -1,10 +1,10 @@
-import type { H3Event } from 'h3'
+import { getCookie, getRequestIP, type RequestEvent } from 'nuxt/server'
 
 export const getTimeZone = async ({
   event,
   isTesting,
 }: {
-  event: H3Event
+  event: RequestEvent
   isTesting?: boolean
 }) => {
   const timeZoneBySsr = event.context.$timeZone
@@ -26,12 +26,8 @@ export const getTimeZone = async ({
   }
 }
 
-export const useTimeZone = async () => {
-  const event = useEvent()
-  const isTesting = useIsTesting()
-
-  return await getTimeZone({ event, isTesting })
-}
+// the `dateTime` middleware has already resolved the time zone for every request
+export const useTimeZone = async () => useEvent().context.$timeZone
 
 export const getTimeZoneByIpApi = async ({ ip }: { ip: string }) => {
   const ipApiResult = await $fetch<{ timezone: string }>(

package/shared/types/app-config.d.ts

@@ -0,0 +1,62 @@
+// in `shared/` so that both the app's and the server's `useAppConfig` are typed
+declare module '@nuxt/schema' {
+  interface CustomAppConfig {
+    vio: {
+      seo?: {
+        ogImage?: {
+          defaultComponent: string // TODO: keyof OgImageComponents
+        }
+      }
+      pages?: {
+        legalNotice?: {
+          contact: {
+            email: string
+          }
+          responsibility: {
+            address: {
+              city: string
+              name: string
+              street: string
+            }
+          }
+          tmg: {
+            address: {
+              city: string
+              name: string
+              street: string
+            }
+          }
+        }
+        privacyPolicy?: {
+          hostingCdn?: {
+            external: {
+              address: {
+                city: string
+                name: string
+                street: string
+              }
+            }
+          }
+          mandatoryInfo?: {
+            responsible: {
+              address: {
+                city: string
+                email: string
+                name: string
+                street: string
+              }
+            }
+          }
+        }
+      }
+      server?: {
+        middleware: {
+          headers: Record<string, string>
+        }
+      }
+      themeColor?: string
+    }
+  }
+}
+
+export {}

package/shared/types/request-event-context.d.ts

@@ -0,0 +1,13 @@
+import type { Transporter } from 'nodemailer'
+
+// in `shared/` because typed `$fetch` also type-checks server handlers in the app context
+declare module '@nuxt/schema' {
+  interface RequestEventContext {
+    $email?: {
+      nodemailer: {
+        transporter: Transporter
+      }
+    }
+    $timeZone?: string
+  }
+}