@ecopages/ecopages-jsx 0.2.0-beta.0 → 0.2.0-beta.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ecopages/ecopages-jsx",
-  "version": "0.2.0-beta.0",
+  "version": "0.2.0-beta.10",
   "description": "JSX integration plugin for Ecopages",
   "keywords": [
     "ecopages",
@@ -27,15 +27,16 @@
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/ecopages/ecopages.git",
+    "url": "git+https://github.com/ecopages/ecopages.git",
     "directory": "packages/integrations/ecopages-jsx"
   },
   "dependencies": {
+    "@ecopages/mdx-core": "0.2.0-beta.10",
     "@mdx-js/mdx": "^3.1.1",
     "vfile": "^6.0.3"
   },
   "peerDependencies": {
-    "@ecopages/core": "0.2.0-beta.0",
+    "@ecopages/core": "0.2.0-beta.10",
     "@ecopages/jsx": "0.3.0-alpha.25",
     "@ecopages/radiant": "0.3.0-alpha.25"
   }

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

@@ -1,6 +1,7 @@
 import type { CompileOptions } from '@mdx-js/mdx';
 import type { EcoComponent, EcoComponentConfig, EcoFunctionComponent, EcoPageFile, GetMetadata } from '@ecopages/core';
 import type { EcoBuildPlugin } from '@ecopages/core/plugins/integration-plugin';
+import { appendMdxExtensions, createMdxExtensionFilter } from '@ecopages/mdx-core';
 import type { JsxRenderable } from '@ecopages/jsx';
 import type { EcopagesJsxMdxCompileOptions, EcopagesJsxMdxOptions } from './ecopages-jsx.types.js';
 export type ResolvedMdxCompileOptions = EcopagesJsxMdxCompileOptions & Pick<CompileOptions, 'jsxImportSource' | 'jsxRuntime'>;
@@ -10,10 +11,7 @@ export type EcopagesJsxMdxPageModule = EcoPageFile<{
     layout?: EcoComponent;
     getMetadata?: GetMetadata;
 }>;
-export declare const createMdxExtensionFilter: (extensions: string[], options?: {
-    allowQueryString?: boolean;
-}) => RegExp;
-export declare const appendMdxExtensions: (target: string[], mdxExtensions: string[]) => void;
+export { appendMdxExtensions, createMdxExtensionFilter };
 export declare const resolveMdxCompilerOptions: (mdxOptions: EcopagesJsxMdxOptions) => ResolvedMdxCompileOptions;
 export declare const createMdxLoaderPlugin: (compilerOptions: ResolvedMdxCompileOptions, extensions: string[]) => EcoBuildPlugin;
 export declare const registerBunMdxPlugin: (compilerOptions: ResolvedMdxCompileOptions, extensions: string[]) => Promise<void>;

package/src/ecopages-jsx-mdx.js

@@ -1,62 +1,27 @@
 import { readFile } from "node:fs/promises";
-import path from "node:path";
 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 escapeRegex = (value) => value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
-const mergePluginLists = (...lists) => {
-  const merged = lists.flatMap((list) => list ? [...list] : []);
-  return merged.length > 0 ? merged : void 0;
-};
-const createMdxExtensionFilter = (extensions, options) => {
-  const escaped = extensions.map(escapeRegex);
-  const suffix = options?.allowQueryString ? "(\\?.*)?$" : "$";
-  return new RegExp(`(${escaped.join("|")})${suffix}`);
-};
-const appendMdxExtensions = (target, mdxExtensions) => {
-  for (const ext of mdxExtensions) {
-    if (!target.includes(ext)) {
-      target.push(ext);
-    }
-  }
-};
-const resolveMdxCompilerOptions = (mdxOptions) => {
-  const { compilerOptions, remarkPlugins, rehypePlugins, recmaPlugins } = mdxOptions;
-  const resolved = {
+const resolveMdxCompilerOptions = (mdxOptions) => resolveMdxCompilerOptionsCore(mdxOptions, {
+  jsxImportSource: "@ecopages/jsx",
+  defaults: {
     format: "detect",
-    outputFormat: "program",
-    ...compilerOptions,
-    jsxImportSource: "@ecopages/jsx",
-    jsxRuntime: "automatic",
-    development: process.env.NODE_ENV === "development"
-  };
-  const mergedRemark = mergePluginLists(compilerOptions?.remarkPlugins, remarkPlugins);
-  const mergedRehype = mergePluginLists(compilerOptions?.rehypePlugins, rehypePlugins);
-  const mergedRecma = mergePluginLists(compilerOptions?.recmaPlugins, recmaPlugins);
-  if (mergedRemark) resolved.remarkPlugins = mergedRemark;
-  if (mergedRehype) resolved.rehypePlugins = mergedRehype;
-  if (mergedRecma) resolved.recmaPlugins = mergedRecma;
-  return resolved;
-};
-const createMdxLoaderPlugin = (compilerOptions, extensions) => {
-  const filter = createMdxExtensionFilter(extensions, { allowQueryString: true });
-  return {
-    name: "ecopages-jsx-mdx-loader",
-    setup(build) {
-      build.onLoad({ filter }, async (args) => {
-        const { compile } = await import("@mdx-js/mdx");
-        const filePath = args.path.includes("?") ? args.path.split("?")[0] : args.path;
-        const source = await readFile(filePath, "utf-8");
-        const compiled = await compile(new VFile({ value: source, path: filePath }), compilerOptions);
-        return {
-          contents: String(compiled.value),
-          loader: "js",
-          resolveDir: path.dirname(filePath)
-        };
-      });
-    }
-  };
-};
+    outputFormat: "program"
+  }
+});
+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;

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

