@ecopages/ecopages-jsx 0.2.0-alpha.22 → 0.2.0-alpha.23

package/CHANGELOG.md

@@ -11,6 +11,7 @@
 - Patched the Ecopages JSX browser runtime bundle so nested SVG templates restore canonical camel-cased SVG tag names during client rendering.
 - Aligned Ecopages JSX peer dependency ranges with the current `@ecopages/jsx` and `@ecopages/radiant` alpha releases.
 - Aligned Radiant SSR and hydration wiring with the public `@ecopages/radiant/server/render-component` and `@ecopages/radiant/client/hydrator` entrypoints so JSX apps install an explicit client hydrator bootstrap instead of relying on implicit side effects.
+- Updated the Ecopages JSX Radiant browser runtime for the `RadiantElement` and `RadiantController` API surface and switched the explicit hydrator bootstrap to `@ecopages/radiant/client/install-hydrator`.
 - Fixed Radiant SSR page inspection to install the light-DOM shim before JSX page modules are imported outside the normal render pass.
 - Restored direct `EcopagesJsxPlugin` construction so the exported class still accepts the public plugin options shape.
 - Fixed intrinsic custom-element asset discovery so Ecopages JSX registers scripts declared with decorator and function-call `customElement(...)` syntax.

package/README.md

@@ -48,9 +48,9 @@ Radiant support is enabled by default. When `radiant: true`, the plugin keeps th
 
 - Ecopages JSX owns page-level JSX SSR and container hydration.
 - Radiant SSR is activated on the server through `@ecopages/radiant/server/render-component`.
-- Radiant host hydration is activated on the client through an explicit head bootstrap that calls `installRadiantHydrator()` from `@ecopages/radiant/client/hydrator` before intrinsic custom-element modules load.
+- Radiant host hydration is activated on the client through an explicit head bootstrap that imports `@ecopages/radiant/client/install-hydrator` before intrinsic custom-element modules load.
 
