kmcom-nuxt-layers 2.2.10 → 2.2.11

package/layers/animations/app/components/Motion/MarqueeText.vue

@@ -99,7 +99,7 @@
     directionFactors.value = new Array(texts.length).fill(1)
     animLastTime = performance.now()
 
-    const firstContainer = containerRef.value[0]
+    const firstContainer = containerRef.value?.[0]
     if (firstContainer) {
       scrollTriggerInstance = ScrollTrigger.create({
         trigger: firstContainer,

package/layers/canvas/app/composables/useRendererCapabilities.ts

@@ -15,10 +15,7 @@ export function useRendererCapabilities() {
   const isReady = ref(false)
 
   function detectFromRenderer(renderer: WebGPURenderer | WebGLRenderer) {
-    const isWebGPU = renderer.constructor?.name === 'WebGPURenderer'
-    const glCaps = renderer.capabilities
-
-    if (isWebGPU || !glCaps) {
+    if (!('capabilities' in renderer)) {
       capabilities.value = {
         backend: 'webgpu',
         maxTextureSize: 16384,
@@ -35,6 +32,8 @@ export function useRendererCapabilities() {
       return
     }
 
+    const glCaps = renderer.capabilities
+
     capabilities.value = {
       backend: 'webgl',
       maxTextureSize: glCaps.maxTextureSize,

package/layers/content/app/components/NuxtContent/Detail.vue

@@ -17,8 +17,8 @@
   const { data: item, status } = await useCollectionItem(collection, slug)
   const { data: surround } = await useCollectionSurround(collection, slug)
 
-  const surroundLinks = computed(
-    () => (surround.value ?? undefined) as ContentSurroundLink[] | undefined
+  const surroundLinks = computed<ContentSurroundLink[] | undefined>(
+    () => surround.value ?? undefined
   )
   const itemImage = computed(() => (item.value as { image?: string } | null)?.image)
 
@@ -51,7 +51,7 @@
         <slot name="after-content" :item />
 
         <USeparator class="my-8" />
-        <NuxtContentSurround :surround="surroundLinks" />
+        <NuxtContentSurround v-bind="surroundLinks?.length ? { surround: surroundLinks } : {}" />
       </UPageBody>
 
       <template v-if="!hideToc" #right>

package/layers/feeds/server/utils/content-adapter.ts

@@ -3,38 +3,77 @@ import type { H3Event } from 'h3'
 
 import type { FeedItem } from './types'
 
-type AnyContent = Record<string, unknown>
+type FeedSourceAuthor = {
+  name?: string | undefined
+}
+
+type FeedSourceItem = {
+  draft?: boolean | undefined
+  title?: string | undefined
+  description?: string | undefined
+  stem?: string | undefined
+  path?: string | undefined
+  _path?: string | undefined
+  date?: string | number | Date | undefined
+  createdAt?: string | number | Date | undefined
+  author?: FeedSourceAuthor | string | undefined
+  authors?: FeedSourceAuthor[] | undefined
+  tags?: string[] | undefined
+}
+
+type FeedCollectionQuery = {
+  all(): Promise<FeedSourceItem[]>
+}
+
+const getFeedCollection = queryCollection as unknown as (
+  event: H3Event,
+  collection: string
+) => FeedCollectionQuery
+
+function resolveFeedAuthor(item: FeedSourceItem): string | undefined {
+  const firstAuthor = item.authors?.[0]
+  if (typeof firstAuthor?.name === 'string' && firstAuthor.name.length > 0) {
+    return firstAuthor.name
+  }
+
+  if (typeof item.author === 'string' && item.author.length > 0) {
+    return item.author
+  }
+
+  if (item.author && typeof item.author === 'object' && typeof item.author.name === 'string') {
+    return item.author.name
+  }
+
+  return undefined
+}
+
+function resolveFeedDate(item: FeedSourceItem): Date {
+  return new Date(item.date ?? item.createdAt ?? Date.now())
+}
 
 export async function getContentFeedItems(
   event: H3Event,
   collection: string = 'blog',
   limit: number = 30
 ): Promise<FeedItem[]> {
-  // queryCollection's first argument is typed as a const collection name, but we pass
-  // a dynamic string at runtime — the cast is intentional and safe here.
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  const raw: AnyContent[] = await (queryCollection as any)(event, collection).all()
+  // queryCollection is keyed by literal collection names, but feed routes accept
+  // a runtime collection string; keep the unsafe bridge local here.
+  const raw = await getFeedCollection(event, collection).all()
 
   return raw
     .filter((item) => !item.draft)
-    .sort(
-      (a, b) =>
-        new Date(b.date ?? b.createdAt ?? 0).getTime() -
-        new Date(a.date ?? a.createdAt ?? 0).getTime()
-    )
+    .sort((a, b) => resolveFeedDate(b).getTime() - resolveFeedDate(a).getTime())
     .slice(0, limit)
-    .map((item) => {
-      const firstAuthor = Array.isArray(item.authors)
-        ? item.authors[0]?.name
-        : (item.author?.name ?? (typeof item.author === 'string' ? item.author : undefined))
+    .map((item): FeedItem => {
+      const link = item.path ?? item._path ?? ''
       return {
         title: item.title ?? item.stem ?? '',
         description: item.description,
-        link: item.path ?? item._path ?? '',
-        id: item.path ?? item._path ?? '',
-        date: new Date(item.date ?? item.createdAt ?? Date.now()),
-        author: firstAuthor ?? undefined,
-        tags: Array.isArray(item.tags) ? item.tags : undefined,
+        link,
+        id: link,
+        date: resolveFeedDate(item),
+        author: resolveFeedAuthor(item),
+        tags: item.tags,
       }
     })
 }

package/layers/shader/app/components/Preset/Aurora.client.vue

@@ -31,8 +31,8 @@
     watch(
       () => [runtime.mouse.mouseX.value, runtime.mouse.mouseY.value],
       ([mx, my]) => {
-        uniforms.mouseX.value = mx
-        uniforms.mouseY.value = my
+        uniforms.mouseX.value = mx ?? 0.5
+        uniforms.mouseY.value = my ?? 0.5
       },
       { immediate: true }
     )

package/layers/shader/app/components/Preset/Flow.client.vue

@@ -32,8 +32,8 @@
     watch(
       () => [runtime.mouse.mouseX.value, runtime.mouse.mouseY.value],
       ([mx, my]) => {
-        uniforms.mouseX.value = mx
-        uniforms.mouseY.value = my
+        uniforms.mouseX.value = mx ?? 0.5
+        uniforms.mouseY.value = my ?? 0.5
       },
       { immediate: true }
     )

package/layers/shader/app/components/Preset/GradientMesh.client.vue

@@ -32,8 +32,8 @@
     watch(
       () => [runtime.mouse.mouseX.value, runtime.mouse.mouseY.value],
       ([mx, my]) => {
-        uniforms.mouseX.value = mx
-        uniforms.mouseY.value = my
+        uniforms.mouseX.value = mx ?? 0.5
+        uniforms.mouseY.value = my ?? 0.5
       },
       { immediate: true }
     )

package/layers/shader/app/components/Preset/Nebula.client.vue

@@ -32,8 +32,8 @@
     watch(
       () => [runtime.mouse.mouseX.value, runtime.mouse.mouseY.value],
       ([mx, my]) => {
-        uniforms.mouseX.value = mx
-        uniforms.mouseY.value = my
+        uniforms.mouseX.value = mx ?? 0.5
+        uniforms.mouseY.value = my ?? 0.5
       },
       { immediate: true }
     )

package/layers/shader/app/components/Preset/Ocean.client.vue

@@ -32,8 +32,8 @@
     watch(
       () => [runtime.mouse.mouseX.value, runtime.mouse.mouseY.value],
       ([mx, my]) => {
-        uniforms.mouseX.value = mx
-        uniforms.mouseY.value = my
+        uniforms.mouseX.value = mx ?? 0.5
+        uniforms.mouseY.value = my ?? 0.5
       },
       { immediate: true }
     )

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

@@ -12,6 +12,7 @@
     ReinhardToneMapping,
     Scene,
     SRGBColorSpace,
+    type ToneMapping,
   } from 'three'
   import { MeshBasicNodeMaterial, WebGPURenderer } from 'three/webgpu'
 
@@ -56,7 +57,7 @@
   let initStarted = false
   let disposed = false
 
-  const toneMappingMap: Record<string, number> = {
+  const toneMappingMap: Record<'aces' | 'reinhard' | 'cineon' | 'linear', ToneMapping> = {
     aces: ACESFilmicToneMapping,
     reinhard: ReinhardToneMapping,
     cineon: CineonToneMapping,
@@ -175,7 +176,7 @@
   )
 
   watch([width, height], ([w, h]) => {
-    if (!initialized) return
+    if (!initialized || !renderer) return
     camera.aspect = w / (h || 1)
     camera.updateProjectionMatrix()
     renderer.setSize(w, h)

package/layers/shader/app/composables/useAmbientMaterials.ts

@@ -28,7 +28,7 @@ import {
   voronoi2D,
 } from '../shaders/common/noise'
 import { cosinePalette } from '../shaders/common/palette'
-import type { FloatUniform, TSLNode, Vec3Uniform } from '../shaders/types'
+import type { ColorUniform, FloatUniform, TSLNode, Vec3Uniform } from '../shaders/types'
 
 // ============================================
 // Private helpers
@@ -368,10 +368,10 @@ export function createGradientMeshColorNode(uniforms: AmbientUniforms): TSLNode
 }
 
 export type ThemeColorUniforms = {
-  color1: Vec3Uniform
-  color2: Vec3Uniform
-  color3: Vec3Uniform
-  color4: Vec3Uniform
+  color1: ColorUniform | Vec3Uniform
+  color2: ColorUniform | Vec3Uniform
+  color3: ColorUniform | Vec3Uniform
+  color4: ColorUniform | Vec3Uniform
 }
 
 export function createThemeGradientColorNode(
@@ -448,10 +448,10 @@ export function createThemeGradientColorNode(
       add(0.7, mul(nm4, 0.3))
     )
 
-    let colorNode = mul(colors.color1, d1)
-    colorNode = add(colorNode, mul(colors.color2, d2))
-    colorNode = add(colorNode, mul(colors.color3, d3))
-    colorNode = add(colorNode, mul(colors.color4, d4))
+    let colorNode = mul(colors.color1.rgb, d1)
+    colorNode = add(colorNode, mul(colors.color2.rgb, d2))
+    colorNode = add(colorNode, mul(colors.color3.rgb, d3))
+    colorNode = add(colorNode, mul(colors.color4.rgb, d4))
 
     // Normalise first, then vignette, then intensity
     const totalWeight = add(d1, d2, d3, d4, 0.01)
@@ -555,8 +555,8 @@ export function createThemeAuroraColorNode(
     const colorDriver = add(mul(curtain2, 0.6), mul(curtain3, 0.4))
     const auroraColor = mix(colors.color1, colors.color2, colorDriver)
 
-    const skyColor = mul(colors.color1, 0.04)
-    const shimmerColor = mul(colors.color3, mul(shimmer, mul(aurora, 0.15)))
+    const skyColor = mul(colors.color1.rgb, 0.04)
+    const shimmerColor = mul(colors.color3.rgb, mul(shimmer, mul(aurora, 0.15)))
 
     return add(mix(skyColor, auroraColor, aurora), shimmerColor)
   })()
@@ -667,10 +667,10 @@ export function createThemeLavaLampColorNode(
 
     // Weighted colour blend
     const colorNode = add(
-      mul(colors.color1, w1),
-      mul(colors.color2, w2),
-      mul(colors.color3, w3),
-      mul(colors.color4, w4)
+      mul(colors.color1.rgb, w1),
+      mul(colors.color2.rgb, w2),
+      mul(colors.color3.rgb, w3),
+      mul(colors.color4.rgb, w4)
     ).div(wTotal.add(0.001))
 
     // Darken space between blobs

package/layers/shader/app/composables/useThemePreset.ts

@@ -51,8 +51,8 @@ export function useThemePreset(
     watch(
       () => [runtime.mouse.mouseX.value, runtime.mouse.mouseY.value],
       ([mx, my]) => {
-        uniforms.mouseX.value = mx
-        uniforms.mouseY.value = my
+        uniforms.mouseX.value = mx ?? 0.5
+        uniforms.mouseY.value = my ?? 0.5
       },
       { immediate: true }
     )

package/layers/shader/app/shaders/types.ts

@@ -7,7 +7,7 @@
 // This provides flexibility while maintaining code readability
 
 import type { UniformNode } from 'three/webgpu'
-import type { Vector3 } from 'three'
+import type { Color, Vector3 } from 'three'
 
 export type { TSLNode } from '../types/tsl'
 
@@ -17,5 +17,8 @@ export type FloatUniform = UniformNode<'float', number>
 /** Vec3 uniform: `uniform(new Vector3(...))` */
 export type Vec3Uniform = UniformNode<'vec3', Vector3>
 
+/** Color uniform: `uniform(new Color(...))` */
+export type ColorUniform = UniformNode<'color', Color>
+
 // Re-export common Three types
 export type { Color, Texture, Vector2, Vector3, Vector4 } from 'three'

package/layers/theme/app/components/ThemePicker/Colors.vue

@@ -1,8 +1,12 @@
 <script setup lang="ts">
+  import type { AccentColor } from '#layers/theme/app/types/theme'
+
   const appConfig = useAppConfig()
   const { activeAccent, setAccent } = useAccentColor()
 
-  const accents = computed(() => appConfig.themeLayer?.accents ?? [])
+  const accents = computed<AccentColor[]>(
+    () => (appConfig.themeLayer?.accents ?? []) as AccentColor[]
+  )
 </script>
 
 <template>

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "kmcom-nuxt-layers",
   "private": false,
-  "version": "2.2.10",
+  "version": "2.2.11",
   "description": "Composable Nuxt 4 layers for building scalable Vue applications",
   "exports": {
     "./layers/core": "./layers/core/nuxt.config.ts",