kmcom-nuxt-layers 4.0.1 → 5.0.1

package/layers/structure/layout/app/components/Layout/Page/Header.vue

@@ -30,15 +30,15 @@
     <template v-if="back">
       <UButton :to="back" variant="ghost" icon="i-lucide-arrow-left" />
       <div>
-        <h1 class="text-3xl font-bold text-highlighted">{{ title }}</h1>
+        <h1 class="text-highlighted text-3xl font-bold">{{ title }}</h1>
         <p v-if="description" class="text-muted">{{ description }}</p>
       </div>
     </template>
 
     <!-- Centered page header (homepage, section intros) -->
     <template v-else>
-      <h1 class="text-4xl font-bold text-highlighted">{{ title }}</h1>
-      <p v-if="description" class="mt-3 text-lg text-muted">{{ description }}</p>
+      <h1 class="text-highlighted text-4xl font-bold">{{ title }}</h1>
+      <p v-if="description" class="text-muted mt-3 text-lg">{{ description }}</p>
     </template>
   </div>
 </template>

package/layers/structure/layout/app/components/Layout/Page/index.vue

@@ -2,9 +2,12 @@
   /**
    * LayoutPage — canonical page wrapper for the Swiss Grid System.
    *
-   * This is a fragment component (no wrapper element). The grid root is already
-   * provided by LayoutMain at the layout level via <main class="grid-root">.
-   * Adding another grid-root wrapper here would nest grids and misalign everything.
+   * The grid root is already provided by LayoutMain at the layout level via
+   * <main class="grid-root">. Adding another grid-root wrapper here would nest grids and
+   * misalign everything, so the single root element below is `display: contents` — it
+   * generates no box, and the header section and slot content still lay out as direct
+   * children of the grid root. A real root element (rather than a fragment) is what Vue's
+   * <Transition> and Nuxt's page-root check (NUXT_E4004) require.
    *
    * Responsibilities:
    *   - SEO via useHead()
@@ -57,13 +60,15 @@
 </script>
 
 <template>
-  <!-- Optional visible page header — rendered as a grid section -->
-  <LayoutSection v-if="showHeader">
-    <LayoutGridItem preset="centered">
-      <LayoutPageHeader :title v-bind="description !== undefined ? { description } : {}" />
-    </LayoutGridItem>
-  </LayoutSection>
+  <div class="contents">
+    <!-- Optional visible page header — rendered as a grid section -->
+    <LayoutSection v-if="showHeader">
+      <LayoutGridItem preset="centered">
+        <LayoutPageHeader :title v-bind="description !== undefined ? { description } : {}" />
+      </LayoutGridItem>
+    </LayoutSection>
 
-  <!-- Page content — direct children of grid-root (via LayoutMain in the layout) -->
-  <slot />
+    <!-- Page content — grid items of grid-root (via LayoutMain in the layout) -->
+    <slot />
+  </div>
 </template>

package/layers/structure/layout/app/utils/gridPlacementStyle.test.ts

@@ -1,4 +1,4 @@
-import { describe, expect, it } from 'vitest'
+import { describe, expect, it } from 'vite-plus/test'
 
 import {
   buildGridPlacementClasses,

package/layers/structure/navigation/app/components/Mast/Nav.vue

@@ -6,7 +6,7 @@
 <template>
   <button
     aria-label="Open navigation menu"
-    class="fixed right-0 top-0 flex cursor-pointer items-center justify-center border-0 bg-transparent p-4"
+    class="fixed top-0 right-0 flex cursor-pointer items-center justify-center border-0 bg-transparent p-4"
     :style="{ zIndex: z }"
     @click="() => open()"
   >

package/layers/structure/navigation/app/components/Mast/NavModal.vue

@@ -41,7 +41,7 @@
       :style="{ zIndex: useGridConfig().useZIndex('modal') }"
     >
       <button
-        class="absolute right-[5vw] top-[3vh] cursor-pointer border-0 bg-transparent p-2"
+        class="absolute top-[3vh] right-[5vw] cursor-pointer border-0 bg-transparent p-2"
         aria-label="Close navigation"
         @click="dismiss"
       >
@@ -52,7 +52,7 @@
         <button
           v-for="link in links"
           :key="link.id"
-          class="cursor-pointer border-0 bg-transparent px-4 py-3 text-3xl uppercase tracking-widest transition-all"
+          class="cursor-pointer border-0 bg-transparent px-4 py-3 text-3xl tracking-widest uppercase transition-all"
           :class="activeSection === link.id ? 'font-normal' : 'font-light'"
           @click="() => handleNav(link)"
         >

package/layers/structure/navigation/app/utils/site.test.ts

@@ -1,4 +1,4 @@
-import { describe, expect, it } from 'vitest'
+import { describe, expect, it } from 'vite-plus/test'
 
 import { resolveSiteConfig } from './site'
 

package/layers/structure/routing/app/utils/resolveRoute.test.ts

@@ -1,4 +1,4 @@
-import { describe, expect, it } from 'vitest'
+import { describe, expect, it } from 'vite-plus/test'
 
 import type { FeatureValue, RouteResolution, RoutingLayerConfig } from '../types/routing'
 import { resolveRoute } from './resolveRoute'

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "kmcom-nuxt-layers",
   "private": false,
-  "version": "4.0.1",
+  "version": "5.0.1",
   "description": "Composable Nuxt 4 layers for building scalable Vue applications",
   "exports": {
     "./layers/core": "./layers/core/nuxt.config.ts",
@@ -77,18 +77,18 @@
     "@nuxt/scripts": "^0.11.0 || ^1.0.0",
     "@nuxt/ui": "^4.8.1",
     "@nuxtjs/device": "^4.0.0",
-    "@nuxtjs/seo": "^5.0.0",
+    "@nuxtjs/seo": "^5.0.0 || ^6.0.0",
     "@tresjs/cientos": "^5.7.2",
     "@tresjs/core": "^5.8.1",
     "@tresjs/nuxt": "^5.6.1",
     "@tresjs/post-processing": "^3.7.2",
     "@vite-pwa/nuxt": "^1.1.1",
-    "@vueuse/nuxt": "^14.3.0",
-    "better-sqlite3": "^12.10.0",
+    "@vueuse/nuxt": "^14.3.0 || ^15.0.0",
+    "better-sqlite3": "^12.10.0 || ^13.0.0",
     "gsap": "^3.15.0",
     "locomotive-scroll": "^5.0.1",
     "nuxt": "^4.4.7",
-    "pinia": "^3.0.4",
+    "pinia": "^3.0.4 || ^4.1.0",
     "tailwindcss": "^4.3.0",
     "three": ">=0.184.0",
     "v-gsap-nuxt": ">=1.5.12",
@@ -148,12 +148,9 @@
     }
   },
   "devDependencies": {
-    "@commitlint/cli": "^21.0.2",
-    "@commitlint/config-conventional": "^21.0.2",
     "@culur/config-stylelint": "^1.7.2",
     "@eslint/json": "^1.2.0",
     "@eslint/markdown": "^8.0.3",
-    "@ianvs/prettier-plugin-sort-imports": "^4.7.1",
     "@iconify-json/lucide": "^1.2.126",
     "@netlify/nuxt": "0.3.7",
     "@nuxt/eslint": "^1.15.2",
@@ -162,7 +159,8 @@
     "@nuxt/test-utils": "^4.0.3",
     "@nuxt/ui": "latest",
     "@nuxtjs/device": "^4.0.0",
-    "@oxc-parser/binding-darwin-arm64": "^0.134.0",
+    "@nuxtjs/seo": "^5.0.0",
+    "better-sqlite3": "^12.10.0",
     "@perplex-digital/stylelint-config": "^17.4.0",
     "@pinia/nuxt": "^0.11.3",
     "@playwright/test": "1.61.0",
@@ -171,7 +169,7 @@
     "@typescript-eslint/eslint-plugin": "^8.60.1",
     "@typescript-eslint/parser": "^8.60.1",
     "@vitejs/plugin-vue": "^6.0.8",
-    "@vitest/coverage-v8": "^4.1.11",
+    "@vitest/coverage-v8": "5.0.5",
     "@vue/eslint-config-typescript": "^14.7.0",
     "@vue/test-utils": "^2.4.10",
     "@vueuse/core": "^14.3.0",
@@ -180,48 +178,35 @@
     "@webgpu/types": "^0.1.72",
     "browserslist": "^4.28.8",
     "browserslist-config-baseline": "^0.5.0",
-    "changesets": "^1.0.2",
     "csstype": "^3.2.3",
-    "cypress": "^15.16.0",
-    "depcheck": "^1.4.7",
     "eslint": "^10.4.1",
     "eslint-plugin-compat": "^7.0.2",
-    "eslint-plugin-glsl": "0.0.0-wip",
     "eslint-plugin-pnpm": "^1.6.1",
-    "eslint-plugin-prettier": "^5.5.6",
-    "eslint-plugin-unicorn": "^64.0.0",
-    "eslint-plugin-unused-imports": "^4.4.1",
     "eslint-plugin-vue": "^10.9.2",
     "fallow": "^2.92.1",
     "happy-dom": "^20.10.3",
     "netlify-cli": "^26.1.0",
     "npm-check-updates": "^22.2.2",
-    "nuxt": "latest",
+    "nuxt": "4.6.1",
     "pinia": "^4.0.3",
     "postcss-html": "^1.8.1",
-    "prettier": "^3.8.3",
-    "prettier-plugin-css-order": "^2.2.0",
-    "prettier-plugin-glsl": "^0.3.1",
-    "prettier-plugin-organize-attributes": "^1.0.0",
-    "prettier-plugin-tailwind-styled-components": "^2.0.2",
-    "prettier-plugin-tailwindcss": "^0.8.1",
     "stylelint": "^17.12.0",
     "stylelint-config-recommended-vue": "^1.6.1",
     "stylelint-config-standard": "^40.0.0",
     "stylelint-config-standard-vue": "^1.0.0",
     "stylelint-config-tailwindcss": "^1.0.1",
     "stylelint-no-unsupported-browser-features": "^8.1.1",
-    "stylelint-prettier": "^5.0.3",
     "tailwindcss": "latest",
-    "turbo": "^2.9.18",
+    "turbo": "^2.11.8",
     "type-fest": "^5.7.0",
     "typescript": "^6",
     "vite-plugin-checker": "^0.14.5",
-    "vitest": "^4.1.11",
+    "vitest": "5.0.5",
     "vue": "3.5.35",
     "vue-tsc": "3.3.11",
     "zod": "^4.4.3",
-    "zod-to-json-schema": "^3.25.2"
+    "zod-to-json-schema": "^3.25.2",
+    "vite-plus": "1.3.0"
   },
   "browserslist": [
     "last 2 Chrome major versions",
@@ -237,10 +222,6 @@
   "engines": {
     "node": ">=24 <25"
   },
-  "volta": {
-    "node": "24.16.0",
-    "pnpm": "11.5.3"
-  },
   "scripts": {
     "dev": "pnpm -F playground dev",
     "dev:debug": "pnpm -F debug dev",
@@ -251,25 +232,25 @@
     "dev:database": "PLAYGROUND_LAYERS=core,database pnpm -F playground dev",
     "dev:auth": "PLAYGROUND_LAYERS=core,auth pnpm -F playground dev",
     "build": "turbo run build",
-    "lint": "turbo run lint",
-    "lint:fix": "turbo run lint -- --fix",
+    "lint": "vp lint && turbo run lint",
+    "lint:fix": "vp lint --fix && turbo run lint -- --fix",
     "lint:style": "stylelint \"**/*.{vue,scss,css}\"",
     "lint:style:fix": "stylelint \"**/*.{vue,scss,css}\" --fix",