@@ -22,13 +22,6 @@ export declare class EcopagesJsxRenderer extends IntegrationRenderer<JsxRenderab
      * elements and queued foreign subtrees contribute assets to the same frame.
      */
     private renderQueuedForeignSubtreeChildren;
-    /**
-     * Resolves queued foreign subtrees after JSX has been stringified.
-     *
-     * JSX content needs one extra render pass because child foreign subtrees may emit
-     * additional browser assets while also replacing placeholder tokens.
-     */
-    private resolveOwnedForeignSubtreeHtml;
     protected createForeignChildRuntime(options: {
         renderInput: ComponentRenderInput;
         rendererCache: Map<string, IntegrationRenderer<any>>;

package/src/ecopages-jsx-renderer.js

@@ -61,24 +61,6 @@ class EcopagesJsxRenderer extends IntegrationRenderer {
       html
     };
   }
-  /**
-   * Resolves queued foreign subtrees after JSX has been stringified.
-   *
-   * JSX content needs one extra render pass because child foreign subtrees may emit
-   * additional browser assets while also replacing placeholder tokens.
-   */
-  async resolveOwnedForeignSubtreeHtml(html, runtimeContext) {
-    return this.foreignSubtreeExecutionService.resolveQueuedHtml({
-      currentIntegrationName: this.name,
-      html,
-      runtimeContext,
-      queueLabel: "Ecopages JSX",
-      getOwningRenderer: (integrationName, rendererCache) => this.getIntegrationRendererForName(integrationName, rendererCache),
-      applyAttributesToFirstElement: (resolvedHtml, attributes) => this.htmlTransformer.applyAttributesToFirstElement(resolvedHtml, attributes),
-      dedupeProcessedAssets: (assets) => this.htmlTransformer.dedupeProcessedAssets(assets),
-      renderQueuedChildren: async (children, _runtimeContext, queuedResolutionsByToken, resolveToken) => this.renderQueuedForeignSubtreeChildren(children, queuedResolutionsByToken, resolveToken)
-    });
-  }
   createForeignChildRuntime(options) {
     const runtime = super.createForeignChildRuntime(options);
     const interceptForeignChild = runtime.interceptForeignChild;
@@ -165,11 +147,11 @@ class EcopagesJsxRenderer extends IntegrationRenderer {
           };
           const content = await this.withCustomElementRenderHook(() => component(componentProps));
           const rendered = await this.renderJsx(content);
-          const queuedForeignSubtreeResolution = await this.resolveOwnedForeignSubtreeHtml(
+          const queuedForeignSubtreeResolution = await this.resolveQueuedForeignSubtreeHtml(
             rendered.html,
-            this.getQueuedForeignSubtreeResolutionContext(
-              input
-            )
+            this.getQueuedForeignSubtreeResolutionContext(input),
+            (children, _runtimeContext, queuedResolutionsByToken, resolveToken) => this.renderQueuedForeignSubtreeChildren(children, queuedResolutionsByToken, resolveToken),
+            "Ecopages JSX"
           );
           const componentAssets = input.component.config?.dependencies && typeof this.assetProcessingService?.processDependencies === "function" ? await this.processComponentDependencies([input.component]) : [];
           const assets = this.htmlTransformer.dedupeProcessedAssets([