@uniweb/build 0.1.17 → 0.1.20

package/README.md

@@ -343,7 +343,6 @@ dist/
 | `loadComponentMeta(componentDir)` | Load meta file for a component |
 | `loadFoundationMeta(srcDir)` | Load foundation-level meta |
 | `buildSchema(srcDir)` | Build complete schema object |
-| `buildRuntimeConfig(srcDir)` | Build minimal runtime config |
 
 ### Entry Generation
 
@@ -351,6 +350,53 @@ dist/
 |----------|-------------|
 | `generateEntryPoint(srcDir, outputPath)` | Generate foundation entry file |
 
+#### Generated Entry Exports
+
+The generated `_entry.generated.js` file exports:
+
+| Export | Description |
+|--------|-------------|
+| `components` | Object map of component name → React component |
+| Named exports | Each component exported by name (e.g., `Hero`, `Features`) |
+| `capabilities` | Custom Layout and props from `src/exports.js` (or `null`) |
+| `meta` | Runtime metadata extracted from component `meta.js` files |
+
+#### Runtime Metadata (`meta` export)
+
+Some properties in `meta.js` are needed at runtime, not just editor-time. These are extracted into the `meta` export to keep them available without loading the full `schema.json`.
+
+Currently extracted properties:
+- `input` - Form input schemas (for components that accept user input)
+
+Example `meta.js` with form schema:
+```javascript
+export default {
+  title: 'Contact Form',
+  // ... editor-only properties ...
+
+  // This gets extracted to the runtime `meta` export
+  input: {
+    name: { type: 'text', label: 'Name', required: true },
+    email: { type: 'email', label: 'Email', required: true },
+    message: { type: 'textarea', label: 'Message' }
+  }
+}
+```
+
+Generated entry will include:
+```javascript
+export const meta = {
+  "ContactForm": {
+    "input": {
+      "name": { "type": "text", "label": "Name", "required": true },
+      // ...
+    }
+  }
+}
+```
+
+To add more runtime properties, update `RUNTIME_META_KEYS` in `src/generate-entry.js`.
+
 ### Image Processing
 
 | Function | Description |

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniweb/build",
-  "version": "0.1.17",
+  "version": "0.1.20",
   "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.7"
