@uniweb/build 0.4.10 → 0.6.0

package/src/site/collection-processor.js

@@ -1,15 +1,15 @@
 /**
  * Collection Processor
  *
- * Processes content collections from markdown files into JSON data.
+ * Processes content collections from markdown and YAML files into JSON data.
  * Collections are defined in site.yml and processed at build time.
  *
  * Features:
- * - Discovers markdown files in collection folders
- * - Parses frontmatter for metadata
+ * - Discovers markdown (.md), data (.yml/.yaml), and JSON (.json) files in collection folders
+ * - Parses frontmatter for metadata (markdown), full YAML (data items), or JSON (data items)
  * - Converts markdown body to ProseMirror JSON
  * - Supports filtering, sorting, and limiting
- * - Auto-generates excerpts and extracts first images
+ * - Auto-generates excerpts and extracts first images (markdown items only)
  *
  * @module @uniweb/build/site/collection-processor
  *
@@ -315,6 +315,53 @@ async function processCollectionAssets(content, itemPath, siteRoot, collectionNa
 
 // Filter and sort utilities are imported from data-fetcher.js
 
+/**
+ * Process a single data item from a YAML file
+ *
+ * YAML items are pure data — no ProseMirror conversion, no body, no excerpt,
+ * no image extraction, no lastModified. The output is slug + YAML fields.
+ *
+ * @param {string} dir - Collection directory path
+ * @param {string} filename - YAML filename (.yml or .yaml)
+ * @returns {Promise<Object|null>} Processed item or null if unpublished
+ */
+async function processDataItem(dir, filename) {
+  const filepath = join(dir, filename)
+  const raw = await readFile(filepath, 'utf-8')
+  const slug = basename(filename, extname(filename))
+  const data = yaml.load(raw) || {}
+
+  // Skip unpublished items
+  if (data.published === false) return null
+
+  return { slug, ...data }
+}
+
+/**
+ * Process a single data item from a JSON file
+ *
+ * JSON items are pure data — like YAML items, no ProseMirror conversion.
+ * A JSON file containing an array returns all items (single-file collection).
+ * A JSON file containing an object returns a single item with slug from filename.
+ *
+ * @param {string} dir - Collection directory path
+ * @param {string} filename - JSON filename
+ * @returns {Promise<Object|Array|null>} Processed item(s) or null if unpublished
+ */
+async function processJsonItem(dir, filename) {
+  const filepath = join(dir, filename)
+  const raw = await readFile(filepath, 'utf-8')
+  const slug = basename(filename, '.json')
+  const data = JSON.parse(raw)
+
+  // Array → multiple items (single-file collection)
+  if (Array.isArray(data)) return data
+
+  // Object → single item
+  if (data.published === false) return null
+  return { slug, ...data }
+}
+
 /**
  * Process a single content item from a markdown file
  *
@@ -384,13 +431,27 @@ async function collectItems(siteDir, config) {
   }
 
   const files = await readdir(collectionDir)
-  const mdFiles = files.filter(f => f.endsWith('.md') && !f.startsWith('_'))
+  const itemFiles = files.filter(f =>
+    !f.startsWith('_') &&
+    (f.endsWith('.md') || f.endsWith('.yml') || f.endsWith('.yaml') || f.endsWith('.json'))
+  )
 
-  // Process all markdown files
+  // Process all collection files (markdown → content items, YAML/JSON → data items)
   let items = await Promise.all(
-    mdFiles.map(file => processContentItem(collectionDir, file, config, siteDir))
+    itemFiles.map(file => {
+      if (file.endsWith('.json')) {
+        return processJsonItem(collectionDir, file)
+      }
+      if (file.endsWith('.yml') || file.endsWith('.yaml')) {
+        return processDataItem(collectionDir, file)
+      }
+      return processContentItem(collectionDir, file, config, siteDir)
+    })
   )
 
+  // Flatten arrays from JSON files that contain multiple items
+  items = items.flat()
+
   // Filter out nulls (unpublished items)
   items = items.filter(Boolean)
 
@@ -496,11 +557,14 @@ export async function getCollectionLastModified(siteDir, config) {
   }
 
   const files = await readdir(collectionDir)
-  const mdFiles = files.filter(f => f.endsWith('.md') && !f.startsWith('_'))
+  const itemFiles = files.filter(f =>
+    !f.startsWith('_') &&
+    (f.endsWith('.md') || f.endsWith('.yml') || f.endsWith('.yaml') || f.endsWith('.json'))
+  )
 
   let lastModified = null
 
-  for (const file of mdFiles) {
+  for (const file of itemFiles) {
     const fileStat = await stat(join(collectionDir, file))
     if (!lastModified || fileStat.mtime > lastModified) {
       lastModified = fileStat.mtime

package/src/site/data-fetcher.js

@@ -245,9 +245,10 @@ export function parseFetchConfig(fetch) {
     path,
     url,
     schema,
-    prerender = true,
+    prerender = url ? false : true,
     merge = false,
     transform,
+    detail,
     // Post-processing options (also supported for path/url fetches)
     limit,
     sort,
@@ -264,6 +265,7 @@ export function parseFetchConfig(fetch) {
     prerender,
     merge,
     transform,
+    detail,
     // Post-processing options
     limit,
     sort,

package/src/site/plugin.js

@@ -41,50 +41,51 @@ import { executeFetch, mergeDataIntoContent } from './data-fetcher.js'
 
 /**
  * Execute all fetches for site content (used in dev mode)
- * Populates section.cascadedData with fetched data
+ * Collects fetchedData for DataStore pre-population at runtime
  *
  * @param {Object} siteContent - The collected site content
  * @param {string} siteDir - Path to site directory
  */
 async function executeDevFetches(siteContent, siteDir) {
   const fetchOptions = { siteRoot: siteDir, publicDir: 'public' }
+  const fetchedData = []
 
   // Site-level fetch
-  let siteCascadedData = {}
   const siteFetch = siteContent.config?.fetch
   if (siteFetch) {
     const result = await executeFetch(siteFetch, fetchOptions)
     if (result.data && !result.error) {
-      siteCascadedData[siteFetch.schema] = result.data
+      fetchedData.push({ config: siteFetch, data: result.data })
     }
   }
 
   // Process each page
   for (const page of siteContent.pages || []) {
-    let pageCascadedData = { ...siteCascadedData }
-
     // Page-level fetch
     const pageFetch = page.fetch
     if (pageFetch) {
       const result = await executeFetch(pageFetch, fetchOptions)
       if (result.data && !result.error) {
-        pageCascadedData[pageFetch.schema] = result.data
+        fetchedData.push({ config: pageFetch, data: result.data })
       }
     }
 
-    // Process sections
-    await processDevSectionFetches(page.sections, pageCascadedData, fetchOptions)
+    // Process section-level fetches (own fetch → parsedContent.data)
+    await processDevSectionFetches(page.sections, fetchOptions)
   }
+
+  // Store on siteContent for runtime DataStore pre-population
+  siteContent.fetchedData = fetchedData
 }
 
 /**
  * Process fetches for sections recursively
+ * Section-level fetches merge data into parsedContent.data (not cascaded).
  *
  * @param {Array} sections - Sections to process
- * @param {Object} cascadedData - Data from parent levels
  * @param {Object} fetchOptions - Options for executeFetch
  */