-That means server-rendered `RadiantComponent` hosts hydrate in place only when both the SSR markers and the explicit client hydrator are present. Without the client hydrator, Radiant intentionally falls back to a fresh client render on first connect.
+That means server-rendered `RadiantElement` hosts hydrate in place only when both the SSR markers and the explicit client hydrator are present. Without the client hydrator, Radiant intentionally falls back to a fresh client render on first connect.
 
 ```ts
 ecopagesJsxPlugin({
@@ -60,7 +60,7 @@ ecopagesJsxPlugin({
 
 Set `radiant: false` when your JSX pages do not need Radiant SSR or the Radiant browser runtime on a given app.
 
-The plugin bootstrap is intentionally explicit rather than relying on unrelated imports to install the Radiant hydrator as a side effect.
+The plugin bootstrap is intentionally explicit rather than depending on custom-element modules to install the Radiant hydrator opportunistically.
 
 ## MDX Support
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ecopages/ecopages-jsx",
-  "version": "0.2.0-alpha.22",
+  "version": "0.2.0-alpha.23",
   "description": "JSX integration plugin for Ecopages",
   "keywords": [
     "ecopages",
@@ -21,8 +21,8 @@
     "vfile": "^6.0.3"
   },
   "peerDependencies": {
-    "@ecopages/core": "0.2.0-alpha.22",
-    "@ecopages/jsx": "0.3.0-alpha.4",
-    "@ecopages/radiant": "0.3.0-alpha.4"
+    "@ecopages/core": "0.2.0-alpha.23",
+    "@ecopages/jsx": "0.3.0-alpha.5",
+    "@ecopages/radiant": "0.3.0-alpha.5"
   }
 }

package/src/ecopages-jsx.types.d.ts

@@ -38,8 +38,9 @@ export type EcopagesJsxPluginOptions = Omit<IntegrationPluginConfig, 'name' | 'e
      * When enabled, Ecopages JSX:
      * - imports `@ecopages/radiant/server/render-component` before Radiant SSR
      * - exposes browser-safe Radiant bare specifiers through the runtime import map
-     * - injects an explicit client bootstrap that calls `installRadiantHydrator()`
-     *   before intrinsic custom-element modules load
+     * - injects an explicit client bootstrap that imports
+     *   `@ecopages/radiant/client/install-hydrator` before intrinsic
+     *   custom-element modules load
      *
      * Set to `false` when pages do not use Radiant web components.
      * @default true

package/src/services/jsx-runtime-bundle.service.d.ts

@@ -20,6 +20,7 @@ export declare class JsxRuntimeBundleService {
     private cachedSpecifierMap;
     private cachedJsxEntryModulePath;
     private cachedRadiantEntryModulePath;
+    private cachedRadiantInstallHydratorEntryModulePath;
     constructor(config: JsxRuntimeBundleServiceConfig);
     setRootDir(rootDir: string | undefined): void;
     /**
@@ -54,4 +55,5 @@ export declare class JsxRuntimeBundleService {
     private getRadiantBrowserRuntimeModules;
     private resolvePackageExportModulePath;
     private getOrCreateRadiantEntryModulePath;
+    private getOrCreateRadiantInstallHydratorEntryModulePath;
 }

package/src/services/jsx-runtime-bundle.service.js

@@ -9,7 +9,8 @@ import {
 } from "@ecopages/core/services/asset-processing-service";
 const VENDOR_FILE_NAMES = {
   jsx: "ecopages-jsx-esm.js",
-  radiant: "ecopages-radiant-esm.js"
+  radiant: "ecopages-radiant-esm.js",
+  radiantInstallHydrator: "ecopages-radiant-install-hydrator-esm.js"
 };
 const RADIANT_HYDRATOR_BOOTSTRAP_ATTRIBUTE = "data-ecopages-jsx-radiant-hydrator";
 const JSX_RUNTIME_NAMESPACE_REPAIR_SNIPPET = "function rG(W,G,J){let j=G instanceof Element?G:G?.parentElement,U=j?.namespaceURI??K9,$=j?.localName,X=W.firstElementChild;if(!X)return;let F=J??X.localName,Z=O9(U,$,F);if(X.namespaceURI===Z&&X.localName===F)return;W.replaceChild(tG(X,Z,F),X)}function tG(W,G,J){let j=document.createElementNS(G,J);for(let U of Array.from(W.attributes)){if(U.namespaceURI){j.setAttributeNS(U.namespaceURI,U.name,U.value);continue}n(j,U.name,U.value)}return j.append(...W.childNodes),j}";
@@ -50,13 +51,19 @@ function isBrowserRuntimeRadiantSpecifier(exportKey) {
   if (exportKey === "." || exportKey.startsWith("./context/")) {
     return true;
   }
+  if (exportKey === "./controller-registry") {
+    return true;
+  }
   if (exportKey === "./client/hydrator") {
     return true;
   }
+  if (exportKey === "./client/install-hydrator") {
+    return true;
+  }
   if (exportKey.startsWith("./decorators/") || exportKey.startsWith("./helpers/")) {
     return true;
   }
-  return exportKey === "./core/radiant-component" || exportKey === "./core/radiant-element";
+  return exportKey === "./core/radiant-controller" || exportKey === "./core/radiant-element";
 }
 function replaceExactOnce(source, search, replacement, label) {
   if (!source.includes(search)) {
@@ -92,6 +99,7 @@ class JsxRuntimeBundleService {
   cachedSpecifierMap;
   cachedJsxEntryModulePath;
   cachedRadiantEntryModulePath;
+  cachedRadiantInstallHydratorEntryModulePath;
   constructor(config) {
     this.config = config;
   }
@@ -149,11 +157,17 @@ class JsxRuntimeBundleService {
     );
     if (this.config.radiant) {
       const radiantEntryModulePath = await this.getOrCreateRadiantEntryModulePath();
+      const radiantInstallHydratorEntryModulePath = await this.getOrCreateRadiantInstallHydratorEntryModulePath();
       deps.push(
         createBrowserRuntimeScriptAsset({
           importPath: radiantEntryModulePath,
           name: "ecopages-radiant-esm",
           fileName: VENDOR_FILE_NAMES.radiant
+        }),
+        createBrowserRuntimeScriptAsset({
+          importPath: radiantInstallHydratorEntryModulePath,
+          name: "ecopages-radiant-install-hydrator-esm",
+          fileName: VENDOR_FILE_NAMES.radiantInstallHydrator
         })
       );
     }
@@ -171,10 +185,7 @@ class JsxRuntimeBundleService {
     });
   }
   createRadiantHydratorBootstrapSource() {
-    return [
-      "import { installRadiantHydrator } from '@ecopages/radiant/client/hydrator';",
-      "installRadiantHydrator();"
-    ].join("\n");
+    return "import '@ecopages/radiant/client/install-hydrator';";
   }
   getArtifactsDir() {
     const rootDir = this.config.rootDir ?? process.cwd();
@@ -197,6 +208,9 @@ class JsxRuntimeBundleService {
     };
     if (this.config.radiant) {
       const radiantVendorUrl = buildBrowserRuntimeAssetUrl(VENDOR_FILE_NAMES.radiant);
+      const radiantInstallHydratorVendorUrl = buildBrowserRuntimeAssetUrl(
+        VENDOR_FILE_NAMES.radiantInstallHydrator
+      );
       const radiantPkg = JSON.parse(
         readFileSync(findPackageManifestPath("@ecopages/radiant"), "utf8")
       );
@@ -205,7 +219,7 @@ class JsxRuntimeBundleService {
           continue;
         }
         const specifier = key === "." ? "@ecopages/radiant" : `@ecopages/radiant${key.slice(1)}`;
-        specifierMap[specifier] = radiantVendorUrl;
+        specifierMap[specifier] = key === "./client/install-hydrator" ? radiantInstallHydratorVendorUrl : radiantVendorUrl;
       }
     }
     this.cachedSpecifierMap = specifierMap;
@@ -280,6 +294,31 @@ class JsxRuntimeBundleService {
     this.cachedRadiantEntryModulePath = filePath;
     return filePath;
   }
+  async getOrCreateRadiantInstallHydratorEntryModulePath() {
+    if (this.cachedRadiantInstallHydratorEntryModulePath) {
+      return this.cachedRadiantInstallHydratorEntryModulePath;
+    }
+    const artifactsDir = this.getArtifactsDir();
+    const filePath = path.join(artifactsDir, "ecopages-radiant-install-hydrator-esm-entry.mjs");
+    const manifestPath = findPackageManifestPath("@ecopages/radiant");
+    const packageDir = path.dirname(realpathSync(manifestPath));
+    const radiantPkg = JSON.parse(readFileSync(manifestPath, "utf8"));
+    const modulePath = this.resolvePackageExportModulePath(
+      packageDir,
+      "./client/install-hydrator",
+      radiantPkg.exports?.["./client/install-hydrator"]
+    );
+    mkdirSync(artifactsDir, { recursive: true });
+    writeFileSync(
+      filePath,
+      `import '${this.getEntryImportPath(artifactsDir, modulePath)}';
+export {};
+`,
+      "utf8"
+    );
+    this.cachedRadiantInstallHydratorEntryModulePath = filePath;
+    return filePath;
+  }
 }
 export {
   JsxRuntimeBundleService,