-    "format": "prettier --write .",
-    "format:check": "prettier --check .",
+    "format": "vp fmt .",
+    "format:check": "vp fmt --check .",
     "check": "pnpm run lint && pnpm run typecheck && pnpm run format:check",
     "fix": "pnpm run format && pnpm run lint:fix && pnpm run lint:style:fix",
-    "fix:layer": "f(){ pnpm turbo run lint --filter \"./layers/$1\" -- --fix && prettier --write \"layers/$1\"; }; f",
-    "fix:app": "f(){ pnpm turbo run lint --filter \"./apps/$1\" -- --fix && prettier --write \"apps/$1\"; }; f",
+    "fix:layer": "f(){ pnpm turbo run lint --filter \"./layers/$1\" -- --fix && vp fmt \"layers/$1\"; }; f",
+    "fix:app": "f(){ pnpm turbo run lint --filter \"./apps/$1\" -- --fix && vp fmt \"apps/$1\"; }; f",
     "validate": "pnpm run check && pnpm run build",
     "typecheck": "vue-tsc --noEmit -p tsconfig.typecheck.json",
-    "test": "vitest run",
-    "test:coverage": "vitest run --coverage",
-    "test:watch": "vitest",
-    "test:unit": "vitest run --project unit",
-    "test:vitest": "vitest run --project vitest",
-    "test:vue": "vitest run --project vue",
-    "test:nuxt": "vitest run --project nuxt",
+    "test": "vp test run",
+    "test:coverage": "vp test run --coverage",
+    "test:watch": "vp test",
+    "test:unit": "vp test run --project unit",
+    "test:vitest": "vp test run --project vitest",
+    "test:vue": "vp test run --project vue",
+    "test:nuxt": "vp test run --project nuxt",
     "test:playwright": "playwright test",
     "test:e2e": "playwright test",
     "clean": "pnpm -r exec rm -rf .nuxt .output .data",