@uniweb/runtime 0.2.6 → 0.2.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniweb/runtime",
-  "version": "0.2.6",
+  "version": "0.2.8",
   "description": "Minimal runtime for loading Uniweb foundations",
   "type": "module",
   "exports": {
@@ -29,7 +29,7 @@
     "node": ">=20.19"
   },
   "dependencies": {
-    "@uniweb/core": "0.1.6"
+    "@uniweb/core": "0.1.7"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",

package/src/components/Layout.jsx

@@ -12,24 +12,26 @@
  * - right: Right sidebar/panel (from @right page)
  *
  * Custom Layouts:
- * Foundations can export a Layout component that receives pre-rendered areas as props:
+ * Foundations can provide a custom Layout via src/runtime.js:
  *
  * ```jsx
- * export const site = {
- *   Layout: ({ page, website, header, body, footer, left, right }) => (
- *     <div className="my-layout">
- *       <header>{header}</header>
- *       <aside>{left}</aside>
- *       <main>{body}</main>
- *       <aside>{right}</aside>
- *       <footer>{footer}</footer>
- *     </div>
- *   )
+ * // src/runtime.js
+ * import Layout from './components/Layout'
+ *
+ * export default {
+ *   Layout,
+ *   props: {
+ *     themeToggleEnabled: true,
+ *   }
  * }
  * ```
+ *
+ * The Layout component receives pre-rendered areas as props:
+ * - page, website: Runtime context
+ * - header, body, footer: Pre-rendered React elements
+ * - left, right (or leftPanel, rightPanel): Sidebar panels
  */
 
-import React from 'react'
 import Blocks from './Blocks.jsx'
 
 /**

package/src/index.jsx

@@ -19,6 +19,53 @@ import Blocks from './components/Blocks.jsx'
 // Core factory from @uniweb/core
 import { createUniweb } from '@uniweb/core'
 
+/**
+ * Decode combined data from __DATA__ element
+ *
+ * Encoding is signaled via MIME type:
+ * - application/json: plain JSON (no compression)
+ * - application/gzip: gzip + base64 encoded
+ *
+ * @returns {Promise<{foundation: Object, content: Object}|null>}
+ */
+async function decodeData() {
+  const el = document.getElementById('__DATA__')
+  if (!el?.textContent) return null
+
+  const raw = el.textContent
+
+  // Plain JSON (uncompressed)
+  if (el.type === 'application/json') {
+    try {
+      return JSON.parse(raw)
+    } catch {
+      return null
+    }
+  }
+
+  // Compressed (application/gzip or legacy application/octet-stream)
+  if (typeof DecompressionStream !== 'undefined') {
+    try {
+      const bytes = Uint8Array.from(atob(raw), c => c.charCodeAt(0))
+      const stream = new DecompressionStream('gzip')
+      const writer = stream.writable.getWriter()
+      writer.write(bytes)
+      writer.close()
+      const json = await new Response(stream.readable).text()
+      return JSON.parse(json)
+    } catch {
+      return null
+    }
+  }
+
+  // Fallback for old browsers: try plain JSON (server can detect User-Agent)
+  try {
+    return JSON.parse(raw)
+  } catch {
+    return null
+  }
+}
+
 /**
  * Load foundation CSS from URL
  * @param {string} url - URL to foundation's CSS file
@@ -183,9 +230,9 @@ async function initRuntime(foundationSource, options = {}) {
     // Set the foundation on the runtime
     uniwebInstance.setFoundation(foundation)
 
-    // Set foundation config if provided
-    if (foundation.config || foundation.site) {
-      uniwebInstance.setFoundationConfig(foundation.config || foundation.site)
+    // Set foundation config if provided (runtime is the new name, config/site are legacy)
+    if (foundation.runtime || foundation.config || foundation.site) {
+      uniwebInstance.setFoundationConfig(foundation.runtime || foundation.config || foundation.site)
     }
 
     // Render the app
@@ -229,26 +276,35 @@ async function initRuntime(foundationSource, options = {}) {
 /**
  * Simplified entry point for sites
  *
- * Reads foundation configuration from __FOUNDATION_CONFIG__ which is injected
- * by the Vite config based on site.yml settings.
+ * Reads configuration from (in order of priority):
+ * 1. __DATA__ element (dynamic backends) - combined foundation config + site content
+ * 2. Build-time __FOUNDATION_CONFIG__ (static builds) - foundation config only
  *
  * @param {Object} options
  * @param {Promise} options.foundation - Promise from import('#foundation')
  * @param {Promise} options.styles - Promise from import('#foundation/styles')
  */
 async function start({ foundation, styles } = {}) {
-  // Read config injected by Vite's define option (from site.yml)
+  // Try __DATA__ first (dynamic backends inject combined config + content)
+  const data = await decodeData()
+
+  if (data) {
+    // Dynamic backend mode - foundation loaded from URL, content from data
+    return initRuntime(
+      { url: data.foundation.url, cssUrl: data.foundation.cssUrl },
+      { configData: data.content }
+    )
+  }
+
+  // Static build mode - use build-time config
   const config =
     typeof __FOUNDATION_CONFIG__ !== 'undefined' ? __FOUNDATION_CONFIG__ : { mode: 'bundled' }
 
   if (config.mode === 'runtime') {
-    // Runtime mode: load foundation dynamically from URL
-    return initRuntime({
-      url: config.url,
-      cssUrl: config.cssUrl
-    })
+    // Runtime mode (foundation URL in site.yml)
+    return initRuntime({ url: config.url, cssUrl: config.cssUrl })
   } else {
-    // Bundled mode: await the foundation and styles imports
+    // Bundled mode - foundation included in build
     const [foundationModule] = await Promise.all([foundation, styles])
     return initRuntime(foundationModule)
   }