kmcom-nuxt-layers 2.1.6 → 2.2.0

package/layers/content/app/composables/createPortfolioComposables.ts

@@ -7,7 +7,9 @@ export function createPortfolioComposables(collectionName: string) {
     const { featured, tags, limit } = options
 
     return useContentData(`${collectionName}-items`, async () => {
-      let items = await queryCollection(collectionName).order('year', 'DESC').all()
+      let items = (await queryCollection(collectionName).all()).sort(
+        (a, b) => (b.year ?? 0) - (a.year ?? 0)
+      )
 
       if (featured !== undefined) {
         items = items.filter((item) => item.featured === featured)

package/layers/content/app/composables/useBlogPosts.ts

@@ -4,7 +4,9 @@ export function useBlogPosts(options: BlogQueryOptions = {}) {
   const { excludeDrafts = true, tags, limit } = options
 
   return useContentData('blog-posts', async () => {
-    let posts = await queryCollection('blog').order('date', 'DESC').all()
+    let posts = (await queryCollection('blog').all()).sort(
+      (a, b) => (b.date ?? '').localeCompare(a.date ?? '')
+    )
 
     if (excludeDrafts) {
       posts = posts.filter((post) => !post.draft)

package/layers/content/app/composables/useGalleryItems.ts

@@ -6,7 +6,9 @@ export function useGalleryItems(options: GalleryQueryOptions = {}) {
   const { tags, limit } = options
 
   return useContentData('gallery-items', async () => {
-    let items = await queryCollection('gallery').order('date', 'DESC').all()
+    let items = (await queryCollection('gallery').all()).sort(
+      (a, b) => (b.date ?? '').localeCompare(a.date ?? '')
+    )
 
     if (tags?.length) {
       items = items.filter((item) => item.tags?.some((tag: string) => tags.includes(tag)))

package/layers/content/app/composables/usePortfolioItems.ts

@@ -6,7 +6,9 @@ export function usePortfolioItems(options: PortfolioQueryOptions = {}) {
   const { featured, tags, limit } = options
 
   return useContentData('portfolio-items', async () => {
-    let items = await queryCollection('portfolio').order('year', 'DESC').all()
+    let items = (await queryCollection('portfolio').all()).sort(
+      (a, b) => (b.year ?? 0) - (a.year ?? 0)
+    )
 
     if (featured !== undefined) {
       items = items.filter((item) => item.featured === featured)

package/layers/scroll/app/components/Motion/HorizontalScroll.vue

@@ -12,8 +12,8 @@
 
   const { gsap } = useGsap()
 
-  const sectionRef = useTemplateRef<HTMLElement | null>(null)
-  const trackRef = useTemplateRef<HTMLElement | null>(null)
+  const sectionRef = useTemplateRef<HTMLElement>('sectionRef')
+  const trackRef = useTemplateRef<HTMLElement>('trackRef')
 
   let cleanup: (() => void) | null = null
 

package/layers/scroll/app/components/Motion/PinnedSection.vue

@@ -12,8 +12,8 @@
 
   const { gsap, ScrollTrigger } = useGsap()
 
-  const sectionRef = useTemplateRef<HTMLElement | null>(null)
-  const contentRef = useTemplateRef<HTMLElement | null>(null)
+  const sectionRef = useTemplateRef<HTMLElement>('sectionRef')
+  const contentRef = useTemplateRef<HTMLElement>('contentRef')
 
   const cleanups: Array<() => void> = []
 

package/layers/scroll/app/components/Motion/ScrollScene.vue

@@ -44,7 +44,7 @@
 
   const { ScrollTrigger } = useGsap()
 
-  const containerRef = useTemplateRef<HTMLElement | null>(null)
+  const containerRef = useTemplateRef<HTMLElement>('containerRef')
   const progress = ref(0)
   const active = ref(false)
 

package/layers/seo/app/app.config.ts

@@ -2,7 +2,7 @@
 export default defineAppConfig({
   seoLayer: {
     ogImage: {
-      component: 'OgImageBasic',
+      component: 'OgImageNuxtSeo',
       props: {} as Record<string, unknown>,
     },
     twitterCard: 'summary_large_image' as 'summary_large_image' | 'summary' | 'player' | 'app',

package/layers/shader/app/components/Shader/Background.client.vue

@@ -54,7 +54,7 @@
     ready: [renderer: any]
   }>()
 
-  const canvasRef = useTemplateRef<HTMLCanvasElement>()
+  const canvasRef = useTemplateRef<HTMLCanvasElement>('canvasRef')
   const { width, height } = useWindowSize()
 
   let renderer: any

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "kmcom-nuxt-layers",
   "private": false,
-  "version": "2.1.6",
+  "version": "2.2.0",
   "description": "Composable Nuxt 4 layers for building scalable Vue applications",
   "exports": {
     "./layers/core": "./layers/core/nuxt.config.ts",
@@ -47,13 +47,13 @@
     "packages/*"
   ],
   "peerDependencies": {
-    "@nuxt/scripts": "^0.11.0",
-    "@nuxtjs/seo": "^2.0.0",
     "@nuxt/content": "^3.14.0",
     "@nuxt/eslint": "^1.15.2",
     "@nuxt/image": "^2.0.0",
+    "@nuxt/scripts": "^0.11.0",
     "@nuxt/ui": "^4.8.1",
     "@nuxtjs/device": "^4.0.0",
+    "@nuxtjs/seo": "^5.0.0",
     "@tresjs/cientos": "^5.7.2",
     "@tresjs/core": "^5.8.1",
     "@tresjs/nuxt": "^5.6.1",
@@ -197,13 +197,14 @@
   ],
   "dependencies": {
     "node-gyp": "^12.3.0",
+    "pnpm": "11.5.3",
     "skills": "^1.5.10"
   },
   "engines": {
-    "node": ">=22 <23"
+    "node": ">=24 <25"
   },
   "volta": {
-    "node": "22.22.2",
+    "node": "24.16.0",
     "pnpm": "11.5.1"
   },
   "scripts": {