@uniweb/core 0.6.1 → 0.6.2

package/src/uniweb.js

@@ -1,43 +1,92 @@
 /**
  * Uniweb Core Runtime
  *
- * The main runtime instance that manages the website, foundation components,
- * and provides utilities to components.
+ * Singleton that holds the Website, routing components, icon resolver, and
+ * foundation declaration references. Kit hooks, the icon resolver, and the
+ * prepare-props pipeline read from here via `globalThis.uniweb`.
+ *
+ * The foundation and extensions are passed at construction time — the Website
+ * constructs its FetcherDispatcher from them, and the Uniweb singleton caches
+ * the same references so the kit can still do `globalThis.uniweb.getComponent(name)`
+ * and similar lookups without touching the Website.
  */
 
 import Website from './website.js'
 import Analytics from './analytics.js'
 
 export default class Uniweb {
-  constructor(configData) {
-    this.activeWebsite = new Website(configData)
-    this.childBlockRenderer = null // Function to render child blocks
-    this.routingComponents = {} // Link, SafeHtml, useNavigate, etc.
-    this.foundation = null // The loaded foundation module
-    this.foundationConfig = {} // Configuration from foundation (capabilities)
-    this.meta = {} // Per-component runtime metadata (from meta.js)
-    this.extensions = [] // Array of { foundation, meta } objects
+  /**
+   * @param {Object} options
+   * @param {Object} options.content - Site content payload (pages, theme, config, layouts, ...).
+   * @param {Object|null} [options.foundation] - Loaded primary foundation module.
+   * @param {Array<Object>} [options.extensions] - Loaded extension modules.
+   * @param {{ resolve: Function }} [options.defaultFetcher] - Framework default fetcher
+   *   used by the dispatcher's fallback when no foundation route matches.
+   * @param {{ resolve: Function, cacheKey?: Function }} [options.transport] -
+   *   Runtime-level transport override. When set, every Layer-1 request is
+   *   routed through this transport, bypassing foundation routes and the
+   *   framework default. Used only by the editor's preview iframe; normal
+   *   sites never pass this option.
+   */
+  constructor({ content = {}, foundation = null, extensions = [], defaultFetcher = null, transport = null, dev = false } = {}) {
+    this.activeWebsite = new Website({ content, foundation, extensions, defaultFetcher, transport, dev })
+
+    this.foundation = foundation
+    this.foundationConfig = {}
+    this.meta = foundation?.default?.meta || {}
+    this.extensions = []
+
+    if (foundation?.default?.capabilities) {
+      this.foundationConfig = { ...foundation.default.capabilities }
+    }
+    if (foundation?.default?.layoutMeta) {
+      this.foundationConfig.layoutMeta = foundation.default.layoutMeta
+    }
+    if (foundation?.default?.handlers) {
+      this.foundationConfig.handlers = foundation.default.handlers
+    }
+    if (foundation?.default?.viewTransitions !== undefined) {
+      this.foundationConfig.viewTransitions = foundation.default.viewTransitions
+    }
+
+    for (const ext of extensions) {
+      this._wireExtension(ext)
+    }
+
+    this.childBlockRenderer = null
+    this.routingComponents = {}
     this.language = 'en'
 
     // Icon resolver: (library, name) => Promise<string|null>
-    // Set by runtime based on site config
+    // Set by the runtime from site config.
     this.iconResolver = null
 
     // Pre-populated icon cache for SSR: Map<"family:name", svgString>
-    // Populated by prerender before rendering, read synchronously by Icon component
+    // Populated by prerender before rendering, read synchronously by Icon.
     this.iconCache = new Map()
 
-    // Initialize analytics (disabled by default, configure via site config)
-    this.analytics = new Analytics(configData.analytics || {})
+    this.analytics = new Analytics(content?.analytics || content?.config?.analytics || {})
 
     Object.seal(this)
   }
 
   /**
-   * Resolve an icon by library and name
-   * @param {string} library - Icon family (lucide, heroicons, etc.)
-   * @param {string} name - Icon name (check, arrow-right, etc.)
-   * @returns {Promise<string|null>} SVG string or null
+   * Wire an extension into the singleton. Kit's getComponent falls through
+   * from the primary foundation to each extension in declared order; meta
+   * lookups do the same.
+   *
+   * @private
+   */
+  _wireExtension(foundation) {
+    const meta = foundation?.default?.meta || {}
+    this.extensions.push({ foundation, meta })
+  }
+
+  /**
+   * Resolve an icon by library and name.
+   * @param {string} library
+   * @param {string} name
+   * @returns {Promise<string|null>}
    */
   async resolveIcon(library, name) {
     if (!this.iconResolver) {
@@ -48,114 +97,56 @@ export default class Uniweb {
   }
 
   /**
-   * Get a cached icon synchronously (for SSR/prerender)
-   * @param {string} library - Icon family code
-   * @param {string} name - Icon name
-   * @returns {string|null} SVG string or null if not cached
+   * Synchronous icon lookup for SSR.
    */
   getIconSync(library, name) {
     return this.iconCache.get(`${library}:${name}`) || null
   }
 
   /**
-   * Set the foundation module after loading
-   * @param {Object} foundation - The loaded ESM foundation module
-   */
-  setFoundation(foundation) {
-    this.foundation = foundation
-
-    // Store per-component metadata if present (lives under default export)
-    if (foundation.default?.meta) {
-      this.meta = foundation.default.meta
-    }
-  }
-
-  /**
-   * Register an extension (secondary foundation)
-   * @param {Object} foundation - The loaded ESM extension module
-   */
-  registerExtension(foundation) {
-    const meta = foundation.default?.meta || {}
-    this.extensions.push({ foundation, meta })
-  }
-
-  /**
-   * Get runtime metadata for a component
-   * @param {string} componentName
-   * @returns {Object|null} Meta with defaults, context, initialState, background, data
+   * Get per-component runtime metadata — primary first, then extensions in
+   * declared order.
    */
   getComponentMeta(componentName) {
     const primary = this.meta[componentName]
     if (primary) return primary
-
     for (const ext of this.extensions) {
       const meta = ext.meta[componentName]
       if (meta) return meta
     }
-
     return null
   }
 
-  /**
-   * Get default param values for a component
-   * @param {string} componentName
-   * @returns {Object} Default values (empty object if none)
-   */
   getComponentDefaults(componentName) {
     return this.getComponentMeta(componentName)?.defaults || {}
   }
 
-  /**
-   * Get a component from the foundation by name
-   * @param {string} name - Component name
-   * @returns {React.ComponentType|undefined}
-   */
   getComponent(name) {
     if (!this.foundation) {
       console.warn('[Runtime] No foundation loaded')
       return undefined
     }
-
-    // Primary foundation first (components are named exports)
     const primary = this.foundation[name]
     if (primary) return primary
-
-    // Fall through to extensions (declared order)
     for (const ext of this.extensions) {
       const component = ext.foundation[name]
       if (component) return component
     }
-
     return undefined
   }
 
-  /**
-   * List available components from the foundation
-   * @returns {string[]}
-   */
   listComponents() {
     const names = new Set()
-
     if (this.foundation) {
       for (const name of Object.keys(this.foundation)) {
         if (name !== 'default') names.add(name)
       }
     }
-
     for (const ext of this.extensions) {
       for (const name of Object.keys(ext.foundation)) {
         if (name !== 'default') names.add(name)
       }
     }
-
     return [...names]
   }
-
-  /**
-   * Set foundation configuration
-   * @param {Object} config
-   */
-  setFoundationConfig(config) {
-    this.foundationConfig = config
-  }
 }

package/src/website.js

@@ -7,18 +7,111 @@
 import Page from './page.js'
 import DataStore from './datastore.js'
 import EntityStore from './entity-store.js'
+import FetcherDispatcher from './fetcher-dispatcher.js'
+import ObservableState from './observable-state.js'
 import singularize from './singularize.js'
 
+/**
+ * Website — orchestration root for a single site instance.
+ *
+ * Accepts the site content payload plus the primary foundation and any
+ * extensions. Owns the DataStore (pure cache), EntityStore (cascade resolver),
+ * FetcherDispatcher (route walker + cache+in-flight wiring), and `state`
+ * (site-wide observable slots). Pages are constructed from the content payload;
+ * each page owns its own ObservableState.
+ *
+ * Content-only rebuilds keep the dispatcher and state in place. Foundation
+ * swaps reassemble the dispatcher but preserve the DataStore and state so the
+ * editor's live-edit path doesn't wipe either between keystrokes.
+ *
+ *   new Website({ content, foundation?, extensions?, defaultFetcher?, dev? })
+ */
 export default class Website {
-  constructor(websiteData) {
-    const { pages = [], theme = {}, config = {}, layouts, notFound, versionedScopes = {} } = websiteData
+  constructor({
+    content = {},
+    foundation = null,
+    extensions = [],
+    defaultFetcher = null,
+    transport = null,
+    dev = false,
+  } = {}) {
+
+    // ─── Foundation / dispatcher state (not re-derived on rebuild) ───
+    this._foundation = foundation
+    this._extensions = extensions
+    this._defaultFetcher = defaultFetcher
+    // Runtime-level transport override (editor preview bridge). Stored so
+    // rebuild() reassembles the dispatcher with the same override in place.
+    this._transport = transport
+    this._dev = dev
+
+    this.dataStore = new DataStore()
+    this.fetcher = new FetcherDispatcher({
+      foundation,
+      extensions,
+      dataStore: this.dataStore,
+      defaultFetcher,
+      transport,
+      dev,
+    })
+    this.entityStore = new EntityStore({ website: this })
+
+    // Observable site-wide state — allocated on first access via the `state`
+    // getter, survives content rebuilds. Read-only prop (no `website.state = X`
+    // reassignment) so callers can only mutate slots via website.state.set(...).
+    this._state = null
+
+    // ─── Fields populated by _applyContent (declared up front so Object.seal works) ───
+    this.name = ''
+    this.description = ''
+    this.url = ''
+    this._layoutSets = {}
+    this.notFoundPage = null
+    this._dynamicPageData = new Map()
+    this._dynamicPageCache = new Map()
+    this.pages = []
+    this.activePage = null
+    this.pageRoutes = []
+    this.themeData = {}
+    this.config = {}
+    this.siteDefaultLocale = 'en'
+    this.defaultLocale = 'en'
+    this.activeLocale = 'en'
+    this.locales = []
+    this.activeLang = 'en'
+    this.langs = []
+    this._routeTranslations = {}
+    this.basePath = ''
+    this.versionedScopes = {}
+    this._pageIdMap = new Map()
+
+    this._applyContent(content)
+
+    Object.seal(this)
+  }
+
+  /**
+   * Populate content-derived fields from a site-content payload. Called once
+   * from the constructor and again from `rebuild({ content })`. All state that
+   * belongs on the Website but derives from the content payload lives here.
+   *
+   * @private
+   */
+  _applyContent(content) {
+    const {
+      pages = [],
+      theme = {},
+      config = {},
+      layouts,
+      notFound,
+      versionedScopes = {},
+    } = content || {}
 
-    // Site metadata
     this.name = config.name || ''
     this.description = config.description || ''
     this.url = config.url || ''
 
-    // General area storage: { layoutName: { areaName: Page } }
+    // Layout areas (header/footer/left/right pages scoped per named layout).
     this._layoutSets = {}
     if (layouts && typeof layouts === 'object') {
       for (const [name, areaData] of Object.entries(layouts)) {
@@ -31,77 +124,90 @@ export default class Website {
       }
     }
 
-    // Store 404 page (for SPA routing)
-    // Convention: pages/404/ directory
+    // 404 / not-found page (content payload or /404 route).
     const notFoundData = notFound || pages.find((p) => p.route === '/404') || null
     this.notFoundPage = notFoundData ? new Page(notFoundData, 'notFound', this) : null
 
-    // Filter out 404 from regular pages array
     const regularPages = pages.filter((page) => page.route !== '/404')
 
-    // Store original page data for dynamic pages (needed to create instances on-demand)
+    // Dynamic route templates — retained in original form so the Website can
+    // materialize concrete pages on demand (/blog/:slug → /blog/my-post).
     this._dynamicPageData = new Map()
     for (const pageData of regularPages) {
       if (pageData.isDynamic || pageData.route?.includes(':')) {
         this._dynamicPageData.set(pageData.route, pageData)
       }
     }
-
-    // Cache for dynamically created page instances
     this._dynamicPageCache = new Map()
 
-
-    this.pages = regularPages.map(
-      (page, index) => new Page(page, index, this)
-    )
-
-    // Build parent-child relationships based on route structure
+    this.pages = regularPages.map((page, index) => new Page(page, index, this))
     this.buildPageHierarchy()
 
-    // Find the homepage (root-level index page)
     this.activePage =
       this.pages.find((page) => page.isIndex && page.getNavRoute() === '/') ||
-      this.pages[0]
+      this.pages[0] ||
+      null
 
     this.pageRoutes = this.pages.map((page) => page.route)
     this.themeData = theme
     this.config = config
 
-    // Locale configuration
-    // siteDefaultLocale: the site's true default language (for route translations)
-    // defaultLocale: effective default for URL prefix logic — domainLocale overrides
-    //   to prevent unnecessary /{locale}/ prefixes on domain-locale pages
     this.siteDefaultLocale = config.defaultLanguage || 'en'
     this.defaultLocale = config.domainLocale || this.siteDefaultLocale
     this.activeLocale = config.activeLocale || this.defaultLocale
 
-    // Build locales list from i18n config
     this.locales = this.buildLocalesList(config)
-
-    // Legacy language support (for editor multilingual)
     this.activeLang = this.activeLocale
-    this.langs = this.locales.map(l => ({
-      label: l.label || l.code,
-      value: l.code
-    }))
+    this.langs = this.locales.map((l) => ({ label: l.label || l.code, value: l.code }))
 
-    // Route translations: locale → { forward, reverse } maps
     this._routeTranslations = this._buildRouteTranslations(config)
+    this.versionedScopes = versionedScopes
+  }
 
-    // Deployment base path (set by runtime via setBasePath())
-    this.basePath = ''
-
-    // Runtime data cache (fetcher registered by runtime at startup)
-    this.dataStore = new DataStore()
-
-    // Entity-aware query resolution (uses DataStore for caching)
-    this.entityStore = new EntityStore({ dataStore: this.dataStore })
+  /**
+   * Rebuild in place. Content-only rebuilds preserve the dispatcher and all
+   * state (site and per-page). Passing `foundation` or `extensions` reassembles
+   * the dispatcher; the DataStore cache survives so warm entries aren't lost.
+   *
+   * The returned value is `this` for chaining.
+   *
+   * @param {Object} options
+   * @param {Object} [options.content] - New site-content payload.
+   * @param {Object} [options.foundation] - New primary foundation module.
+   * @param {Array}  [options.extensions] - New extensions array.
+   * @returns {Website}
+   */
+  rebuild({ content, foundation, extensions } = {}) {
+    const foundationChanged = foundation !== undefined
+    const extensionsChanged = extensions !== undefined
+    if (foundationChanged) this._foundation = foundation
+    if (extensionsChanged) this._extensions = extensions
+
+    if (foundationChanged || extensionsChanged) {
+      this.fetcher = new FetcherDispatcher({
+        foundation: this._foundation,
+        extensions: this._extensions,
+        dataStore: this.dataStore,
+        defaultFetcher: this._defaultFetcher,
+        transport: this._transport,
+        dev: this._dev,
+      })
+    }
 
-    // Versioned scopes: route → { versions, latestId }
-    // Scopes are routes where versioning starts (e.g., '/docs')
-    this.versionedScopes = versionedScopes
+    if (content !== undefined) this._applyContent(content)
+    return this
+  }
 
-    Object.seal(this)
+  /**
+   * Observable site-wide state. Foundations write cross-page values here
+   * (authenticated user, appearance preference, a filter set on /search
+   * that other pages honor); fetchers read it via ctx.website.state when
+   * handling site-level fetch configs. Lazily allocated on first read —
+   * sites that never touch state never build one.
+   */
+  get state() {
+    if (!this._state) this._state = new ObservableState()
+    return this._state
   }
 
   /**
@@ -452,16 +558,19 @@ export default class Website {
     const parentPage = this.pages.find(p => p.route === parentRoute || p.getNavRoute() === parentRoute)
 
     if (parentPage && pluralSchema) {
-      // Find collection data from parent's fetch config via DataStore
+      // Find collection data from parent's fetch config via the dispatcher's
+      // peek (sync cache probe). Used to populate the page title / notFound
+      // flag on dynamic pages before the page instance is constructed.
       const parentFetch = parentPage.fetch
       let items = []
 
-      if (parentFetch) {
+      if (parentFetch && this.fetcher) {
         const fetchConfig = Array.isArray(parentFetch)
           ? parentFetch.find(f => f.schema === pluralSchema)
           : (parentFetch.schema === pluralSchema ? parentFetch : null)
         if (fetchConfig) {
-          items = this.dataStore.get(fetchConfig) || []
+          const cached = this.fetcher.peek(fetchConfig, { website: this })
+          items = Array.isArray(cached?.data) ? cached.data : []
         }
       }
 
@@ -664,7 +773,7 @@ export default class Website {
 
     if (!page) {
       // Page not found - return original href (or could warn in dev)
-      if (typeof console !== 'undefined' && process?.env?.NODE_ENV !== 'production') {
+      if (typeof console !== 'undefined' && typeof process !== 'undefined' && process?.env?.NODE_ENV !== 'production') {
         console.warn(`[makeHref] Page not found: ${pageId}`)
       }
       return href