kmcom-nuxt-layers 2.2.6 → 2.2.9

package/layers/core/app/composables/useErrorLog.ts

@@ -94,9 +94,9 @@ export function useErrorLog() {
     const { externalUrl, externalToken } = config.value
 
     if (!externalUrl) {
-      process.env.NODE_ENV === 'development'
-        ? console.warn('Error logging enabled but no externalUrl configured')
-        : ''
+      if (process.env.NODE_ENV === 'development') {
+        console.warn('Error logging enabled but no externalUrl configured')
+      }
       return
     }
 
@@ -118,10 +118,8 @@ export function useErrorLog() {
       })
     } catch (loggingError) {
       // Don't let logging errors crash the app
-      if (import.meta.dev) {
-        process.env.NODE_ENV === 'development'
-          ? console.error('Failed to send error to external service:', loggingError)
-          : ''
+      if (import.meta.dev && process.env.NODE_ENV === 'development') {
+        console.error('Failed to send error to external service:', loggingError)
       }
     }
   }
@@ -130,8 +128,8 @@ export function useErrorLog() {
    * Log a warning (non-critical error)
    */
   const logWarning = (message: string, context?: ErrorContext) => {
-    if (config.value.logToConsole && import.meta.dev) {
-      process.env.NODE_ENV === 'development' ? console.warn('⚠️  Warning:', message, context) : ''
+    if (config.value.logToConsole && import.meta.dev && process.env.NODE_ENV === 'development') {
+      console.warn('⚠️  Warning:', message, context)
     }
   }
 
@@ -139,8 +137,8 @@ export function useErrorLog() {
    * Log info (for debugging)
    */
   const logInfo = (message: string, data?: unknown) => {
-    if (config.value.logToConsole && import.meta.dev) {
-      process.env.NODE_ENV === 'development' ? console.log('ℹ️  Info:', message, data) : ''
+    if (config.value.logToConsole && import.meta.dev && process.env.NODE_ENV === 'development') {
+      console.log('ℹ️  Info:', message, data)
     }
   }
 

package/layers/core/app/utils/helpers.ts

@@ -18,30 +18,32 @@ export function safeJsonParse<T>(json: string, fallback: T): T {
 /**
  * Debounce function execution
  */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
 export function debounce<T extends (...args: any[]) => any>(
   fn: T,
   delay: number
 ): (...args: Parameters<T>) => void {
   let timeoutId: ReturnType<typeof setTimeout>
 
-  return function (this: any, ...args: Parameters<T>) {
+  return function (...args: Parameters<T>) {
     clearTimeout(timeoutId)
-    timeoutId = setTimeout(() => fn.apply(this, args), delay)
+    timeoutId = setTimeout(() => fn(...args), delay)
   }
 }
 
 /**
  * Throttle function execution
  */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
 export function throttle<T extends (...args: any[]) => any>(
   fn: T,
   limit: number
 ): (...args: Parameters<T>) => void {
   let inThrottle: boolean
 
-  return function (this: any, ...args: Parameters<T>) {
+  return function (...args: Parameters<T>) {
     if (!inThrottle) {
-      fn.apply(this, args)
+      fn(...args)
       inThrottle = true
       setTimeout(() => (inThrottle = false), limit)
     }
@@ -68,7 +70,7 @@ export async function retry<T>(
 ): Promise<T> {
   const { maxAttempts = 3, delay = 1000, backoff = 2 } = options
 
-  let lastError: Error
+  let lastError: Error = new Error('All retry attempts failed')
 
   for (let attempt = 1; attempt <= maxAttempts; attempt++) {
     try {
@@ -83,7 +85,7 @@ export async function retry<T>(
     }
   }
 
-  throw lastError!
+  throw lastError
 }
 
 /**
@@ -123,8 +125,8 @@ export function formatBytes(bytes: number, decimals = 2): string {
 export function deepClone<T>(obj: T): T {
   if (obj === null || typeof obj !== 'object') return obj
 
-  if (obj instanceof Date) return new Date(obj.getTime()) as any
-  if (obj instanceof Array) return obj.map((item) => deepClone(item)) as any
+  if (obj instanceof Date) return new Date(obj.getTime()) as unknown as T
+  if (obj instanceof Array) return obj.map((item) => deepClone(item)) as unknown as T
   if (obj instanceof Object) {
     const clonedObj = {} as T
     for (const key in obj) {
@@ -182,8 +184,8 @@ export function truncate(str: string, length: number, suffix = '...'): string {
 /**
  * Remove undefined/null values from object
  */
-export function removeEmpty<T extends Record<string, any>>(obj: T): Partial<T> {
-  const result: any = {}
+export function removeEmpty<T extends Record<string, unknown>>(obj: T): Partial<T> {
+  const result: Partial<T> = {}
 
   for (const key in obj) {
     if (obj[key] !== undefined && obj[key] !== null) {
@@ -214,7 +216,7 @@ export function groupBy<T>(array: T[], key: keyof T): Record<string, T[]> {
 /**
  * Pick specific keys from object
  */
-export function pick<T extends Record<string, any>, K extends keyof T>(
+export function pick<T extends Record<string, unknown>, K extends keyof T>(
   obj: T,
   keys: K[]
 ): Pick<T, K> {
@@ -232,7 +234,7 @@ export function pick<T extends Record<string, any>, K extends keyof T>(
 /**
  * Omit specific keys from object
  */
-export function omit<T extends Record<string, any>, K extends keyof T>(
+export function omit<T extends Record<string, unknown>, K extends keyof T>(
   obj: T,
   keys: K[]
 ): Omit<T, K> {

package/layers/core/nuxt.config.ts

@@ -7,6 +7,7 @@ export default defineNuxtConfig({
   alias: {
     '#layers/core': import.meta.dirname,
     '#layers/core/types': `${import.meta.dirname}/app/types`,
+    '#types': `${import.meta.dirname}/../../types`,
   },
 
   // Base modules (always loaded)

package/layers/feeds/app/plugins/feed-head.ts

@@ -1,8 +1,7 @@
 export default defineNuxtPlugin({
   name: 'feeds:feed-head',
   setup() {
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    const appConfig = useAppConfig() as any
+    const appConfig = useAppConfig()
     const site = appConfig.site ?? {}
     const feedConfig = appConfig.feedsLayer?.feed ?? {}
     const collections: string[] = feedConfig.collections ?? ['blog']

package/layers/feeds/package.json

@@ -10,7 +10,8 @@
     "dev:prepare": "nuxt prepare .playground",
     "build": "FEEDS_STANDALONE=true nuxi build",
     "generate": "FEEDS_STANDALONE=true nuxi generate",
-    "preview": "nuxt preview .playground"
+    "preview": "nuxt preview .playground",
+    "lint": "eslint ."
   },
   "dependencies": {
     "feed": "catalog:"

package/layers/feeds/public/feed/style.css

@@ -0,0 +1,256 @@
+/* XSLT feed page stylesheet
+ * Served at /feed/style.css — referenced from the RSS <?xml-stylesheet?> PI.
+ * Uses Nuxt UI v4 CSS custom property naming conventions with light/dark fallbacks.
+ * Variables are resolved from the Nuxt UI theme when the stylesheet is loaded from the same
+ * origin; otherwise the fallbacks provide sensible standalone defaults.
+ */
+
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+
+:root {
+  --feed-bg: var(--ui-bg, #ffffff);
+  --feed-bg-elevated: var(--ui-bg-elevated, #f8fafc);
+  --feed-bg-accented: var(--ui-bg-accented, #f1f5f9);
+  --feed-border: var(--ui-border, #e2e8f0);
+  --feed-text: var(--ui-text, #0f172a);
+  --feed-text-muted: var(--ui-text-muted, #64748b);
+  --feed-text-toned: var(--ui-text-toned, #475569);
+  --feed-primary: var(--ui-color-primary-500, oklch(62.3% 0.214 259.5));
+  --feed-primary-text: var(--ui-color-primary-600, oklch(54.6% 0.214 259.5));
+  --feed-primary-bg: var(--ui-color-primary-50, oklch(97% 0.03 259.5));
+  --feed-radius: var(--ui-radius, 0.375rem);
+  --feed-font: var(--font-sans, ui-sans-serif, system-ui, -apple-system, sans-serif);
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --feed-bg: var(--ui-bg, #020617);
+    --feed-bg-elevated: var(--ui-bg-elevated, #0f172a);
+    --feed-bg-accented: var(--ui-bg-accented, #1e293b);
+    --feed-border: var(--ui-border, #1e293b);
+    --feed-text: var(--ui-text, #f8fafc);
+    --feed-text-muted: var(--ui-text-muted, #94a3b8);
+    --feed-text-toned: var(--ui-text-toned, #cbd5e1);
+    --feed-primary: var(--ui-color-primary-400, oklch(71% 0.18 259.5));
+    --feed-primary-text: var(--ui-color-primary-400, oklch(71% 0.18 259.5));
+    --feed-primary-bg: var(--ui-color-primary-950, oklch(22% 0.06 259.5));
+  }
+}
+
+html {
+  color-scheme: light dark;
+}
+
+body {
+  margin: 0;
+  background-color: var(--feed-bg);
+  padding: 0;
+  color: var(--feed-text);
+  font-size: 1rem;
+  line-height: 1.6;
+  font-family: var(--feed-font);
+  -webkit-font-smoothing: antialiased;
+}
+
+a {
+  color: var(--feed-primary-text);
+  text-decoration: none;
+}
+
+a:hover {
+  text-decoration: underline;
+}
+
+/* ─── Layout ─────────────────────────────────────────────────────────────── */
+
+.feed-container {
+  margin: 0 auto;
+  padding: 0 1.5rem 5rem;
+  max-width: 52rem;
+}
+
+/* ─── Header ─────────────────────────────────────────────────────────────── */
+
+.feed-header {
+  margin-bottom: 0.5rem;
+  border-bottom: 1px solid var(--feed-border);
+  padding: 5rem 0 4.5rem;
+}
+
+.feed-eyebrow {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.375rem;
+  margin-bottom: 1rem;
+  border-radius: 9999px;
+  background-color: var(--feed-primary-bg);
+  padding: 0.25rem 0.625rem;
+  color: var(--feed-primary-text);
+  font-weight: 600;
+  font-size: 0.6875rem;
+  letter-spacing: 0.07em;
+  text-transform: uppercase;
+}
+
+.feed-eyebrow svg {
+  flex-shrink: 0;
+  width: 0.875rem;
+  height: 0.875rem;
+}
+
+.feed-title {
+  margin: 0 0 0.5rem;
+  color: var(--feed-text);
+  font-weight: 700;
+  font-size: 1.875rem;
+  line-height: 1.2;
+  letter-spacing: -0.025em;
+}
+
+.feed-title a {
+  color: inherit;
+}
+
+.feed-title a:hover {
+  opacity: 0.8;
+  text-decoration: none;
+}
+
+.feed-description {
+  margin: 0 0 1.25rem;
+  max-width: 38rem;
+  color: var(--feed-text-muted);
+  font-size: 1rem;
+}
+
+.feed-meta {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 1rem;
+  color: var(--feed-text-muted);
+  font-size: 0.8125rem;
+}
+
+.feed-meta-link {
+  color: var(--feed-primary-text);
+  font-weight: 500;
+}
+
+.feed-header-actions {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  align-items: center;
+  gap: 1rem;
+  margin-top: 1.5rem;
+}
+
+.feed-subscribe {
+  display: inline-flex;
+  flex-shrink: 0;
+  align-items: center;
+  gap: 0.4375rem;
+  transition: opacity 0.15s ease;
+  cursor: pointer;
+  border-radius: var(--feed-radius);
+  background-color: var(--feed-primary);
+  padding: 0.5rem 1.125rem;
+  color: #ffffff;
+  font-weight: 600;
+  font-size: 0.875rem;
+  line-height: 1;
+  text-decoration: none;
+}
+
+.feed-subscribe:hover {
+  opacity: 0.85;
+  color: #ffffff;
+  text-decoration: none;
+}
+
+.feed-subscribe svg {
+  flex-shrink: 0;
+  width: 0.9375rem;
+  height: 0.9375rem;
+}
+
+/* ─── Items ──────────────────────────────────────────────────────────────── */
+
+.feed-items {
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.feed-item {
+  border-bottom: 1px solid var(--feed-border);
+  padding: 1.5rem 0;
+}
+
+.feed-item:last-child {
+  border-bottom: none;
+}
+
+.feed-item-title {
+  margin: 0 0 0.375rem;
+  font-weight: 600;
+  font-size: 1.0625rem;
+  line-height: 1.4;
+  letter-spacing: -0.01em;
+}
+
+.feed-item-title a {
+  color: var(--feed-text);
+}
+
+.feed-item-title a:hover {
+  color: var(--feed-primary-text);
+  text-decoration: none;
+}
+
+.feed-item-meta {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 0.4rem;
+  margin-bottom: 0.625rem;
+  color: var(--feed-text-muted);
+  font-size: 0.8125rem;
+}
+
+.feed-item-separator {
+  opacity: 0.4;
+}
+
+.feed-item-description {
+  display: -webkit-box;
+  margin: 0;
+  -webkit-line-clamp: 3;
+  color: var(--feed-text-toned);
+  font-size: 0.9375rem;
+  line-height: 1.6;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+}
+
+.feed-tags {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.375rem;
+  margin-top: 0.75rem;
+}
+
+.feed-tag {
+  border: 1px solid var(--feed-border);
+  border-radius: 9999px;
+  background-color: var(--feed-bg-accented);
+  padding: 0.125rem 0.5rem;
+  color: var(--feed-text-muted);
+  font-weight: 500;
+  font-size: 0.75rem;
+}

package/layers/feeds/server/routes/feed/discovery.get.ts

@@ -1,6 +1,5 @@
 export default defineEventHandler((event) => {
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  const appConfig = useAppConfig() as any
+  const appConfig = useAppConfig()
   const feedConfig = appConfig.feedsLayer?.feed ?? {}
   const collections: string[] = feedConfig.collections ?? ['blog']
 

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

@@ -3,14 +3,15 @@ import type { H3Event } from 'h3'
 
 import type { FeedItem } from './types'
 
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-type AnyContent = Record<string, any>
+type AnyContent = Record<string, unknown>
 
 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()
 

package/layers/forms/app/components/Form/Field.vue

@@ -5,12 +5,12 @@
   const {
     type = 'text',
     name,
-    label,
+    label = undefined,
     required = false,
     size = 'md',
-    placeholder,
-    icon,
-    class: className,
+    placeholder = undefined,
+    icon = undefined,
+    class: className = undefined,
   } = defineProps<{
     /** Field type determines validation, icon, and input behavior */
     type?: FieldType

package/layers/forms/app/types/index.ts

@@ -0,0 +1 @@
+export type * from './fields'

package/layers/forms/package.json

@@ -6,7 +6,8 @@
   "scripts": {
     "dev": "nuxi dev",
     "dev:playground": "PLAYGROUND_LAYERS=core,mailer,forms pnpm -F playground dev",
-    "typecheck": "vue-tsc --noEmit -p ../../tsconfig.typecheck.json"
+    "typecheck": "vue-tsc --noEmit -p ../../tsconfig.typecheck.json",
+    "lint": "eslint ."
   },
   "dependencies": {
     "zod": "catalog:conflicts_conflicts_zod_h4_3_6_h4_4_3"

package/layers/layout/app/components/Layout/Grid/Item.vue

@@ -65,26 +65,40 @@
     aspect?: AspectRatio
   }
 
-  const props = defineProps<Props>()
-
-  const { as = 'div' } = props
+  const {
+    preset: presetProp = undefined,
+    as = 'div',
+    colStart: colStartProp = undefined,
+    colSpan: colSpanProp = undefined,
+    rowStart: rowStartProp = undefined,
+    rowSpan: rowSpanProp = undefined,
+    align: alignProp = undefined,
+    justify: justifyProp = undefined,
+    container: containerProp = undefined,
+    gap: gapProp = undefined,
+    density: densityProp = undefined,
+    z = undefined,
+    layer = undefined,
+    bleed = undefined,
+    aspect = undefined,
+  } = defineProps<Props>()
 
   // Get preset configuration if preset prop is provided
   const { getPreset } = useGridConfig()
-  const presetConfig = computed(() => (props.preset ? getPreset(props.preset) : undefined))
+  const presetConfig = computed(() => (presetProp ? getPreset(presetProp) : undefined))
 
   // Merge preset values with explicit props (explicit props take precedence)
-  const colStart = computed(() => props.colStart ?? presetConfig.value?.colStart)
-  const colSpan = computed(() => props.colSpan ?? presetConfig.value?.colSpan ?? 'full')
-  const rowStart = computed(() => props.rowStart ?? presetConfig.value?.rowStart)
-  const rowSpan = computed(() => props.rowSpan ?? presetConfig.value?.rowSpan ?? 1)
+  const colStart = computed(() => colStartProp ?? presetConfig.value?.colStart)
+  const colSpan = computed(() => colSpanProp ?? presetConfig.value?.colSpan ?? 'full')
+  const rowStart = computed(() => rowStartProp ?? presetConfig.value?.rowStart)
+  const rowSpan = computed(() => rowSpanProp ?? presetConfig.value?.rowSpan ?? 1)
 
   // Preset-aware alignment computed refs
-  const align = computed(() => props.align ?? presetConfig.value?.align)
-  const justify = computed(() => props.justify ?? presetConfig.value?.justify)
-  const container = computed(() => props.container ?? presetConfig.value?.container)
-  const gap = computed(() => props.gap ?? presetConfig.value?.gap)
-  const density = computed(() => props.density ?? presetConfig.value?.density)
+  const align = computed(() => alignProp ?? presetConfig.value?.align)
+  const justify = computed(() => justifyProp ?? presetConfig.value?.justify)
+  const container = computed(() => containerProp ?? presetConfig.value?.container)
+  const gap = computed(() => gapProp ?? presetConfig.value?.gap)
+  const density = computed(() => densityProp ?? presetConfig.value?.density)
 
   const layerZIndex: Record<LayerName, number> = {
     back: 0,
@@ -133,15 +147,15 @@
     const rowStartVal = getDefaultValue(rowStart.value, undefined)
     const rowSpanVal = getDefaultValue(rowSpan.value, 1)
 
-    if (props.bleed) {
-      if (props.bleed === 'both') {
+    if (bleed) {
+      if (bleed === 'both') {
         styles.gridColumn = '1 / -1'
         styles.marginInline = 'calc(-1 * var(--grid-padding))'
-      } else if (props.bleed === 'left') {
+      } else if (bleed === 'left') {
         const spanNum = typeof colSpanVal === 'number' ? colSpanVal : undefined
         styles.gridColumn = spanNum ? `1 / span ${spanNum}` : '1 / -1'
         styles.marginInlineStart = 'calc(-1 * var(--grid-padding))'
-      } else if (props.bleed === 'right') {
+      } else if (bleed === 'right') {
         styles.gridColumn = `${colStartVal ?? 'auto'} / -1`
         styles.marginInlineEnd = 'calc(-1 * var(--grid-padding))'
       }
@@ -218,7 +232,7 @@
     }
 
     // Z-index
-    const zIndex = props.z ?? (props.layer ? layerZIndex[props.layer] : undefined)
+    const zIndex = z ?? (layer ? layerZIndex[layer] : undefined)
     if (zIndex !== undefined) styles.zIndex = String(zIndex)
 
     return styles
@@ -227,7 +241,7 @@
   const classes = computed(() => {
     const classList: string[] = ['gi-placed', '@container', '@container/item']
 
-    if (props.aspect) classList.push(aspectClasses[props.aspect])
+    if (aspect) classList.push(aspectClasses[aspect])
     if (container.value) classList.push(`layout-container-${container.value}`)
 
     return classList.join(' ')

package/layers/layout/app/components/Layout/Page/Container.vue

@@ -38,23 +38,23 @@
    * </PageContainer>
    */
 
-  interface Props {
-    title: string
-    description?: string
-    showHeader?: boolean
-    headerPreset?: string
-    layout?: 'grid' | 'upage'
-    back?: string
-  }
+  defineOptions({ inheritAttrs: false })
 
   const {
     title,
-    description,
+    description = undefined,
     showHeader = true,
     headerPreset = 'centered',
     layout = 'grid',
-    back,
-  } = defineProps<Props>()
+    back = undefined,
+  } = defineProps<{
+    title: string
+    description?: string
+    showHeader?: boolean
+    headerPreset?: string
+    layout?: 'grid' | 'upage'
+    back?: string
+  }>()
 
   // Set page metadata for SEO and browser tab
   useHead({

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

@@ -21,7 +21,7 @@
     back?: string
   }
 
-  defineProps<Props>()
+  const { title, description = undefined, back = undefined } = defineProps<Props>()
 </script>
 
 <template>

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

@@ -40,7 +40,7 @@
     showHeader?: boolean
   }
 
-  const { title, description, showHeader = false } = defineProps<Props>()
+  const { title, description = undefined, showHeader = false } = defineProps<Props>()
 
   useHead({
     title,

package/layers/layout/app/components/Layout/Section/Gallery.vue

@@ -29,7 +29,12 @@
     fullHeight?: boolean
   }
 
-  const { items, columns = 3, itemRowSpan = 4, fullHeight = false } = defineProps<Props<T>>()
+  const {
+    items = undefined,
+    columns = 3,
+    itemRowSpan = 4,
+    fullHeight = false,
+  } = defineProps<Props<T>>()
 
   // Responsive column spans that work across 6/12/18 column grids
   const columnSpan = computed(() => {

package/layers/layout/app/components/Layout/Section/Title.vue

@@ -20,7 +20,7 @@
     description?: string
   }
 
-  defineProps<Props>()
+  const { title, description = undefined } = defineProps<Props>()
 </script>
 
 <template>

package/layers/layout/app/types/index.ts

@@ -0,0 +1 @@
+export type * from './layouts'

package/layers/layout/package.json

@@ -9,6 +9,7 @@
     "dev:prepare": "nuxt prepare .playground",
     "build": "nuxt build .playground",
     "generate": "nuxt generate .playground",
-    "preview": "nuxt preview .playground"
+    "preview": "nuxt preview .playground",
+    "lint": "eslint ."
   }
 }

package/layers/mailer/app/types/index.ts

@@ -0,0 +1 @@
+export type * from './mailer'