@uniweb/build 0.1.2 → 0.1.5

package/src/site/assets.js

@@ -0,0 +1,247 @@
+/**
+ * Asset Resolution Utilities
+ *
+ * Resolves asset paths in content to file system locations.
+ * Supports both relative paths (./image.png) and absolute paths (/images/hero.png).
+ *
+ * In content-driven sites, markdown is the "code" - local asset references
+ * act as implicit imports and should be processed/optimized during build.
+ */
+
+import { join, dirname, isAbsolute, normalize } from 'node:path'
+import { existsSync } from 'node:fs'
+
+// Image extensions we should process
+const IMAGE_EXTENSIONS = ['.png', '.jpg', '.jpeg', '.webp', '.gif', '.svg', '.avif']
+
+// Video extensions we can extract posters from
+const VIDEO_EXTENSIONS = ['.mp4', '.webm', '.mov', '.avi', '.mkv']
+
+// PDF extension
+const PDF_EXTENSION = '.pdf'
+
+/**
+ * Check if a path is an external URL
+ */
+function isExternalUrl(src) {
+  return /^(https?:)?\/\//.test(src) || src.startsWith('data:')
+}
+
+/**
+ * Check if a path is a processable image
+ */
+function isImagePath(src) {
+  const ext = src.split('.').pop()?.toLowerCase()
+  return IMAGE_EXTENSIONS.some(e => e.slice(1) === ext)
+}
+
+/**
+ * Check if a path is a video file
+ */
+function isVideoPath(src) {
+  const ext = '.' + (src.split('.').pop()?.toLowerCase() || '')
+  return VIDEO_EXTENSIONS.includes(ext)
+}
+
+/**
+ * Check if a path is a PDF file
+ */
+function isPdfPath(src) {
+  return src.toLowerCase().endsWith(PDF_EXTENSION)
+}
+
+/**
+ * Resolve an asset path to absolute file system path
+ *
+ * @param {string} src - Original source path from content
+ * @param {string} contextPath - Path of the file containing the reference
+ * @param {string} siteRoot - Site root directory
+ * @returns {Object} Resolution result
+ */
+export function resolveAssetPath(src, contextPath, siteRoot) {
+  // External URLs - don't process
+  if (isExternalUrl(src)) {
+    return { src, resolved: null, external: true }
+  }
+
+  // Already absolute path on filesystem
+  if (isAbsolute(src)) {
+    return { src, resolved: src, external: false }
+  }
+
+  let resolved
+
+  // Relative paths: ./image.png or ../image.png or just image.png
+  if (src.startsWith('./') || src.startsWith('../') || !src.startsWith('/')) {
+    const contextDir = dirname(contextPath)
+    resolved = normalize(join(contextDir, src))
+  }
+  // Absolute site paths: /images/hero.png
+  else if (src.startsWith('/')) {
+    // Check public folder first, then assets folder
+    const publicPath = join(siteRoot, 'public', src)
+    const assetsPath = join(siteRoot, 'assets', src)
+
+    if (existsSync(publicPath)) {
+      resolved = publicPath
+    } else if (existsSync(assetsPath)) {
+      resolved = assetsPath
+    } else {
+      // Default to public folder path even if it doesn't exist yet
+      resolved = publicPath
+    }
+  }
+
+  return {
+    src,
+    resolved,
+    external: false,
+    isImage: isImagePath(src),
+    isVideo: isVideoPath(src),
+    isPdf: isPdfPath(src)
+  }
+}
+
+/**
+ * Walk a ProseMirror document and collect all asset references
+ *
+ * @param {Object} doc - ProseMirror document
+ * @param {Function} visitor - Callback for each asset: (node, path, attrName) => void
+ *                             attrName is 'src', 'poster', or 'preview'
+ * @param {string} [path=''] - Current path in document (for debugging)
+ */
+export function walkContentAssets(doc, visitor, path = '') {
+  if (!doc) return
+
+  // Check for image nodes
+  if (doc.type === 'image' && doc.attrs?.src) {
+    visitor(doc, path, 'src')
+
+    // Also collect explicit poster/preview attributes as assets
+    if (doc.attrs.poster && !isExternalUrl(doc.attrs.poster)) {
+      visitor({ type: 'image', attrs: { src: doc.attrs.poster } }, path, 'poster')
+    }
+    if (doc.attrs.preview && !isExternalUrl(doc.attrs.preview)) {
+      visitor({ type: 'image', attrs: { src: doc.attrs.preview } }, path, 'preview')
+    }
+  }
+
+  // Recurse into content
+  if (doc.content && Array.isArray(doc.content)) {
+    doc.content.forEach((child, index) => {
+      walkContentAssets(child, visitor, `${path}/content[${index}]`)
+    })
+  }
+
+  // Handle marks (links can have images)
+  if (doc.marks && Array.isArray(doc.marks)) {
+    doc.marks.forEach((mark, index) => {
+      if (mark.attrs?.src) {
+        visitor(mark, `${path}/marks[${index}]`, 'src')
+      }
+    })
+  }
+}
+
+/**
+ * Process all assets in a section's content and frontmatter
+ *
+ * @param {Object} section - Section object with content and params
+ * @param {string} markdownPath - Path to the markdown file
+ * @param {string} siteRoot - Site root directory
+ * @returns {Object} Asset collection result
+ *   - assets: Asset manifest mapping original paths to resolved info
+ *   - hasExplicitPoster: Set of video src paths that have explicit poster attributes
+ *   - hasExplicitPreview: Set of PDF src paths that have explicit preview attributes
+ */
+export function collectSectionAssets(section, markdownPath, siteRoot) {
+  const assets = {}
+  const hasExplicitPoster = new Set()
+  const hasExplicitPreview = new Set()
+
+  // Track current image node's src when we encounter poster/preview
+  let currentImageSrc = null
+
+  // Collect from ProseMirror content
+  if (section.content) {
+    walkContentAssets(section.content, (node, path, attrName) => {
+      const result = resolveAssetPath(node.attrs.src, markdownPath, siteRoot)
+
+      if (attrName === 'src') {
+        // Main src attribute - track it for potential poster/preview
+        currentImageSrc = node.attrs.src
+
+        // Check if this image has explicit poster/preview
+        if (node.attrs.poster) {
+          hasExplicitPoster.add(node.attrs.src)
+        }
+        if (node.attrs.preview) {
+          hasExplicitPreview.add(node.attrs.src)
+        }
+      }
+
+      if (!result.external && result.resolved) {
+        assets[node.attrs.src] = {
+          original: node.attrs.src,
+          resolved: result.resolved,
+          isImage: result.isImage,
+          isVideo: result.isVideo,
+          isPdf: result.isPdf
+        }
+      }
+    })
+  }
+
+  // Collect from frontmatter params (common media fields)
+  const mediaFields = [
+    'image', 'background', 'backgroundImage', 'thumbnail',
+    'poster', 'avatar', 'logo', 'icon',
+    'video', 'videoSrc', 'media', 'file', 'pdf', 'document'
+  ]
+
+  for (const field of mediaFields) {
+    const value = section.params?.[field]
+    if (typeof value === 'string' && value) {
+      const result = resolveAssetPath(value, markdownPath, siteRoot)
+      if (!result.external && result.resolved) {
+        assets[value] = {
+          original: value,
+          resolved: result.resolved,
+          isImage: result.isImage,
+          isVideo: result.isVideo,
+          isPdf: result.isPdf
+        }
+      }
+    }
+  }
+
+  return { assets, hasExplicitPoster, hasExplicitPreview }
+}
+
+/**
+ * Merge multiple asset collection results
+ *
+ * @param {...Object} collections - Asset collection results from collectSectionAssets
+ * @returns {Object} Merged collection with combined assets and sets
+ */
+export function mergeAssetCollections(...collections) {
+  const merged = {
+    assets: {},
+    hasExplicitPoster: new Set(),
+    hasExplicitPreview: new Set()
+  }
+
+  for (const collection of collections) {
+    // Handle both old format (plain object) and new format (with sets)
+    if (collection.assets) {
+      Object.assign(merged.assets, collection.assets)
+      collection.hasExplicitPoster?.forEach(p => merged.hasExplicitPoster.add(p))
+      collection.hasExplicitPreview?.forEach(p => merged.hasExplicitPreview.add(p))
+    } else {
+      // Legacy: plain asset manifest
+      Object.assign(merged.assets, collection)
+    }
+  }
+
+  return merged
+}

