@ecopages/ecopages-jsx 0.2.0-beta.30 → 0.2.0-beta.32

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ecopages/ecopages-jsx",
-  "version": "0.2.0-beta.30",
+  "version": "0.2.0-beta.32",
   "description": "JSX integration plugin for Ecopages",
   "keywords": [
     "ecopages",
@@ -31,12 +31,12 @@
     "directory": "packages/integrations/ecopages-jsx"
   },
   "dependencies": {
-    "@ecopages/mdx": "0.2.0-beta.30",
+    "@ecopages/mdx": "0.2.0-beta.32",
     "@mdx-js/mdx": "^3.1.1",
     "vfile": "^6.0.3"
   },
   "peerDependencies": {
-    "@ecopages/core": "0.2.0-beta.30",
+    "@ecopages/core": "0.2.0-beta.32",
     "@ecopages/jsx": "0.3.0-beta.3",
     "@ecopages/radiant": "0.3.0-beta.3"
   }

package/src/dev-transform/ecopages-jsx-dev-transform-contributor.d.ts

@@ -0,0 +1,17 @@
+import type { EcoBuildPlugin } from '@ecopages/core/plugins/integration-plugin';
+import type { DevTransformBundleContributor } from '@ecopages/core/dev/transform-server';
+import type { EcopagesJsxHmrStrategy } from '../ecopages-jsx-hmr-strategy.js';
+export type EcopagesJsxDevTransformContributorOptions = {
+    strategy: EcopagesJsxHmrStrategy;
+    getMdxLoaderPlugin: () => EcoBuildPlugin | undefined;
+};
+/**
+ * Supplies Ecopages JSX module plugins for the core dev transform bundler.
+ */
+export declare class EcopagesJsxDevTransformContributor implements DevTransformBundleContributor {
+    private readonly strategy;
+    private readonly getMdxLoaderPlugin;
+    constructor(options: EcopagesJsxDevTransformContributorOptions);
+    ownsModule(sourcePath: string): boolean;
+    getModulePlugins(sourcePath: string): Promise<readonly EcoBuildPlugin[]>;
+}

package/src/dev-transform/ecopages-jsx-dev-transform-contributor.js

@@ -0,0 +1,21 @@
+/**
+ * Supplies Ecopages JSX module plugins for the core dev transform bundler.
+ */
+export class EcopagesJsxDevTransformContributor {
+    strategy;
+    getMdxLoaderPlugin;
+    constructor(options) {
+        this.strategy = options.strategy;
+        this.getMdxLoaderPlugin = options.getMdxLoaderPlugin;
+    }
+    ownsModule(sourcePath) {
+        return this.strategy.ownsDevTransformEntrypoint(sourcePath);
+    }
+    async getModulePlugins(sourcePath) {
+        if (!sourcePath.endsWith('.mdx')) {
+            return [];
+        }
+        const mdxLoader = this.getMdxLoaderPlugin();
+        return mdxLoader ? [mdxLoader] : [];
+    }
+}

package/src/eco-embed.js