-async function processDevSectionFetches(sections, cascadedData, fetchOptions) {
+async function processDevSectionFetches(sections, fetchOptions) {
   if (!sections || !Array.isArray(sections)) return
 
   for (const section of sections) {
@@ -104,13 +105,9 @@ async function processDevSectionFetches(sections, cascadedData, fetchOptions) {
       }
     }
 
-    // Attach cascaded data for components with inheritData
-    // Note: cascadedData is from page/site level only, not section's own fetch
-    section.cascadedData = cascadedData
-
     // Process subsections recursively
     if (section.subsections && section.subsections.length > 0) {
-      await processDevSectionFetches(section.subsections, cascadedData, fetchOptions)
+      await processDevSectionFetches(section.subsections, fetchOptions)
     }
   }
 }
@@ -376,6 +373,7 @@ export function siteContentPlugin(options = {}) {
   let watcher = null
   let server = null
   let localeTranslations = {} // Cache: { locale: translations }
+  let collectionTranslations = {} // Cache: { locale: collection translations }
   let localesDir = 'locales' // Default, updated from site config
   let collectionsConfig = null // Cached for watcher setup
 
@@ -402,6 +400,29 @@ export function siteContentPlugin(options = {}) {
     }
   }
 
+  /**
+   * Load collection translations for a specific locale
+   */
+  async function loadCollectionTranslations(locale) {
+    if (collectionTranslations[locale]) {
+      return collectionTranslations[locale]
+    }
+
+    const localePath = join(resolvedSitePath, localesDir, 'collections', `${locale}.json`)
+    if (!existsSync(localePath)) {
+      return null
+    }
+
+    try {
+      const content = await readFile(localePath, 'utf-8')
+      const translations = JSON.parse(content)
+      collectionTranslations[locale] = translations
+      return translations
+    } catch {
+      return null
+    }
+  }
+
   /**
    * Get available locales from locales directory
    */
