@uniweb/build 0.1.14 → 0.1.15

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniweb/build",
-  "version": "0.1.14",
+  "version": "0.1.15",
   "description": "Build tooling for the Uniweb Component Web Platform",
   "type": "module",
   "exports": {
@@ -59,7 +59,7 @@
     "@tailwindcss/vite": "^4.0.0",
     "@vitejs/plugin-react": "^4.0.0 || ^5.0.0",
     "vite-plugin-svgr": "^4.0.0",
-    "@uniweb/core": "0.1.6"
+    "@uniweb/core": "0.1.7"
   },
   "peerDependenciesMeta": {
     "vite": {

package/src/foundation/config.js

@@ -24,6 +24,7 @@
  */
 
 import { resolve } from 'node:path'
+import { foundationPlugin } from '../vite-foundation-plugin.js'
 
 /**
  * Default externals for foundations
@@ -45,7 +46,7 @@ const DEFAULT_EXTERNALS = [
  * Create a complete Vite configuration for a Uniweb foundation
  *
  * @param {Object} [options={}] - Configuration options
- * @param {string} [options.entry] - Entry point path (default: 'src/entry-runtime.js')
+ * @param {string} [options.entry] - Entry point path (default: 'src/_entry.generated.js')
  * @param {string} [options.fileName] - Output file name (default: 'foundation')
  * @param {string[]} [options.externals] - Additional packages to externalize
  * @param {boolean} [options.includeDefaultExternals] - Include default externals (default: true)
@@ -57,7 +58,7 @@ const DEFAULT_EXTERNALS = [
  */
 export async function defineFoundationConfig(options = {}) {
   const {
-    entry = 'src/entry-runtime.js',
+    entry = 'src/_entry.generated.js',
     fileName = 'foundation',
     externals: additionalExternals = [],
     includeDefaultExternals = true,
@@ -101,7 +102,9 @@ export async function defineFoundationConfig(options = {}) {
   }
 
   // Build the plugins array
+  // foundationPlugin handles entry generation and schema building
   const plugins = [
+    foundationPlugin({ srcDir: 'src' }),
     tailwind && tailwindcss(),
     react(),
     svgr(),

package/src/generate-entry.js

@@ -15,15 +15,15 @@ import {
 } from './schema.js'
 
 /**
- * Detect site configuration file (for custom Layout, etc.)
- * Looks for: src/site.js, src/site.jsx, src/site/index.js, src/site/index.jsx
+ * Detect runtime configuration file (for custom Layout, props, etc.)
+ * Looks for: src/runtime.js, src/runtime.jsx, src/runtime/index.js, src/runtime/index.jsx
  */
-function detectSiteConfig(srcDir) {
+function detectRuntimeExports(srcDir) {
   const candidates = [
-    { path: 'site.js', ext: 'js' },
-    { path: 'site.jsx', ext: 'jsx' },
-    { path: 'site/index.js', ext: 'js' },
-    { path: 'site/index.jsx', ext: 'jsx' },
+    { path: 'runtime.js', ext: 'js' },
+    { path: 'runtime.jsx', ext: 'jsx' },
+    { path: 'runtime/index.js', ext: 'js' },
+    { path: 'runtime/index.jsx', ext: 'jsx' },
   ]
 
   for (const { path, ext } of candidates) {
@@ -34,23 +34,36 @@ function detectSiteConfig(srcDir) {
   return null
 }
 
+/**
+ * Detect CSS file
+ * Looks for: src/styles.css, src/index.css
+ */
+function detectCssFile(srcDir) {
+  const candidates = ['styles.css', 'index.css']
+  for (const file of candidates) {
+    if (existsSync(join(srcDir, file))) {
+      return `./${file}`
+    }
+  }
+  return null
+}
+
 /**
  * Generate the entry point source code
  */
 function generateEntrySource(componentNames, runtimeConfig, options = {}) {
-  const { includeCss = true, cssPath = './index.css', componentExtensions = {}, siteConfig = null } = options
+  const { cssPath = null, componentExtensions = {}, runtimeExports = null } = options
 
   const imports = []
-  const exports = []
 
   // CSS import
-  if (includeCss) {
+  if (cssPath) {
     imports.push(`import '${cssPath}'`)
   }
 
-  // Site config import (for custom Layout, etc.)
-  if (siteConfig) {
-    imports.push(`import { site } from '${siteConfig.path}'`)
+  // Runtime exports import (for custom Layout, props, etc.)
+  if (runtimeExports) {
+    imports.push(`import runtime from '${runtimeExports.path}'`)
   }
 
   // Component imports (use detected extension or default to .js)
@@ -130,10 +143,10 @@ export function getSchema(name) {
     ? `\n// Named exports for direct imports\nexport { ${componentNames.join(', ')} }`
     : ''
 
-  // Site config export (for custom Layout, etc.)
-  const siteExport = siteConfig
-    ? `\n// Site configuration (Layout, etc.)\nexport { site }`
-    : `\n// No site configuration provided\nexport const site = null`
+  // Runtime exports (Layout, props, etc.)
+  const runtimeExport = runtimeExports
+    ? `\n// Runtime exports (Layout, props, etc.)\nexport { runtime }`
+    : `\n// No runtime exports provided\nexport const runtime = null`
 
   return `// Auto-generated foundation entry point
 // DO NOT EDIT - This file is regenerated during build
@@ -144,7 +157,7 @@ ${componentsObj}
 ${runtimeConfigBlock}
 ${exportFunctions}
 ${namedExports}
-${siteExport}
+${runtimeExport}
 `
 }
 
@@ -194,17 +207,17 @@ export async function generateEntryPoint(srcDir, outputPath = null) {
     }
   }
 
-  // Check if CSS exists
-  const cssExists = existsSync(join(srcDir, 'index.css'))
+  // Check for CSS file
+  const cssPath = detectCssFile(srcDir)
 
-  // Check for site config (custom Layout, etc.)
-  const siteConfig = detectSiteConfig(srcDir)
+  // Check for runtime exports (custom Layout, props, etc.)
+  const runtimeExports = detectRuntimeExports(srcDir)
 
   // Generate source
   const source = generateEntrySource(componentNames, runtimeConfig, {
-    includeCss: cssExists,
+    cssPath,
     componentExtensions,
-    siteConfig,
+    runtimeExports,
   })
 
   // Write to file
@@ -214,15 +227,15 @@ export async function generateEntryPoint(srcDir, outputPath = null) {
 
   console.log(`Generated entry point: ${output}`)
   console.log(`  - ${componentNames.length} components: ${componentNames.join(', ')}`)
-  if (siteConfig) {
-    console.log(`  - Site config found: ${siteConfig.path}`)
+  if (runtimeExports) {
+    console.log(`  - Runtime exports found: ${runtimeExports.path}`)
   }
 
   return {
     outputPath: output,
     componentNames,
     runtimeConfig,
-    siteConfig,
+    runtimeExports,
   }
 }
 

package/src/prerender.js

@@ -108,8 +108,9 @@ export async function prerenderSite(siteDir, options = {}) {
   const uniweb = createUniweb(siteContent)
   uniweb.setFoundation(foundation)
 
-  if (foundation.config || foundation.site) {
-    uniweb.setFoundationConfig(foundation.config || foundation.site)
+  // Check for foundation config (runtime is the new name, config/site are legacy)
+  if (foundation.runtime || foundation.config || foundation.site) {
+    uniweb.setFoundationConfig(foundation.runtime || foundation.config || foundation.site)
   }
 
   // Pre-render each page
@@ -187,8 +188,8 @@ function DefaultLayout({ header, body, footer }) {
  * Supports foundation-provided custom Layout via site.Layout
  */
 function Layout({ page, website, foundation }) {
-  // Check if foundation provides a custom Layout
-  const RemoteLayout = foundation.site?.Layout || null
+  // Check if foundation provides a custom Layout (runtime is the new name, site is legacy)
+  const RemoteLayout = foundation.runtime?.Layout || foundation.site?.Layout || null
 
   // Get block groups from page
   const headerBlocks = page.getHeaderBlocks()

package/src/schema.js

@@ -5,169 +5,24 @@
  * runtime-relevant configuration.
  */
 
-import { readdir, readFile } from 'node:fs/promises'
+import { readdir } from 'node:fs/promises'
 import { existsSync } from 'node:fs'
 import { join, basename } from 'node:path'
 import { pathToFileURL } from 'node:url'
 
-// Meta file names in order of preference
-const META_FILE_NAMES = ['meta.js', 'config.js', 'config.yml', 'meta.yml']
+// Meta file name (standardized to meta.js)
+const META_FILE_NAME = 'meta.js'
 
 // Keys that should be extracted for runtime (embedded in foundation.js)
 const RUNTIME_KEYS = ['input', 'props']
 
 /**
- * Simple YAML parser for backwards compatibility
- * Supports basic key-value, nested objects, and arrays
- */
-function parseYaml(content) {
-  const lines = content.split('\n')
-  return parseYamlLines(lines, 0).value
-}
-
-function getIndent(line) {
-  const match = line.match(/^(\s*)/)
-  return match ? match[1].length : 0
-}
-
-function parseYamlValue(value) {
-  const trimmed = value.trim()
-  if (!trimmed) return null
-  if ((trimmed.startsWith('"') && trimmed.endsWith('"')) ||
-      (trimmed.startsWith("'") && trimmed.endsWith("'"))) {
-    return trimmed.slice(1, -1)
-  }
-  if (trimmed === 'true') return true
-  if (trimmed === 'false') return false
-  if (!isNaN(Number(trimmed)) && trimmed !== '') return Number(trimmed)
-  return trimmed
-}
-
-function parseYamlLines(lines, startIndex, baseIndent = 0) {
-  const result = {}
-  let i = startIndex
-
-  while (i < lines.length) {
-    const line = lines[i]
-    const trimmed = line.trim()
-
-    if (!trimmed || trimmed.startsWith('#')) {
-      i++
-      continue
-    }
-
-    const indent = getIndent(line)
-    if (indent < baseIndent && i > startIndex) break
-    if (trimmed.startsWith('- ')) {
-      i++
-      continue
-    }
-
-    const colonIndex = trimmed.indexOf(':')
-    if (colonIndex === -1) {
-      i++
-      continue
-    }
-
-    const key = trimmed.slice(0, colonIndex).trim()
-    const valueAfterColon = trimmed.slice(colonIndex + 1).trim()
-
-    const nextLine = lines[i + 1]
-    const nextTrimmed = nextLine?.trim()
-    const nextIndent = nextLine ? getIndent(nextLine) : 0
-
-    if (nextTrimmed?.startsWith('- ') && nextIndent > indent) {
-      const arrayResult = parseYamlArray(lines, i + 1, nextIndent)
-      result[key] = arrayResult.value
-      i = arrayResult.endIndex
-    } else if (!valueAfterColon && nextIndent > indent) {
-      const nestedResult = parseYamlLines(lines, i + 1, nextIndent)
-      result[key] = nestedResult.value
-      i = nestedResult.endIndex
-    } else {
-      result[key] = parseYamlValue(valueAfterColon)
-      i++
-    }
-  }
-
-  return { value: result, endIndex: i }
-}
-
-function parseYamlArray(lines, startIndex, baseIndent) {
-  const result = []
-  let i = startIndex
-
-  while (i < lines.length) {
-    const line = lines[i]
-    const trimmed = line.trim()
-
-    if (!trimmed || trimmed.startsWith('#')) {
-      i++
-      continue
-    }
-
-    const indent = getIndent(line)
-    if (indent < baseIndent) break
-
-    if (trimmed.startsWith('- ')) {
-      const afterDash = trimmed.slice(2)
-      const colonIndex = afterDash.indexOf(':')
-
-      if (colonIndex !== -1) {
-        const key = afterDash.slice(0, colonIndex).trim()
-        const value = afterDash.slice(colonIndex + 1).trim()
-        const obj = { [key]: parseYamlValue(value) }
-        const itemIndent = indent + 2
-        i++
-
-        while (i < lines.length) {
-          const propLine = lines[i]
-          const propTrimmed = propLine?.trim()
-
-          if (!propTrimmed || propTrimmed.startsWith('#')) {
-            i++
-            continue
-          }
-
-          const propIndent = getIndent(propLine)
-          if (propIndent < itemIndent || propTrimmed.startsWith('- ')) break
-
-          const propColonIndex = propTrimmed.indexOf(':')
-          if (propColonIndex !== -1) {
-            const propKey = propTrimmed.slice(0, propColonIndex).trim()
-            const propValue = propTrimmed.slice(propColonIndex + 1).trim()
-            obj[propKey] = parseYamlValue(propValue)
-          }
-          i++
-        }
-
-        result.push(obj)
-      } else {
-        result.push(parseYamlValue(afterDash))
-        i++
-      }
-    } else {
-      break
-    }
-  }
-
-  return { value: result, endIndex: i }
-}
-
-/**
- * Load a meta file (JS or YAML)
+ * Load a meta.js file via dynamic import
  */
 async function loadMetaFile(filePath) {
-  if (filePath.endsWith('.js')) {
-    // Dynamic import for JS files
-    const fileUrl = pathToFileURL(filePath).href
-    const module = await import(fileUrl)
-    return module.default
-  } else {
-    // Parse YAML
-    const content = await readFile(filePath, 'utf-8')
-    return parseYaml(content)
-  }
+  const fileUrl = pathToFileURL(filePath).href
+  const module = await import(fileUrl)
+  return module.default
 }
 
 /**
@@ -175,37 +30,33 @@ async function loadMetaFile(filePath) {
  * Returns null if no meta file found
  */
 export async function loadComponentMeta(componentDir) {
-  for (const fileName of META_FILE_NAMES) {
-    const filePath = join(componentDir, fileName)
-    if (existsSync(filePath)) {
-      try {
-        const meta = await loadMetaFile(filePath)
-        return { meta, fileName, filePath }
-      } catch (error) {
-        console.warn(`Warning: Failed to load ${filePath}:`, error.message)
-        return null
-      }
-    }
+  const filePath = join(componentDir, META_FILE_NAME)
+  if (!existsSync(filePath)) {
+    return null
+  }
+  try {
+    const meta = await loadMetaFile(filePath)
+    return { meta, fileName: META_FILE_NAME, filePath }
+  } catch (error) {
+    console.warn(`Warning: Failed to load ${filePath}:`, error.message)
+    return null
   }
-  return null
 }
 
 /**
  * Load foundation-level meta file
  */
 export async function loadFoundationMeta(srcDir) {
-  for (const fileName of META_FILE_NAMES) {
-    const filePath = join(srcDir, fileName)
-    if (existsSync(filePath)) {
-      try {
-        return await loadMetaFile(filePath)
-      } catch (error) {
-        console.warn(`Warning: Failed to load foundation meta ${filePath}:`, error.message)
-        return {}
-      }
-    }
+  const filePath = join(srcDir, META_FILE_NAME)
+  if (!existsSync(filePath)) {
+    return {}
+  }
+  try {
+    return await loadMetaFile(filePath)
+  } catch (error) {
+    console.warn(`Warning: Failed to load foundation meta ${filePath}:`, error.message)
+    return {}
   }
-  return {}
 }
 
 /**

package/src/site/content-collector.js

@@ -381,6 +381,71 @@ async function processPage(pagePath, pageName, siteRoot) {
   }
 }
 
+/**
+ * Recursively collect pages from a directory
+ *
+ * @param {string} dirPath - Directory to scan
+ * @param {string} routePrefix - Route prefix for nested pages
+ * @param {string} siteRoot - Site root directory for asset resolution
+ * @returns {Promise<Object>} { pages, assetCollection, header, footer, left, right }
+ */
+async function collectPagesRecursive(dirPath, routePrefix, siteRoot) {
+  const entries = await readdir(dirPath)
+  const pages = []
+  let assetCollection = {
+    assets: {},
+    hasExplicitPoster: new Set(),
+    hasExplicitPreview: new Set()
+  }
+  let header = null
+  let footer = null
+  let left = null
+  let right = null
+
+  for (const entry of entries) {
+    const entryPath = join(dirPath, entry)
+    const stats = await stat(entryPath)
+
+    if (!stats.isDirectory()) continue
+
+    // Build the page name/route
+    const pageName = routePrefix ? `${routePrefix}/${entry}` : entry
+
+    // Process this directory as a page
+    const result = await processPage(entryPath, pageName, siteRoot)
+    if (result) {
+      const { page, assetCollection: pageAssets } = result
+      assetCollection = mergeAssetCollections(assetCollection, pageAssets)
+
+      // Handle special pages (layout areas) - only at root level
+      if (!routePrefix) {
+        if (entry === '@header' || page.route === '/@header') {
+          header = page
+        } else if (entry === '@footer' || page.route === '/@footer') {
+          footer = page
+        } else if (entry === '@left' || page.route === '/@left') {
+          left = page
+        } else if (entry === '@right' || page.route === '/@right') {
+          right = page
+        } else {
+          pages.push(page)
+        }
+      } else {
+        pages.push(page)
+      }
+    }
+
+    // Recursively process subdirectories (but not special @ directories)
+    if (!entry.startsWith('@')) {
+      const subResult = await collectPagesRecursive(entryPath, pageName, siteRoot)
+      pages.push(...subResult.pages)
+      assetCollection = mergeAssetCollections(assetCollection, subResult.assetCollection)
+    }
+  }
+
+  return { pages, assetCollection, header, footer, left, right }
+}
+
 /**
  * Collect all site content
  *
@@ -404,51 +469,16 @@ export async function collectSiteContent(sitePath) {
     }
   }
 
-  // Get page directories
-  const entries = await readdir(pagesPath)
-  const pages = []
-  let siteAssetCollection = {
-    assets: {},
-    hasExplicitPoster: new Set(),
-    hasExplicitPreview: new Set()
-  }
-  let header = null
-  let footer = null
-  let left = null
-  let right = null
-
-  for (const entry of entries) {
-    const entryPath = join(pagesPath, entry)
-    const stats = await stat(entryPath)
-
-    if (!stats.isDirectory()) continue
-
-    const result = await processPage(entryPath, entry, sitePath)
-    if (!result) continue
-
-    const { page, assetCollection } = result
-    siteAssetCollection = mergeAssetCollections(siteAssetCollection, assetCollection)
-
-    // Handle special pages (layout areas)
-    if (entry === '@header' || page.route === '/@header') {
-      header = page
-    } else if (entry === '@footer' || page.route === '/@footer') {
-      footer = page
-    } else if (entry === '@left' || page.route === '/@left') {
-      left = page
-    } else if (entry === '@right' || page.route === '/@right') {
-      right = page
-    } else {
-      pages.push(page)
-    }
-  }
+  // Recursively collect all pages
+  const { pages, assetCollection, header, footer, left, right } =
+    await collectPagesRecursive(pagesPath, '', sitePath)
 
   // Sort pages by order
   pages.sort((a, b) => (a.order ?? 999) - (b.order ?? 999))
 
   // Log asset summary
-  const assetCount = Object.keys(siteAssetCollection.assets).length
-  const explicitCount = siteAssetCollection.hasExplicitPoster.size + siteAssetCollection.hasExplicitPreview.size
+  const assetCount = Object.keys(assetCollection.assets).length
+  const explicitCount = assetCollection.hasExplicitPoster.size + assetCollection.hasExplicitPreview.size
   if (assetCount > 0) {
     console.log(`[content-collector] Found ${assetCount} asset references${explicitCount > 0 ? ` (${explicitCount} with explicit poster/preview)` : ''}`)
   }
@@ -461,9 +491,9 @@ export async function collectSiteContent(sitePath) {
     footer,
     left,
     right,
-    assets: siteAssetCollection.assets,
-    hasExplicitPoster: siteAssetCollection.hasExplicitPoster,
-    hasExplicitPreview: siteAssetCollection.hasExplicitPreview
+    assets: assetCollection.assets,
+    hasExplicitPoster: assetCollection.hasExplicitPoster,
+    hasExplicitPreview: assetCollection.hasExplicitPreview
   }
 }
 

package/src/vite-foundation-plugin.js

@@ -7,10 +7,9 @@
  * - Processing preview images for presets
  */
 
-import { writeFile, readFile, readdir, mkdir } from 'node:fs/promises'
-import { existsSync } from 'node:fs'
-import { join, resolve, relative } from 'node:path'
-import { buildSchema, discoverComponents } from './schema.js'
+import { writeFile, mkdir } from 'node:fs/promises'
+import { join, resolve } from 'node:path'
+import { buildSchema } from './schema.js'
 import { generateEntryPoint } from './generate-entry.js'
 import { processAllPreviews } from './images.js'
 
@@ -52,20 +51,22 @@ export function foundationBuildPlugin(options = {}) {
   return {
     name: 'uniweb-foundation-build',
 
+    // Generate entry before config resolution (entry must exist for Vite to resolve it)
+    async config(config) {
+      if (!generateEntry) return
+
+      const root = config.root || process.cwd()
+      const srcPath = resolve(root, srcDir)
+      const entryPath = join(srcPath, entryFileName)
+      await generateEntryPoint(srcPath, entryPath)
+    },
+
     async configResolved(config) {
       resolvedSrcDir = resolve(config.root, srcDir)
       resolvedOutDir = config.build.outDir
       isProduction = config.mode === 'production'
     },
 
-    async buildStart() {
-      if (!generateEntry) return
-
-      // Generate entry point before build starts
-      const entryPath = join(resolvedSrcDir, entryFileName)
-      await generateEntryPoint(resolvedSrcDir, entryPath)
-    },
-
     async writeBundle() {
       // After bundle is written, generate schema.json in meta folder
       const outDir = resolve(resolvedOutDir)
@@ -103,26 +104,36 @@ export function foundationDevPlugin(options = {}) {
   return {
     name: 'uniweb-foundation-dev',
 
-    configResolved(config) {
-      resolvedSrcDir = resolve(config.root, srcDir)
+    // Generate entry before config resolution
+    async config(config) {
+      const root = config.root || process.cwd()
+      const srcPath = resolve(root, srcDir)
+      const entryPath = join(srcPath, entryFileName)
+      await generateEntryPoint(srcPath, entryPath)
     },
 
-    async buildStart() {
-      // Generate entry point at dev server start
-      const entryPath = join(resolvedSrcDir, entryFileName)
-      await generateEntryPoint(resolvedSrcDir, entryPath)
+    configResolved(config) {
+      resolvedSrcDir = resolve(config.root, srcDir)
     },
 
     async handleHotUpdate({ file, server }) {
-      // Regenerate entry when meta files change
-      if (file.includes('/components/') && file.match(/meta\.(js|yml)$|config\.(js|yml)$/)) {
-        console.log('Meta file changed, regenerating entry...')
+      // Regenerate entry when meta.js files change
+      if (file.includes('/components/') && file.endsWith('/meta.js')) {
+        console.log('Component meta.js changed, regenerating entry...')
         const entryPath = join(resolvedSrcDir, entryFileName)
         await generateEntryPoint(resolvedSrcDir, entryPath)
 
         // Trigger full reload since entry changed
         server.ws.send({ type: 'full-reload' })
       }
+
+      // Also regenerate if runtime.js changes
+      if (file.endsWith('/runtime.js') || file.endsWith('/runtime.jsx')) {
+        console.log('Runtime exports changed, regenerating entry...')
+        const entryPath = join(resolvedSrcDir, entryFileName)
+        await generateEntryPoint(resolvedSrcDir, entryPath)
+        server.ws.send({ type: 'full-reload' })
+      }
     },
   }
 }
@@ -137,15 +148,16 @@ export function foundationPlugin(options = {}) {
   return {
     name: 'uniweb-foundation',
 
+    async config(config) {
+      // Only need to call once - devPlugin.config generates the entry
+      await devPlugin.config?.(config)
+    },
+
     configResolved(config) {
       buildPlugin.configResolved?.(config)
       devPlugin.configResolved?.(config)
     },
 
-    async buildStart() {
-      await devPlugin.buildStart?.()
-    },
-
     async writeBundle(...args) {
       await buildPlugin.writeBundle?.(...args)
     },