@@ -1,11 +1,9 @@
-import { eco } from "@ecopages/core";
-function EcoEmbed({
-  component,
-  props,
-  children
-}) {
-  return eco.embed(component, props, children);
+/** @jsxImportSource @ecopages/jsx */
+import { eco } from '@ecopages/core';
+/**
+ * Renders a foreign or same-integration eco component from an Ecopages JSX
+ * file without forcing inline mixed-JSX authoring.
+ */
+export function EcoEmbed({ component, props, children, }) {
+    return eco.embed(component, props, children);
 }
-export {
-  EcoEmbed
-};

package/src/ecopages-jsx-hmr-ownership.js

@@ -1,63 +1,87 @@
-import path from "node:path";
-import { rapidhash } from "@ecopages/core/hash";
+/**
+ * Tracks the source files that participate in the active SSR render tree.
+ *
+ * @remarks
+ * The JSX integration renderer calls {@link updateEjsxHmrOwnership} after each
+ * page, component, or view render so the HMR strategy can answer
+ * "does this changed file affect SSR HTML?" without re-walking the tree on
+ * every watcher event.
+ *
+ * The state is module-scoped because the HMR strategy and renderer live in
+ * different call sites (server strategy vs SSR renderer) and share no other
+ * lifecycle anchor. A fresh state is installed only when the source-file set
+ * changes, so the renderer's per-render hook stays O(1) in the steady state.
+ */
+import path from 'node:path';
+import { rapidhash } from '@ecopages/core/hash';
 const EMPTY_STATE = {
-  fileOwners: /* @__PURE__ */ new Set(),
-  hash: ""
+    fileOwners: new Set(),
+    hash: '',
 };
 let currentState = EMPTY_STATE;
-function getEjsxHmrOwnership() {
-  return currentState;
+/**
+ * Returns the most recently recorded active render tree.
+ */
+export function getEjsxHmrOwnership() {
+    return currentState;
 }
-function updateEjsxHmrOwnership(components) {
-  const files = collectFileOwners(components);
-  const hash = hashFileSet(files);
-  if (hash === currentState.hash) {
-    return;
-  }
-  currentState = {
-    fileOwners: files,
-    hash
-  };
+/**
+ * Updates the active render tree from one or more root components.
+ *
+ * @remarks
+ * Walks each root's `config.__eco.file`, `config.dependencies.components[*].config`,
+ * and `config.layouts[*].config` recursively, collecting every file path. The
+ * state is replaced only when the resulting file set has a different hash, so
+ * the renderer's per-render hook is free in the steady state.
+ */
+export function updateEjsxHmrOwnership(components) {
+    const files = collectFileOwners(components);
+    const hash = hashFileSet(files);
+    if (hash === currentState.hash) {
+        return;
+    }
+    currentState = {
+        fileOwners: files,
+        hash,
+    };
 }
-function resetEjsxHmrOwnership() {
-  currentState = EMPTY_STATE;
+/**
+ * Resets the state to empty. Used by tests and by HMR manager teardown.
+ */
+export function resetEjsxHmrOwnership() {
+    currentState = EMPTY_STATE;
 }
 function collectFileOwners(components) {
-  const files = /* @__PURE__ */ new Set();
-  const visited = /* @__PURE__ */ new Set();
-  const visit = (config) => {
-    const file = config?.__eco?.file;
-    if (!file) {
-      return;
-    }
-    const resolved = path.resolve(file);
-    if (visited.has(resolved)) {
-      return;
-    }
-    visited.add(resolved);
-    files.add(resolved);
-    for (const dependency of config?.dependencies?.components ?? []) {
-      visit(dependency?.config);
+    const files = new Set();
+    const visited = new Set();
+    const visit = (config) => {
+        const file = config?.__eco?.file;
+        if (!file) {
+            return;
+        }
+        const resolved = path.resolve(file);
+        if (visited.has(resolved)) {
+            return;
+        }
+        visited.add(resolved);
+        files.add(resolved);
+        for (const dependency of config?.dependencies?.components ?? []) {
+            visit(dependency?.config);
+        }
+        for (const layout of config?.layouts ?? []) {
+            visit(layout?.config);
+        }
+    };
+    for (const component of components) {
+        visit(component?.config);
     }
-    for (const layout of config?.layouts ?? []) {
-      visit(layout?.config);
-    }
-  };
-  for (const component of components) {
-    visit(component?.config);
-  }
-  return files;
+    return files;
 }
 function hashFileSet(files) {
-  if (files.size === 0) {
-    return "";
-  }
-  const sorted = Array.from(files).sort();
-  const joined = sorted.join("\n");
-  return rapidhash(joined).toString(36);
+    if (files.size === 0) {
+        return '';
+    }
+    const sorted = Array.from(files).sort();
+    const joined = sorted.join('\n');
+    return rapidhash(joined).toString(36);
 }
-export {
-  getEjsxHmrOwnership,
-  resetEjsxHmrOwnership,
-  updateEjsxHmrOwnership
-};

package/src/ecopages-jsx-hmr-strategy.d.ts

@@ -1,35 +1,18 @@
-/**
- * HMR strategy for JSX integration-owned SSR source modules.
- *
- * @remarks
- * Edits to files that produce SSR HTML (page sources, layout sources, components
- * that the active render tree depends on) need a soft page refetch so the
- * browser picks up the new markup. Plain `update` events re-import modules on
- * the client but leave the server-rendered DOM stale.
- *
- * The strategy matches a file when any of these hold:
- * - the file lives under `pagesDir` or `layoutsDir` and has a JSX `templatesExt`
- * - the file appears in the active render tree's component dependency graph
- *
- * It defers registered HMR entrypoints to {@link JsHmrStrategy} so script-only
- * edits keep their existing `update`-then-hot-accept path. It also defers
- * include templates and explicit server views to {@link ServerRenderedTemplateHmrStrategy}
- * by returning `false` for those paths.
- */
 import { HmrStrategy, type HmrAction } from '@ecopages/core/hmr/hmr-strategy';
-export interface EcopagesJsxHmrStrategyContext {
-    getWatchedFiles(): Map<string, string>;
+import type { HmrRegisteredEntrypointsContext } from '@ecopages/core/hmr/hmr-registered-entrypoints-context';
+export type EcopagesJsxHmrStrategyContext = HmrRegisteredEntrypointsContext & {
     getSrcDir(): string;
     getPagesDir(): string;
     getLayoutsDir(): string;
     getIncludesDir(): string;
     getTemplateExtensions(): ReadonlyArray<string>;
-}
+};
 export declare class EcopagesJsxHmrStrategy extends HmrStrategy {
     readonly type: 100;
     private readonly context;
     constructor(context: EcopagesJsxHmrStrategyContext);
     matches(filePath: string): boolean;
+    ownsDevTransformEntrypoint(filePath: string): boolean;
     process(filePath: string): Promise<HmrAction>;
     private isPageOrLayoutSource;
     private hasJsxTemplateExtension;

package/src/ecopages-jsx-hmr-strategy.js

@@ -1,63 +1,67 @@
-import path from "node:path";
-import { HmrStrategy, HmrStrategyType } from "@ecopages/core/hmr/hmr-strategy";
-import { getEjsxHmrOwnership } from "./ecopages-jsx-hmr-ownership.js";
-class EcopagesJsxHmrStrategy extends HmrStrategy {
-  type = HmrStrategyType.INTEGRATION;
-  context;
-  constructor(context) {
-    super();
-    this.context = context;
-  }
-  matches(filePath) {
-    const resolvedPath = path.resolve(filePath);
-    const watchedFiles = this.context.getWatchedFiles();
-    if (watchedFiles.has(resolvedPath) || [...watchedFiles.keys()].some((key) => path.resolve(key) === resolvedPath)) {
-      return false;
+import path from 'node:path';
+import { HmrStrategy, HmrStrategyType } from '@ecopages/core/hmr/hmr-strategy';
+import { isRegisteredDevTransformEntrypoint } from '@ecopages/core/hmr/hmr-entrypoint-output';
+import { getEjsxHmrOwnership } from './ecopages-jsx-hmr-ownership.js';
+export class EcopagesJsxHmrStrategy extends HmrStrategy {
+    type = HmrStrategyType.INTEGRATION;
+    context;
+    constructor(context) {
+        super();
+        this.context = context;
     }
-    const srcDir = path.resolve(this.context.getSrcDir());
-    if (!resolvedPath.startsWith(`${srcDir}${path.sep}`) && resolvedPath !== srcDir) {
-      return false;
-    }
-    const includesDir = path.resolve(this.context.getIncludesDir());
-    if (includesDir && (resolvedPath === includesDir || resolvedPath.startsWith(`${includesDir}${path.sep}`))) {
-      return false;
+    matches(filePath) {
+        const resolvedPath = path.resolve(filePath);
+        if (isRegisteredDevTransformEntrypoint(this.context.getRegisteredEntrypoints(), resolvedPath)) {
+            return false;
+        }
+        const srcDir = path.resolve(this.context.getSrcDir());
+        if (!resolvedPath.startsWith(`${srcDir}${path.sep}`) && resolvedPath !== srcDir) {
+            return false;
+        }
+        const includesDir = path.resolve(this.context.getIncludesDir());
+        if (includesDir && (resolvedPath === includesDir || resolvedPath.startsWith(`${includesDir}${path.sep}`))) {
+            return false;
+        }
+        if (this.isPageOrLayoutSource(resolvedPath)) {
+            return this.hasJsxTemplateExtension(resolvedPath);
+        }
+        const ownership = getEjsxHmrOwnership();
+        if (ownership.fileOwners.has(resolvedPath)) {
+            return true;
+        }
+        return false;
     }
-    if (this.isPageOrLayoutSource(resolvedPath)) {
-      return this.hasJsxTemplateExtension(resolvedPath);
+    ownsDevTransformEntrypoint(filePath) {
+        const resolvedPath = path.resolve(filePath);
+        if (!isRegisteredDevTransformEntrypoint(this.context.getRegisteredEntrypoints(), resolvedPath)) {
+            return false;
+        }
+        return this.isPageOrLayoutSource(resolvedPath) && this.hasJsxTemplateExtension(resolvedPath);
     }
-    const ownership = getEjsxHmrOwnership();
-    if (ownership.fileOwners.has(resolvedPath)) {
-      return true;
+    async process(filePath) {
+        return {
+            type: 'broadcast',
+            events: [
+                {
+                    type: 'layout-update',
+                    path: filePath,
+                    timestamp: Date.now(),
+                },
+            ],
+        };
     }
-    return false;
-  }
-  async process(filePath) {
-    return {
-      type: "broadcast",
-      events: [
-        {
-          type: "layout-update",
-          path: filePath,
-          timestamp: Date.now()
-        }
-      ]
-    };
-  }
-  isPageOrLayoutSource(resolvedPath) {
-    const pagesDir = path.resolve(this.context.getPagesDir());
-    const layoutsDir = path.resolve(this.context.getLayoutsDir());
-    if (pagesDir && (resolvedPath === pagesDir || resolvedPath.startsWith(`${pagesDir}${path.sep}`))) {
-      return true;
+    isPageOrLayoutSource(resolvedPath) {
+        const pagesDir = path.resolve(this.context.getPagesDir());
+        const layoutsDir = path.resolve(this.context.getLayoutsDir());
+        if (pagesDir && (resolvedPath === pagesDir || resolvedPath.startsWith(`${pagesDir}${path.sep}`))) {
+            return true;
+        }
+        if (layoutsDir && (resolvedPath === layoutsDir || resolvedPath.startsWith(`${layoutsDir}${path.sep}`))) {
+            return true;
+        }
+        return false;
     }
-    if (layoutsDir && (resolvedPath === layoutsDir || resolvedPath.startsWith(`${layoutsDir}${path.sep}`))) {
-      return true;
+    hasJsxTemplateExtension(resolvedPath) {
+        return this.context.getTemplateExtensions().some((extension) => resolvedPath.endsWith(extension));
     }
-    return false;
-  }
-  hasJsxTemplateExtension(resolvedPath) {
-    return this.context.getTemplateExtensions().some((extension) => resolvedPath.endsWith(extension));
-  }
 }
-export {
-  EcopagesJsxHmrStrategy
-};

package/src/ecopages-jsx-mdx.js

@@ -1,82 +1,70 @@
-import { readFile } from "node:fs/promises";
-import { ensurePageConfigLayouts } from "@ecopages/core/eco/page-layout-normalization";
-import { rapidhash } from "@ecopages/core/hash";
-import {
-  appendMdxExtensions,
-  createMdxExtensionFilter,
-  createMdxLoaderPlugin as createMdxLoaderPluginCore,
-  resolveMdxCompilerOptions as resolveMdxCompilerOptionsCore
-} from "@ecopages/mdx/core";
-import { VFile } from "vfile";
-import { ECOPAGES_JSX_PLUGIN_NAME } from "./ecopages-jsx.constants.js";
-const resolveMdxCompilerOptions = (mdxOptions) => resolveMdxCompilerOptionsCore(mdxOptions, {
-  jsxImportSource: "@ecopages/jsx",
-  defaults: {
-    format: "detect",
-    outputFormat: "program"
-  }
+import { readFile } from 'node:fs/promises';
+import { ensurePageConfigLayouts } from '@ecopages/core/eco/page-layout-normalization';
+import { rapidhash } from '@ecopages/core/hash';
+import { appendMdxExtensions, createMdxExtensionFilter, createMdxLoaderPlugin as createMdxLoaderPluginCore, resolveMdxCompilerOptions as resolveMdxCompilerOptionsCore, } from '@ecopages/mdx/core';
+import { VFile } from 'vfile';
+import { ECOPAGES_JSX_PLUGIN_NAME } from './ecopages-jsx.constants.js';
+export { appendMdxExtensions, createMdxExtensionFilter };
+export const resolveMdxCompilerOptions = (mdxOptions) => resolveMdxCompilerOptionsCore(mdxOptions, {
+    jsxImportSource: '@ecopages/jsx',
+    defaults: {
+        format: 'detect',
+        outputFormat: 'program',
+    },
 });
-const createMdxLoaderPlugin = (compilerOptions, extensions) => createMdxLoaderPluginCore({
-  name: "ecopages-jsx-mdx-loader",
-  compilerOptions,
-  extensions,
-  includeSourceMap: false,
-  loader: "js"
+export const createMdxLoaderPlugin = (compilerOptions, extensions) => createMdxLoaderPluginCore({
+    name: 'ecopages-jsx-mdx-loader',
+    compilerOptions,
+    extensions,
+    includeSourceMap: false,
+    loader: 'js',
 });
-const registerBunMdxPlugin = async (compilerOptions, extensions) => {
-  if (typeof Bun === "undefined") {
-    return;
-  }
-  const filter = createMdxExtensionFilter(extensions);
-  Bun.plugin({
-    name: "ecopages-jsx-mdx",
-    setup(build) {
-      build.onLoad({ filter }, async (args) => {
-        const { compile } = await import("@mdx-js/mdx");
-        const source = await readFile(args.path, "utf-8");
-        const compiled = await compile(new VFile({ value: source, path: args.path }), compilerOptions);
-        return { contents: String(compiled.value), loader: "js" };
-      });
+export const registerBunMdxPlugin = async (compilerOptions, extensions) => {
+    if (typeof Bun === 'undefined') {
+        return;
     }
-  });
+    const filter = createMdxExtensionFilter(extensions);
+    Bun.plugin({
+        name: 'ecopages-jsx-mdx',
+        setup(build) {
+            build.onLoad({ filter }, async (args) => {
+                const { compile } = await import('@mdx-js/mdx');
+                const source = await readFile(args.path, 'utf-8');
+                const compiled = await compile(new VFile({ value: source, path: args.path }), compilerOptions);
+                return { contents: String(compiled.value), loader: 'js' };
+            });
+        },
+    });
 };
-const isMdxFile = (filePath, extensions) => {
-  return extensions.some((ext) => filePath.endsWith(ext));
+export const isMdxFile = (filePath, extensions) => {
+    return extensions.some((ext) => filePath.endsWith(ext));
 };
-const normalizeMdxPageModule = (file, module) => {
-  if (typeof module.default !== "function") {
-    throw new TypeError("MDX file must export a callable default component.");
-  }
-  const Page = module.default;
-  const normalizedConfig = {
-    ...module.config ?? Page.config ?? {},
-    __eco: module.config?.__eco ?? Page.config?.__eco ?? {
-      id: String(rapidhash(file)),
-      file,
-      integration: ECOPAGES_JSX_PLUGIN_NAME
+export const normalizeMdxPageModule = (file, module) => {
+    if (typeof module.default !== 'function') {
+        throw new TypeError('MDX file must export a callable default component.');
     }
-  };
-  if (module.layout && !(normalizedConfig.layouts && normalizedConfig.layouts.length > 0)) {
-    normalizedConfig.layout = module.layout;
-  }
-  ensurePageConfigLayouts(normalizedConfig);
-  const wrappedPage = async (props) => await Page(props);
-  wrappedPage.config = normalizedConfig;
-  if (module.getMetadata ?? Page.metadata) {
-    wrappedPage.metadata = module.getMetadata ?? Page.metadata;
-  }
-  return {
-    ...module,
-    default: wrappedPage,
-    config: normalizedConfig
-  };
-};
-export {
-  appendMdxExtensions,
-  createMdxExtensionFilter,
-  createMdxLoaderPlugin,
-  isMdxFile,
-  normalizeMdxPageModule,
-  registerBunMdxPlugin,
-  resolveMdxCompilerOptions
+    const Page = module.default;
+    const normalizedConfig = {
+        ...(module.config ?? Page.config ?? {}),
+        __eco: module.config?.__eco ??
+            Page.config?.__eco ?? {
+            id: String(rapidhash(file)),
+            file,
+            integration: ECOPAGES_JSX_PLUGIN_NAME,
+        },
+    };
+    if (module.layout && !(normalizedConfig.layouts && normalizedConfig.layouts.length > 0)) {
+        normalizedConfig.layout = module.layout;
+    }
+    ensurePageConfigLayouts(normalizedConfig);
+    const wrappedPage = async (props) => await Page(props);
+    wrappedPage.config = normalizedConfig;
+    if (module.getMetadata ?? Page.metadata) {
+        wrappedPage.metadata = module.getMetadata ?? Page.metadata;
+    }
+    return {
+        ...module,
+        default: wrappedPage,
+        config: normalizedConfig,
+    };
 };