+    "@uniweb/core": "0.1.8"
   },
   "peerDependenciesMeta": {
     "vite": {

package/src/generate-entry.js

@@ -2,28 +2,43 @@
  * Foundation Entry Point Generator
  *
  * Auto-generates the foundation entry point based on discovered components.
- * The generated file exports components and runtime configuration.
+ *
+ * Exports:
+ * - `components` - Object map of component name -> React component
+ * - `capabilities` - Custom Layout and props from src/exports.js (if present)
+ * - `meta` - Runtime metadata extracted from component meta.js files
+ *
+ * The `meta` export contains properties from meta.js that are needed at runtime,
+ * not just editor-time. Currently this includes:
+ * - `input` - Form input schemas (for components that accept user input)
+ *
+ * Full component metadata lives in schema.json (for the visual editor).
+ * Only runtime-essential properties are extracted here to keep bundles small.
  */
 
 import { writeFile, mkdir } from 'node:fs/promises'
 import { existsSync } from 'node:fs'
 import { join, dirname } from 'node:path'
-import {
-  discoverComponents,
-  loadFoundationMeta,
-  extractRuntimeConfig,
-} from './schema.js'
+import { discoverComponents } from './schema.js'
+
+/**
+ * Keys from meta.js that should be included in the runtime bundle.
+ * These are properties needed at runtime, not just editor-time.
+ *
+ * - input: Form schemas for components that accept user input
+ */
+const RUNTIME_META_KEYS = ['input']
 
 /**
- * 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
+ * Detect foundation exports file (for custom Layout, props, etc.)
+ * Looks for: src/exports.js, src/exports.jsx, src/exports/index.js, src/exports/index.jsx
  */
-function detectRuntimeExports(srcDir) {
+function detectFoundationExports(srcDir) {
   const candidates = [
-    { path: 'runtime.js', ext: 'js' },
-    { path: 'runtime.jsx', ext: 'jsx' },
-    { path: 'runtime/index.js', ext: 'js' },
-    { path: 'runtime/index.jsx', ext: 'jsx' },
+    { path: 'exports.js', ext: 'js' },
+    { path: 'exports.jsx', ext: 'jsx' },
+    { path: 'exports/index.js', ext: 'js' },
+    { path: 'exports/index.jsx', ext: 'jsx' },
   ]
 
   for (const { path, ext } of candidates) {
@@ -48,117 +63,90 @@ function detectCssFile(srcDir) {
   return null
 }
 
+/**
+ * Extract runtime-needed properties from component meta
+ */
+function extractRuntimeMeta(componentsMeta) {
+  const meta = {}
+
+  for (const [name, componentMeta] of Object.entries(componentsMeta)) {
+    const extracted = {}
+    for (const key of RUNTIME_META_KEYS) {
+      if (componentMeta[key] !== undefined) {
+        extracted[key] = componentMeta[key]
+      }
+    }
+    if (Object.keys(extracted).length > 0) {
+      meta[name] = extracted
+    }
+  }
+
+  return meta
+}
+
 /**
  * Generate the entry point source code
  */
-function generateEntrySource(componentNames, runtimeConfig, options = {}) {
-  const { cssPath = null, componentExtensions = {}, runtimeExports = null } = options
+function generateEntrySource(componentNames, options = {}) {
+  const { cssPath = null, componentExtensions = {}, foundationExports = null, runtimeMeta = {} } = options
 
-  const imports = []
+  const lines = [
+    '// Auto-generated foundation entry point',
+    '// DO NOT EDIT - This file is regenerated during build',
+    ''
+  ]
 
   // CSS import
   if (cssPath) {
-    imports.push(`import '${cssPath}'`)
+    lines.push(`import '${cssPath}'`)
   }
 
-  // Runtime exports import (for custom Layout, props, etc.)
-  if (runtimeExports) {
-    imports.push(`import runtime from '${runtimeExports.path}'`)
+  // Foundation capabilities import (for custom Layout, props, etc.)
+  if (foundationExports) {
+    lines.push(`import capabilities from '${foundationExports.path}'`)
   }
 
   // Component imports (use detected extension or default to .js)
   for (const name of componentNames) {
     const ext = componentExtensions[name] || 'js'
-    imports.push(`import ${name} from './components/${name}/index.${ext}'`)
+    lines.push(`import ${name} from './components/${name}/index.${ext}'`)
   }
 
-  // Build components object
-  const componentsObj = `const components = {\n  ${componentNames.join(',\n  ')},\n}`
-
-  // Runtime config (serialized)
-  const configStr = JSON.stringify(runtimeConfig, null, 2)
-    .split('\n')
-    .map((line, i) => (i === 0 ? line : '  ' + line))
-    .join('\n')
-
-  const runtimeConfigBlock = `
-// Runtime configuration (extracted from meta files)
-// Only includes properties needed at render time
-const runtimeConfig = ${configStr}`
-
-  // Export functions
-  const exportFunctions = `
-/**
- * Get a component by name
- */
-export function getComponent(name) {
-  return components[name]
-}
-
-/**
- * List all available component names
- */
-export function listComponents() {
-  return Object.keys(components)
-}
+  lines.push('')
 
-/**
- * Get runtime config for a specific component
- * Returns input schema and other render-time properties
- */
-export function getComponentConfig(name) {
-  return runtimeConfig.components[name] || {}
-}
+  // Export components object
+  if (componentNames.length > 0) {
+    lines.push(`export const components = { ${componentNames.join(', ')} }`)
+    lines.push('')
+    lines.push(`export { ${componentNames.join(', ')} }`)
+  } else {
+    lines.push('export const components = {}')
+  }
 
-/**
- * Get foundation-level runtime config
- */
-export function getFoundationConfig() {
-  return runtimeConfig.foundation
-}
+  // Foundation capabilities (Layout, props, etc.)
+  lines.push('')
+  if (foundationExports) {
+    lines.push('export { capabilities }')
+  } else {
+    lines.push('export const capabilities = null')
+  }
 
-/**
- * Get all component schemas (for compatibility)
- * Note: Full schemas are in schema.json, this only returns runtime-relevant config
- */
-export function getAllSchemas() {
-  const schemas = {}
-  for (const name of Object.keys(components)) {
-    if (components[name].schema) {
-      schemas[name] = components[name].schema
-    }
+  // Runtime meta (form schemas, etc.) - only if non-empty
+  lines.push('')
+  if (Object.keys(runtimeMeta).length > 0) {
+    const metaJson = JSON.stringify(runtimeMeta, null, 2)
+      .split('\n')
+      .map((line, i) => (i === 0 ? line : line))
+      .join('\n')
+    lines.push(`// Runtime metadata (form schemas, etc.)`)
+    lines.push(`export const meta = ${metaJson}`)
+  } else {
+    lines.push('export const meta = {}')
   }
-  return schemas
-}
 
-/**
- * Get schema for a specific component (for compatibility)
- */
-export function getSchema(name) {
-  return components[name]?.schema
-}`
-
-  // Named exports for direct imports
-  const namedExports = componentNames.length > 0
-    ? `\n// Named exports for direct imports\nexport { ${componentNames.join(', ')} }`
-    : ''
-
-  // 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
-
-${imports.join('\n')}
-
-${componentsObj}
-${runtimeConfigBlock}
-${exportFunctions}
-${namedExports}
-${runtimeExport}
-`
+  lines.push('')
+
+  return lines.join('\n')
 }
 
 /**
@@ -178,7 +166,7 @@ function detectComponentExtension(srcDir, componentName) {
  * Generate the foundation entry point file
  */
 export async function generateEntryPoint(srcDir, outputPath = null) {
-  // Discover components
+  // Discover components (includes meta from meta.js files)
   const components = await discoverComponents(srcDir)
   const componentNames = Object.keys(components).sort()
 
@@ -192,32 +180,21 @@ export async function generateEntryPoint(srcDir, outputPath = null) {
     componentExtensions[name] = detectComponentExtension(srcDir, name)
   }
 
-  // Load foundation meta and build runtime config
-  const foundationMeta = await loadFoundationMeta(srcDir)
-
-  const runtimeConfig = {
-    foundation: extractRuntimeConfig(foundationMeta),
-    components: {},
-  }
-
-  for (const [name, meta] of Object.entries(components)) {
-    const config = extractRuntimeConfig(meta)
-    if (Object.keys(config).length > 0) {
-      runtimeConfig.components[name] = config
-    }
-  }
-
   // Check for CSS file
   const cssPath = detectCssFile(srcDir)
 
-  // Check for runtime exports (custom Layout, props, etc.)
-  const runtimeExports = detectRuntimeExports(srcDir)
+  // Check for foundation exports (custom Layout, props, etc.)
+  const foundationExports = detectFoundationExports(srcDir)
+
+  // Extract runtime-needed meta (form schemas, etc.)
+  const runtimeMeta = extractRuntimeMeta(components)
 
   // Generate source
-  const source = generateEntrySource(componentNames, runtimeConfig, {
+  const source = generateEntrySource(componentNames, {
     cssPath,
     componentExtensions,
-    runtimeExports,
+    foundationExports,
+    runtimeMeta,
   })
 
   // Write to file
@@ -227,15 +204,14 @@ export async function generateEntryPoint(srcDir, outputPath = null) {
 
   console.log(`Generated entry point: ${output}`)
   console.log(`  - ${componentNames.length} components: ${componentNames.join(', ')}`)
-  if (runtimeExports) {
-    console.log(`  - Runtime exports found: ${runtimeExports.path}`)
+  if (foundationExports) {
+    console.log(`  - Foundation exports found: ${foundationExports.path}`)
   }
 
   return {
     outputPath: output,
     componentNames,
-    runtimeConfig,
-    runtimeExports,
+    foundationExports,
   }
 }
 

package/src/index.js

@@ -9,9 +9,7 @@ export {
   loadComponentMeta,
   loadFoundationMeta,
   discoverComponents,
-  extractRuntimeConfig,
   buildSchema,
-  buildRuntimeConfig,
   getExposedComponents,
 } from './schema.js'
 

package/src/prerender.js

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

package/src/schema.js

@@ -1,8 +1,8 @@
 /**
  * Schema Discovery and Loading Utilities
  *
- * Discovers component meta files, loads them, and extracts
- * runtime-relevant configuration.
+ * Discovers component meta files and loads them for schema.json generation.
+ * Schema data is for editor-time only, not runtime.
  */
 
 import { readdir } from 'node:fs/promises'
@@ -13,9 +13,6 @@ import { pathToFileURL } from 'node:url'
 // 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']
-
 /**
  * Load a meta.js file via dynamic import
  */
@@ -95,22 +92,6 @@ export async function discoverComponents(srcDir) {
   return components
 }
 
-/**
- * Extract runtime-relevant config from meta
- * Only includes keys that are needed at render time
- */
-export function extractRuntimeConfig(meta) {
-  if (!meta) return {}
-
-  const config = {}
-  for (const key of RUNTIME_KEYS) {
-    if (meta[key] !== undefined) {
-      config[key] = meta[key]
-    }
-  }
-  return config
-}
-
 /**
  * Build complete schema for a foundation
  * Returns { _self: foundationMeta, ComponentName: componentMeta, ... }
@@ -125,27 +106,6 @@ export async function buildSchema(srcDir) {
   }
 }
 
-/**
- * Build runtime config (minimal, for embedding in foundation.js)
- */
-export async function buildRuntimeConfig(srcDir) {
-  const foundationMeta = await loadFoundationMeta(srcDir)
-  const components = await discoverComponents(srcDir)
-
-  const componentConfigs = {}
-  for (const [name, meta] of Object.entries(components)) {
-    const config = extractRuntimeConfig(meta)
-    if (Object.keys(config).length > 0) {
-      componentConfigs[name] = config
-    }
-  }
-
-  return {
-    foundation: extractRuntimeConfig(foundationMeta),
-    components: componentConfigs,
-  }
-}
-
 /**
  * Get list of exposed component names
  */

package/src/site/content-collector.js

@@ -79,9 +79,14 @@ function isMarkdownFile(filename) {
 
 /**
  * Parse numeric prefix from filename (e.g., "1-hero.md" → { prefix: "1", name: "hero" })
+ * Supports:
+ *   - Simple: "1", "2", "3"
+ *   - Decimal ordering: "1.5" (between 1 and 2), "2.5" (between 2 and 3)
+ *   - Hierarchy via comma: "1,1" (child of 1), "1,2" (second child of 1)
+ *   - Mixed: "1.5,1" (child of section 1.5)
  */
 function parseNumericPrefix(filename) {
-  const match = filename.match(/^(\d+(?:\.\d+)*)-?(.*)$/)
+  const match = filename.match(/^(\d+(?:[.,]\d+)*)-?(.*)$/)
   if (match) {
     return { prefix: match[1], name: match[2] || match[1] }
   }
@@ -89,7 +94,9 @@ function parseNumericPrefix(filename) {
 }
 
 /**
- * Compare filenames for sorting by numeric prefix
+ * Compare filenames for sorting by numeric prefix.
+ * Both . and , are treated as separators for sorting purposes.
+ * This ensures correct ordering: 1, 1,1, 1.5, 2, 2,1, etc.
  */
 function compareFilenames(a, b) {
   const { prefix: prefixA } = parseNumericPrefix(parse(a).name)
@@ -99,8 +106,8 @@ function compareFilenames(a, b) {
   if (!prefixA) return 1
   if (!prefixB) return -1
 
-  const partsA = prefixA.split('.').map(Number)
-  const partsB = prefixB.split('.').map(Number)
+  const partsA = prefixA.split(/[.,]/).map(Number)
+  const partsB = prefixB.split(/[.,]/).map(Number)
 
   for (let i = 0; i < Math.max(partsA.length, partsB.length); i++) {
     const numA = partsA[i] ?? 0
@@ -155,7 +162,11 @@ async function processMarkdownFile(filePath, id, siteRoot) {
 }
 
 /**
- * Build section hierarchy from flat list
+ * Build section hierarchy from flat list.
+ * Hierarchy is determined by comma separators:
+ *   - "1", "1.5", "2" → all top-level (dots are for ordering)
+ *   - "1,1", "1,2" → children of section "1"
+ *   - "1.5,1" → child of section "1.5"
  */
 function buildSectionHierarchy(sections) {
   const sectionMap = new Map()
@@ -166,15 +177,15 @@ function buildSectionHierarchy(sections) {
     sectionMap.set(section.id, section)
   }
 
-  // Second pass: build hierarchy
+  // Second pass: build hierarchy (comma = hierarchy)
   for (const section of sections) {
-    if (!section.id.includes('.')) {
+    if (!section.id.includes(',')) {
       topLevel.push(section)
       continue
     }
 
-    const parts = section.id.split('.')
-    const parentId = parts.slice(0, -1).join('.')
+    const parts = section.id.split(',')
+    const parentId = parts.slice(0, -1).join(',')
     const parent = sectionMap.get(parentId)
 
     if (parent) {

package/src/vite-foundation-plugin.js

@@ -127,9 +127,9 @@ export function foundationDevPlugin(options = {}) {
         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...')
+      // Also regenerate if exports.js changes
+      if (file.endsWith('/exports.js') || file.endsWith('/exports.jsx')) {
+        console.log('Foundation exports changed, regenerating entry...')
         const entryPath = join(resolvedSrcDir, entryFileName)
         await generateEntryPoint(resolvedSrcDir, entryPath)
         server.ws.send({ type: 'full-reload' })