package/src/site/content-collector.js

@@ -0,0 +1,344 @@
+/**
+ * Content Collector
+ *
+ * Collects site content from a pages/ directory structure:
+ * - site.yml: Site configuration
+ * - pages/: Directory of page folders
+ *   - page.yml: Page metadata
+ *   - *.md: Section content with YAML frontmatter
+ *
+ * Section frontmatter reserved properties:
+ * - type: Component type (e.g., "Hero", "Features")
+ * - preset: Preset configuration name
+ * - input: Input field mapping
+ * - props: Additional component props (merged with other params)
+ *
+ * Note: `component` is supported as an alias for `type` (deprecated)
+ *
+ * Uses @uniweb/content-reader for markdown → ProseMirror conversion
+ * when available, otherwise uses a simplified parser.
+ *
+ * @module @uniweb/build/site
+ */
+
+import { readFile, readdir, stat } from 'node:fs/promises'
+import { join, parse } from 'node:path'
+import { existsSync } from 'node:fs'
+import yaml from 'js-yaml'
+import { collectSectionAssets, mergeAssetCollections } from './assets.js'
+
+// Try to import content-reader, fall back to simplified parser
+let markdownToProseMirror
+try {
+  const contentReader = await import('@uniweb/content-reader')
+  markdownToProseMirror = contentReader.markdownToProseMirror
+} catch {
+  // Simplified fallback - just wraps content as text
+  markdownToProseMirror = (markdown) => ({
+    type: 'doc',
+    content: [
+      {
+        type: 'paragraph',
+        content: [{ type: 'text', text: markdown.trim() }]
+      }
+    ]
+  })
+}
+
+/**
+ * Parse YAML string using js-yaml
+ */
+function parseYaml(yamlString) {
+  try {
+    return yaml.load(yamlString) || {}
+  } catch (err) {
+    console.warn('[content-collector] YAML parse error:', err.message)
+    return {}
+  }
+}
+
+/**
+ * Read and parse a YAML file
+ */
+async function readYamlFile(filePath) {
+  try {
+    const content = await readFile(filePath, 'utf8')
+    return parseYaml(content)
+  } catch (err) {
+    if (err.code === 'ENOENT') return {}
+    throw err
+  }
+}
+
+/**
+ * Check if a file is a markdown file
+ */
+function isMarkdownFile(filename) {
+  return filename.endsWith('.md') && !filename.startsWith('_')
+}
+
+/**
+ * Parse numeric prefix from filename (e.g., "1-hero.md" → { prefix: "1", name: "hero" })
+ */
+function parseNumericPrefix(filename) {
+  const match = filename.match(/^(\d+(?:\.\d+)*)-?(.*)$/)
+  if (match) {
+    return { prefix: match[1], name: match[2] || match[1] }
+  }
+  return { prefix: null, name: filename }
+}
+
+/**
+ * Compare filenames for sorting by numeric prefix
+ */
+function compareFilenames(a, b) {
+  const { prefix: prefixA } = parseNumericPrefix(parse(a).name)
+  const { prefix: prefixB } = parseNumericPrefix(parse(b).name)
+
+  if (!prefixA && !prefixB) return a.localeCompare(b)
+  if (!prefixA) return 1
+  if (!prefixB) return -1
+
+  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
+    const numB = partsB[i] ?? 0
+    if (numA !== numB) return numA - numB
+  }
+
+  return 0
+}
+
+/**
+ * Process a markdown file into a section
+ *
+ * @param {string} filePath - Path to markdown file
+ * @param {string} id - Section ID
+ * @param {string} siteRoot - Site root directory for asset resolution
+ * @returns {Object} Section data with assets manifest
+ */
+async function processMarkdownFile(filePath, id, siteRoot) {
+  const content = await readFile(filePath, 'utf8')
+  let frontMatter = {}
+  let markdown = content
+
+  // Extract frontmatter
+  if (content.trim().startsWith('---')) {
+    const parts = content.split('---\n')
+    if (parts.length >= 3) {
+      frontMatter = parseYaml(parts[1])
+      markdown = parts.slice(2).join('---\n')
+    }
+  }
+
+  const { type, component, preset, input, props, ...params } = frontMatter
+
+  // Convert markdown to ProseMirror
+  const proseMirrorContent = markdownToProseMirror(markdown)
+
+  const section = {
+    id,
+    component: type || component || 'Section',
+    preset,
+    input,
+    params: { ...params, ...props },
+    content: proseMirrorContent,
+    subsections: []
+  }
+
+  // Collect assets referenced in this section
+  const assetCollection = collectSectionAssets(section, filePath, siteRoot)
+
+  return { section, assetCollection }
+}
+
+/**
+ * Build section hierarchy from flat list
+ */
+function buildSectionHierarchy(sections) {
+  const sectionMap = new Map()
+  const topLevel = []
+
+  // First pass: create map
+  for (const section of sections) {
+    sectionMap.set(section.id, section)
+  }
+
+  // Second pass: build hierarchy
+  for (const section of sections) {
+    if (!section.id.includes('.')) {
+      topLevel.push(section)
+      continue
+    }
+
+    const parts = section.id.split('.')
+    const parentId = parts.slice(0, -1).join('.')
+    const parent = sectionMap.get(parentId)
+
+    if (parent) {
+      parent.subsections.push(section)
+    } else {
+      // Orphan subsection - add to top level
+      topLevel.push(section)
+    }
+  }
+
+  return topLevel
+}
+
+/**
+ * Process a page directory
+ *
+ * @param {string} pagePath - Path to page directory
+ * @param {string} pageName - Name of the page
+ * @param {string} siteRoot - Site root directory for asset resolution
+ * @returns {Object} Page data with assets manifest
+ */
+async function processPage(pagePath, pageName, siteRoot) {
+  const pageConfig = await readYamlFile(join(pagePath, 'page.yml'))
+
+  if (pageConfig.hidden) return null
+
+  // Get markdown files
+  const files = await readdir(pagePath)
+  const mdFiles = files.filter(isMarkdownFile).sort(compareFilenames)
+
+  // Process sections and collect assets
+  const sections = []
+  let pageAssetCollection = {
+    assets: {},
+    hasExplicitPoster: new Set(),
+    hasExplicitPreview: new Set()
+  }
+  let lastModified = null
+
+  for (const file of mdFiles) {
+    const { name } = parse(file)
+    const { prefix } = parseNumericPrefix(name)
+    const id = prefix || name
+
+    const { section, assetCollection } = await processMarkdownFile(join(pagePath, file), id, siteRoot)
+    sections.push(section)
+    pageAssetCollection = mergeAssetCollections(pageAssetCollection, assetCollection)
+
+    // Track last modified time for sitemap
+    const fileStat = await stat(join(pagePath, file))
+    if (!lastModified || fileStat.mtime > lastModified) {
+      lastModified = fileStat.mtime
+    }
+  }
+
+  // Build hierarchy
+  const hierarchicalSections = buildSectionHierarchy(sections)
+
+  // Determine route
+  let route = '/' + pageName
+  if (pageName === 'home' || pageName === 'index') {
+    route = '/'
+  } else if (pageName.startsWith('@')) {
+    route = '/' + pageName
+  }
+
+  // Extract SEO config from page
+  const { seo = {}, ...restConfig } = pageConfig
+
+  return {
+    page: {
+      route,
+      title: pageConfig.title || pageName,
+      description: pageConfig.description || '',
+      order: pageConfig.order,
+      lastModified: lastModified?.toISOString(),
+      seo: {
+        noindex: seo.noindex || false,
+        image: seo.image || null,
+        changefreq: seo.changefreq || null,
+        priority: seo.priority || null
+      },
+      sections: hierarchicalSections
+    },
+    assetCollection: pageAssetCollection
+  }
+}
+
+/**
+ * Collect all site content
+ *
+ * @param {string} sitePath - Path to site directory
+ * @returns {Promise<Object>} Site content object with assets manifest
+ */
+export async function collectSiteContent(sitePath) {
+  const pagesPath = join(sitePath, 'pages')
+
+  // Read site config
+  const siteConfig = await readYamlFile(join(sitePath, 'site.yml'))
+  const themeConfig = await readYamlFile(join(sitePath, 'theme.yml'))
+
+  // Check if pages directory exists
+  if (!existsSync(pagesPath)) {
+    return {
+      config: siteConfig,
+      theme: themeConfig,
+      pages: [],
+      assets: {}
+    }
+  }
+
+  // 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
+
+  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
+    if (entry === '@header' || page.route === '/@header') {
+      header = page
+    } else if (entry === '@footer' || page.route === '/@footer') {
+      footer = page
+    } else {
+      pages.push(page)
+    }
+  }
+
+  // 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
+  if (assetCount > 0) {
+    console.log(`[content-collector] Found ${assetCount} asset references${explicitCount > 0 ? ` (${explicitCount} with explicit poster/preview)` : ''}`)
+  }
+
+  return {
+    config: siteConfig,
+    theme: themeConfig,
+    pages,
+    header,
+    footer,
+    assets: siteAssetCollection.assets,
+    hasExplicitPoster: siteAssetCollection.hasExplicitPoster,
+    hasExplicitPreview: siteAssetCollection.hasExplicitPreview
+  }
+}
+
+export default collectSiteContent

package/src/site/index.js

@@ -0,0 +1,32 @@
+/**
+ * Site Build Tools
+ *
+ * Vite plugins and utilities for building Uniweb sites.
+ *
+ * @module @uniweb/build/site
+ */
+
+export { siteContentPlugin, default } from './plugin.js'
+export { collectSiteContent } from './content-collector.js'
+export {
+  resolveAssetPath,
+  walkContentAssets,
+  collectSectionAssets,
+  mergeAssetCollections
+} from './assets.js'
+export {
+  processAsset,
+  processAssets,
+  rewriteContentPaths,
+  rewriteParamPaths,
+  rewriteSiteContentPaths
+} from './asset-processor.js'
+export {
+  extractVideoPoster,
+  generatePdfThumbnail,
+  processAdvancedAsset,
+  processAdvancedAssets,
+  checkFfmpeg,
+  isVideoFile,
+  isPdfFile
+} from './advanced-processors.js'