@@ -504,6 +525,7 @@ export function siteContentPlugin(options = {}) {
 
         // Clear translation cache on rebuild
         localeTranslations = {}
+        collectionTranslations = {}
       } catch (err) {
         console.error('[site-content] Failed to collect content:', err.message)
         siteContent = { config: {}, theme: {}, pages: [] }
@@ -621,6 +643,7 @@ export function siteContentPlugin(options = {}) {
           const localeWatcher = watch(localesPath, { recursive: false }, () => {
             console.log('[site-content] Translation files changed, clearing cache...')
             localeTranslations = {}
+            collectionTranslations = {}
             server.ws.send({ type: 'full-reload' })
           })
           additionalWatchers.push(localeWatcher)
@@ -643,6 +666,22 @@ export function siteContentPlugin(options = {}) {
             // freeform dir may not exist, that's ok
           }
         }
+
+        // Watch collection translations directory
+        const collectionsLocalesPath = resolve(localesPath, 'collections')
+        if (existsSync(collectionsLocalesPath)) {
+          try {
+            const collWatcher = watch(collectionsLocalesPath, { recursive: false }, () => {
+              console.log('[site-content] Collection translations changed, clearing cache...')
+              collectionTranslations = {}
+              server.ws.send({ type: 'full-reload' })
+            })
+            additionalWatchers.push(collWatcher)
+            console.log(`[site-content] Watching ${collectionsLocalesPath} for collection translation changes`)
+          } catch (err) {
+            // collections locales dir may not exist, that's ok
+          }
+        }
       }
 
       // Add additional watchers to cleanup
@@ -721,6 +760,45 @@ export function siteContentPlugin(options = {}) {
           }
         }
 
+        // Handle localized collection data (e.g., /fr/data/articles.json)
+        const localeDataMatch = req.url.match(/^\/([a-z]{2})\/data\/(.+\.json)$/)
+        if (localeDataMatch) {
+          const locale = localeDataMatch[1]
+          const filename = localeDataMatch[2]
+          const collectionName = filename.replace('.json', '')
+          const sourcePath = join(resolvedSitePath, 'public', 'data', filename)
+
+          if (existsSync(sourcePath)) {
+            try {
+              const raw = await readFile(sourcePath, 'utf-8')
+              const items = JSON.parse(raw)
+
+              // Load collection translations for this locale
+              const translations = await loadCollectionTranslations(locale) || {}
+
+              // Check for free-form translations
+              const freeformDir = join(resolvedSitePath, localesDir, 'freeform', locale)
+              const hasFreeform = existsSync(freeformDir)
+
+              // Translate using the collections module
+              const { translateCollectionData } = await import('../i18n/collections.js')
+              const translated = await translateCollectionData(items, collectionName, resolvedSitePath, {
+                locale,
+                localesDir: join(resolvedSitePath, localesDir),
+                translations,
+                freeformEnabled: hasFreeform
+              })
+
+              res.setHeader('Content-Type', 'application/json')
+              res.end(JSON.stringify(translated, null, 2))
+              return
+            } catch (err) {
+              console.warn(`[site-content] Failed to serve localized collection ${filename}: ${err.message}`)
+              // Fall through to Vite's static server
+            }
+          }
+        }
+
         next()
       })
     },

package/src/theme/css-generator.js

@@ -134,7 +134,7 @@ function generateContextCSS(context, tokens = {}) {
 
   const vars = generateVarDeclarations(mergedTokens)
 
-  return `.context-${context} {\n${vars}\n}`
+  return `.context-${context} {\n${vars}\n  background-color: var(--bg);\n}`
 }
 
 /**
@@ -305,6 +305,26 @@ export function generateThemeCSS(config = {}) {
     sections.push(generateDarkSchemeCSS(appearance))
   }
 
+  // 7. Site background (if specified in theme.yml)
+  if (config.background) {
+    sections.push(`/* Site Background */\nbody {\n  background: ${config.background};\n}`)
+  }
+
+  // 8. Inline text styles (if specified in theme.yml)
+  if (config.inline && typeof config.inline === 'object') {
+    const rules = Object.entries(config.inline)
+      .filter(([, styles]) => styles && typeof styles === 'object')
+      .map(([name, styles]) => {
+        const declarations = Object.entries(styles)
+          .map(([prop, value]) => `  ${prop}: ${value};`)
+          .join('\n')
+        return `span[${name}] {\n${declarations}\n}`
+      })
+    if (rules.length > 0) {
+      sections.push('/* Inline Text Styles */\n' + rules.join('\n\n'))
+    }
+  }
+
   return sections.join('\n\n')
 }
 

package/src/theme/processor.js

@@ -422,6 +422,12 @@ export function processTheme(rawConfig = {}, options = {}) {
     ...(rawConfig.code || {}),
   }
 
+  // Site background (pass through as CSS value)
+  const background = rawConfig.background || null
+
+  // Inline text styles (semantic names → CSS declarations)
+  const inline = rawConfig.inline || null
+
   const config = {
     colors,      // Raw colors for CSS generator
     palettes,    // Generated palettes for Theme class
@@ -430,6 +436,8 @@ export function processTheme(rawConfig = {}, options = {}) {
     appearance,
     foundationVars: mergedFoundationVars,
     code,        // Code block theme for runtime injection
+    background,  // Site-level background CSS value
+    inline,      // Inline text style definitions
   }
 
   return { config, errors, warnings }

package/src/utils/infer-title.js

@@ -0,0 +1,16 @@
+/**
+ * Infer display title from PascalCase component name.
+ *
+ * TeamRoster → "Team Roster"
+ * CTA → "CTA"
+ * FAQSection → "FAQ Section"
+ * Hero → "Hero"
+ *
+ * @param {string} name - PascalCase component name
+ * @returns {string} Human-readable title
+ */
+export function inferTitle(name) {
+  return name
+    .replace(/([A-Z]+)([A-Z][a-z])/g, '$1 $2')
+    .replace(/([a-z])([A-Z])/g, '$1 $2')
+}

package/src/vite-foundation-plugin.js

@@ -120,21 +120,33 @@ export function foundationDevPlugin(options = {}) {
     },
 
     async handleHotUpdate({ file, server }) {
+      const entryPath = join(resolvedSrcDir, entryFileName)
+
       // Regenerate entry when meta.js files change
-      // Check if file is a meta.js in the src directory
       if (file.startsWith(resolvedSrcDir) && file.endsWith('/meta.js')) {
         console.log('Component meta.js changed, regenerating entry...')
-        const entryPath = join(resolvedSrcDir, entryFileName)
         await generateEntryPoint(resolvedSrcDir, entryPath, { componentPaths })
-
-        // Trigger full reload since entry changed
         server.ws.send({ type: 'full-reload' })
+        return
+      }
+
+      // Regenerate when component files are added/removed in sections/ root
+      // (bare file discovery means any .jsx/.tsx/.js/.ts at sections root is a section type)
+      const sectionsDir = join(resolvedSrcDir, 'sections')
+      if (file.startsWith(sectionsDir)) {
+        const relative = file.slice(sectionsDir.length + 1)
+        // Direct child of sections/ (no further slashes) — could be a new/removed bare file
+        if (!relative.includes('/') && /\.(jsx|tsx|js|ts)$/.test(relative)) {
+          console.log('Section file changed, regenerating entry...')
+          await generateEntryPoint(resolvedSrcDir, entryPath, { componentPaths })
+          server.ws.send({ type: 'full-reload' })
+          return
+        }
       }
 
       // 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, { componentPaths })
         server.ws.send({ type: 'full-reload' })
       }