npm - @coherent.js/integrations - Versions diffs - 1.0.0-rc.1 - Mend

@coherent.js/integrations 1.0.0-rc.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (17) hide show

package/LICENSE +21 -0
package/README.md +37 -0
package/package.json +99 -0
package/src/astro/index.js +88 -0
package/src/express/coherent-express.js +160 -0
package/src/express/index.js +36 -0
package/src/fastify/coherent-fastify.js +125 -0
package/src/fastify/index.js +13 -0
package/src/koa/coherent-koa.js +124 -0
package/src/koa/index.js +19 -0
package/src/nextjs/coherent-nextjs.js +230 -0
package/src/nextjs/index.js +21 -0
package/src/remix/index.js +86 -0
package/src/sveltekit/index.js +121 -0
package/types/express/index.d.ts +134 -0
package/types/fastify/index.d.ts +121 -0
package/types/nextjs/index.d.ts +114 -0

package/src/koa/coherent-koa.js ADDED Viewed

@@ -0,0 +1,124 @@
+/**
+ * Koa.js integration for Coherent.js
+ * Provides middleware and utilities for using Coherent.js with Koa
+ */
+import {
+  importPeerDependency,
+  renderWithTemplate,
+  renderComponentFactory,
+  isCoherentComponent
+} from '@coherent.js/core';
+/**
+ * Coherent.js Koa middleware
+ * Automatically renders Coherent.js components and handles errors
+ *
+ * @param {Object} options - Configuration options
+ * @param {boolean} options.enablePerformanceMonitoring - Enable performance monitoring
+ * @param {string} options.template - HTML template with {{content}} placeholder
+ * @returns {Function} Koa middleware function
+ */
+export function coherentKoaMiddleware(options = {}) {
+  const {
+    enablePerformanceMonitoring = false,
+    template = '<!DOCTYPE html>\n{{content}}'
+  } = options;
+  return async (ctx, next) => {
+    await next();
+    // If response body is a Coherent.js object, render it
+    if (isCoherentComponent(ctx.body)) {
+      try {
+        // Use shared rendering utility
+        const finalHtml = renderWithTemplate(ctx.body, { enablePerformanceMonitoring, template });
+        // Set content type and body
+        ctx.type = 'text/html';
+        ctx.body = finalHtml;
+      } catch (_error) {
+        console.error('Coherent.js rendering _error:', _error);
+        throw _error;
+      }
+    }
+  };
+}
+/**
+ * Create a Koa route handler for Coherent.js components
+ *
+ * @param {Function} componentFactory - Function that returns a Coherent.js component
+ * @param {Object} options - Handler options
+ * @returns {Function} Koa route handler
+ */
+export function createHandler(componentFactory, options = {}) {
+  return async (ctx, next) => {
+    try {
+      // Use shared rendering utility
+      const finalHtml = await renderComponentFactory(
+        componentFactory,
+        [ctx, next],
+        options
+      );
+      // Set response
+      ctx.type = 'text/html';
+      ctx.body = finalHtml;
+    } catch (_error) {
+      console.error('Coherent.js handler _error:', _error);
+      throw _error;
+    }
+  };
+}
+/**
+ * Setup Coherent.js with Koa app
+ *
+ * @param {Object} app - Koa app instance
+ * @param {Object} options - Setup options
+ */
+export function setupCoherent(app, options = {}) {
+  const {
+    useMiddleware = true,
+    enablePerformanceMonitoring = false
+  } = options;
+  // Use middleware for automatic rendering
+  if (useMiddleware) {
+    app.use(coherentKoaMiddleware({ enablePerformanceMonitoring }));
+  }
+}
+/**
+ * Create Koa integration with dependency checking
+ * This function ensures Koa is available before setting up the integration
+ *
+ * @param {Object} options - Setup options
+ * @returns {Promise<Function>} - Function to setup Koa integration
+ */
+export async function createKoaIntegration(options = {}) {
+  try {
+    // Verify Koa is available
+    await importPeerDependency('koa', 'Koa.js');
+    return function(app) {
+      if (!app || typeof app.use !== 'function') {
+        throw new Error('Invalid Koa app instance provided');
+      }
+      setupCoherent(app, options);
+      return app;
+    };
+  } catch (_error) {
+    throw _error;
+  }
+}
+// Export all utilities
+export default {
+  coherentKoaMiddleware,
+  createHandler,
+  setupCoherent,
+  createKoaIntegration
+};

package/src/koa/index.js ADDED Viewed

@@ -0,0 +1,19 @@
+// src/koa/index.js
+//
+// Public entry point for @coherent.js/integrations/koa. Re-exports the full
+// runtime surface from coherent-koa.js so the runtime matches the legacy
+// @coherent.js/koa export shape.
+//
+// Koa must be installed as a peer dependency to use this integration.
+//
+// Usage:
+//   import { setupCoherent } from '@coherent.js/integrations/koa';
+export {
+  coherentKoaMiddleware,
+  createHandler,
+  setupCoherent,
+  createKoaIntegration
+} from './coherent-koa.js';
+export { default } from './coherent-koa.js';

package/src/nextjs/coherent-nextjs.js ADDED Viewed

@@ -0,0 +1,230 @@
+/**
+ * Next.js integration for Coherent.js
+ * Provides utilities for using Coherent.js with Next.js
+ */
+import {
+  render,
+  performanceMonitor,
+  importPeerDependency,
+  renderComponentFactory
+} from '@coherent.js/core';
+/**
+ * Create a Next.js API route handler for Coherent.js components
+ *
+ * @param {Function} componentFactory - Function that returns a Coherent.js component
+ * @param {Object} options - Handler options
+ * @param {boolean} options.enablePerformanceMonitoring - Enable performance monitoring
+ * @param {string} options.template - HTML template with {{content}} placeholder
+ * @returns {Function} Next.js API route handler
+ */
+export function createCoherentNextHandler(componentFactory, options = {}) {
+  return async (req, res) => {
+    try {
+      // Use shared rendering utility
+      const finalHtml = await renderComponentFactory(
+        componentFactory,
+        [req, res],
+        options
+      );
+      // Send HTML response
+      res.setHeader('Content-Type', 'text/html; charset=utf-8');
+      res.status(200).send(finalHtml);
+    } catch (_error) {
+      console.error('Coherent.js Next.js handler _error:', _error);
+      res.status(500).json({ _error: _error.message });
+    }
+  };
+}
+/**
+ * Create a Next.js App Router route handler for Coherent.js components
+ *
+ * @param {Function} componentFactory - Function that returns a Coherent.js component
+ * @param {Object} options - Handler options
+ * @returns {Function} Next.js App Router route handler
+ */
+export function createCoherentAppRouterHandler(componentFactory, options = {}) {
+  return async function handler(request) {
+    try {
+      // Use shared rendering utility
+      const finalHtml = await renderComponentFactory(
+        componentFactory,
+        [request],
+        options
+      );
+      // Send HTML response
+      return new Response(finalHtml, {
+        status: 200,
+        headers: { 'Content-Type': 'text/html; charset=utf-8' }
+      });
+    } catch (_error) {
+      console.error('Coherent.js Next.js App Router handler _error:', _error);
+      return new Response(
+        JSON.stringify({ _error: _error.message }),
+        {
+          status: 500,
+          headers: { 'Content-Type': 'application/json' }
+        }
+      );
+    }
+  }
+}
+/**
+ * Create a Next.js Server Component for Coherent.js
+ *
+ * @param {Function} componentFactory - Function that returns a Coherent.js component
+ * @param {Object} options - Component options
+ * @returns {Function} Next.js Server Component
+ */
+export async function createCoherentServerComponent(componentFactory, options = {}) {
+  const {
+    enablePerformanceMonitoring = false
+  } = options;
+  // Import React using dependency utilities
+  let React;
+  try {
+    React = await importPeerDependency('react', 'React');
+  } catch (_error) {
+    throw new Error(
+      `Next.js Server Component integration requires React. ${  _error.message}`
+    );
+  }
+  return async function CoherentServerComponent(props) {
+    try {
+      // Create component with props
+      const component = await Promise.resolve(
+        componentFactory(props)
+      );
+      if (!component) {
+        return React.default.createElement('div', null, 'Error: Component factory returned null/undefined');
+      }
+      // Render component
+      let html;
+      if (enablePerformanceMonitoring) {
+        const renderId = performanceMonitor.startRender();
+        html = render(component);
+        performanceMonitor.endRender(renderId);
+      } else {
+        html = render(component);
+      }
+      // Return dangerouslySetInnerHTML to render HTML
+      return React.default.createElement('div', {
+        dangerouslySetInnerHTML: { __html: html }
+      });
+    } catch (_error) {
+      console.error('Coherent.js Next.js Server Component _error:', _error);
+      return React.default.createElement('div', null, `Error: ${_error.message}`);
+    }
+  };
+}
+/**
+ * Create a Next.js Client Component for Coherent.js with hydration support
+ *
+ * @param {Function} componentFactory - Function that returns a Coherent.js component
+ * @param {Object} options - Component options
+ * @returns {Function} Next.js Client Component
+ */
+export async function createCoherentClientComponent(componentFactory, options = {}) {
+  const {
+    enablePerformanceMonitoring = false
+  } = options;
+  // Import React using dependency utilities
+  let React;
+  try {
+    React = await importPeerDependency('react', 'React');
+  } catch (_error) {
+    throw new Error(
+      `Next.js Client Component integration requires React. ${  _error.message}`
+    );
+  }
+  return function CoherentClientComponent(props) {
+    const [html, setHtml] = React.useState('');
+    React.useEffect(() => {
+      async function renderComponent() {
+        try {
+          // Create component with props
+          const component = await Promise.resolve(
+            componentFactory(props)
+          );
+          if (!component) {
+            setHtml('Error: Component factory returned null/undefined');
+            return;
+          }
+          // Render component
+          let renderedHtml;
+          if (enablePerformanceMonitoring) {
+            const renderId = performanceMonitor.startRender();
+            renderedHtml = render(component);
+            performanceMonitor.endRender(renderId);
+          } else {
+            renderedHtml = render(component);
+          }
+          setHtml(renderedHtml);
+        } catch (_error) {
+          console.error('Coherent.js Next.js Client Component _error:', _error);
+          setHtml(`Error: ${_error.message}`);
+        }
+      }
+      renderComponent();
+    }, [props]);
+    return React.createElement('div', {
+      dangerouslySetInnerHTML: { __html: html }
+    });
+  };
+}
+/**
+ * Create Next.js integration with dependency checking
+ * This function ensures Next.js and React are available before setting up the integration
+ *
+ * @param {Object} options - Setup options
+ * @returns {Promise<Object>} - Object with Next.js integration utilities
+ */
+export async function createNextIntegration(options = {}) {
+  try {
+    // Verify Next.js and React are available
+    await importPeerDependency('next', 'Next.js');
+    await importPeerDependency('react', 'React');
+    return {
+      createCoherentNextHandler: (componentFactory, handlerOptions = {}) =>
+        createCoherentNextHandler(componentFactory, { ...options, ...handlerOptions }),
+      createCoherentAppRouterHandler: (componentFactory, handlerOptions = {}) =>
+        createCoherentAppRouterHandler(componentFactory, { ...options, ...handlerOptions }),
+      createCoherentServerComponent: (componentFactory, componentOptions = {}) =>
+        createCoherentServerComponent(componentFactory, { ...options, ...componentOptions }),
+      createCoherentClientComponent: (componentFactory, componentOptions = {}) =>
+        createCoherentClientComponent(componentFactory, { ...options, ...componentOptions })
+    };
+  } catch (_error) {
+    throw _error;
+  }
+}
+// Export all utilities
+export default {
+  createCoherentNextHandler,
+  createCoherentAppRouterHandler,
+  createCoherentServerComponent,
+  createCoherentClientComponent,
+  createNextIntegration
+};

package/src/nextjs/index.js ADDED Viewed

@@ -0,0 +1,21 @@
+// src/nextjs/index.js
+//
+// Public entry point for @coherent.js/integrations/nextjs. Re-exports the full
+// runtime surface from coherent-nextjs.js so the runtime matches the legacy
+// @coherent.js/nextjs export shape.
+//
+// Next.js and React must be installed as peer dependencies to use this
+// integration.
+//
+// Usage:
+//   import { createCoherentNextHandler } from '@coherent.js/integrations/nextjs';
+export {
+  createCoherentNextHandler,
+  createCoherentAppRouterHandler,
+  createCoherentServerComponent,
+  createCoherentClientComponent,
+  createNextIntegration
+} from './coherent-nextjs.js';
+export { default } from './coherent-nextjs.js';

package/src/remix/index.js ADDED Viewed

@@ -0,0 +1,86 @@
+// src/remix/index.js
+//
+// Public entry point for @coherent.js/integrations/remix. Provides SSR
+// integration and loader utilities for Remix projects.
+//
+// Remix must be installed as a peer dependency to use this integration.
+//
+// Usage:
+//   import { createRemixAdapter } from '@coherent.js/integrations/remix';
+import { render } from '@coherent.js/core';
+/**
+ * Create a Remix adapter for Coherent.js
+ *
+ * @param {Object} [options] - Adapter options
+ * @param {boolean} [options.hydrate] - Enable client-side hydration
+ * @returns {Object} Remix adapter utilities
+ *
+ * @example
+ * const adapter = createRemixAdapter();
+ * const html = adapter.renderComponent(MyComponent, { title: 'Hello' });
+ */
+export function createRemixAdapter(_options = {}) {
+  return {
+    /**
+     * Render a Coherent.js component to HTML
+     */
+    renderComponent(component, props = {}) {
+      const def = typeof component === 'function' ? component(props) : component;
+      return render(def);
+    },
+    /**
+     * Create a Remix loader that renders a Coherent.js component
+     */
+    createLoader(component, getProps) {
+      return async ({ request, params, context }) => {
+        const props = getProps
+          ? await getProps({ request, params, context })
+          : { request, params };
+        const def = typeof component === 'function' ? component(props) : component;
+        const html = render(def);
+        return new Response(html, {
+          headers: { 'Content-Type': 'text/html; charset=utf-8' }
+        });
+      };
+    },
+    /**
+     * Create a Remix action handler that processes form data
+     * and renders a Coherent.js component with the result
+     */
+    createAction(component, handler) {
+      return async ({ request, params, context }) => {
+        const formData = await request.formData();
+        const data = Object.fromEntries(formData);
+        const result = await handler({ data, request, params, context });
+        if (result instanceof Response) return result;
+        const def = typeof component === 'function' ? component(result) : component;
+        const html = render(def);
+        return new Response(html, {
+          headers: { 'Content-Type': 'text/html; charset=utf-8' }
+        });
+      };
+    }
+  };
+}
+/**
+ * HOC: Wrap a Coherent.js component for use in Remix routes
+ *
+ * @param {Function} Component - Coherent.js component function
+ * @returns {Function} Remix-compatible component
+ */
+export function withCoherent(Component) {
+  return function CoherentRemixComponent(props) {
+    const def = typeof Component === 'function' ? Component(props) : Component;
+    return render(def);
+  };
+}

package/src/sveltekit/index.js ADDED Viewed

@@ -0,0 +1,121 @@
+// src/sveltekit/index.js
+//
+// Public entry point for @coherent.js/integrations/sveltekit. Provides
+// server-side rendering and preprocessor integration for SvelteKit projects.
+//
+// SvelteKit must be installed as a peer dependency to use this integration.
+//
+// Usage:
+//   import { createSvelteKitAdapter } from '@coherent.js/integrations/sveltekit';
+import { render } from '@coherent.js/core';
+/**
+ * Create a SvelteKit adapter for Coherent.js
+ *
+ * @param {Object} [options] - Adapter options
+ * @returns {Object} SvelteKit adapter utilities
+ *
+ * @example
+ * const adapter = createSvelteKitAdapter();
+ * const html = adapter.renderComponent(MyComponent, { title: 'Hello' });
+ */
+export function createSvelteKitAdapter(_options = {}) {
+  return {
+    name: '@coherent.js/sveltekit',
+    /**
+     * Render a Coherent.js component to HTML
+     */
+    renderComponent(component, props = {}) {
+      const def = typeof component === 'function' ? component(props) : component;
+      return render(def);
+    },
+    /**
+     * Create a SvelteKit server load function
+     */
+    createLoad(component, getProps) {
+      return async ({ params, url, fetch }) => {
+        const props = getProps
+          ? await getProps({ params, url, fetch })
+          : { params };
+        const def = typeof component === 'function' ? component(props) : component;
+        const html = render(def);
+        return { html, props };
+      };
+    },
+    /**
+     * Create a SvelteKit form action handler
+     */
+    createAction(handler) {
+      return async ({ request, params }) => {
+        const formData = await request.formData();
+        const data = Object.fromEntries(formData);
+        return handler({ data, params });
+      };
+    }
+  };
+}
+/**
+ * Create a Svelte preprocessor for Coherent.js templates
+ *
+ * Transforms inline Coherent.js object syntax within Svelte components.
+ *
+ * @param {Object} [options] - Preprocessor options
+ * @param {string} [options.tag] - Custom tag to process (default: 'coherent')
+ * @returns {Object} Svelte preprocessor
+ */
+export function createPreprocessor(options = {}) {
+  const tag = options.tag || 'coherent';
+  return {
+    name: 'coherent-preprocessor',
+    markup({ content, filename: _filename }) {
+      // Find <coherent> blocks and render them to HTML
+      const regex = new RegExp(`<${tag}>(.*?)</${tag}>`, 'gs');
+      let transformed = content;
+      let match;
+      while ((match = regex.exec(content)) !== null) {
+        try {
+          // The content inside <coherent> tags should be a JS object literal
+          // This is a basic transform — production use should handle more cases
+          const objectStr = match[1].trim();
+          transformed = transformed.replace(match[0], `{@html coherentRender(${objectStr})}`);
+        } catch {
+          // Leave unchanged if parsing fails
+        }
+      }
+      return {
+        code: transformed,
+        map: null
+      };
+    }
+  };
+}
+/**
+ * SvelteKit hooks integration
+ *
+ * @param {Object} [options] - Hook options
+ * @returns {Object} SvelteKit handle function
+ */
+export function createHandle(_options = {}) {
+  return async ({ event, resolve }) => {
+    // Add Coherent.js render function to locals
+    event.locals.coherent = {
+      render(component, props = {}) {
+        const def = typeof component === 'function' ? component(props) : component;
+        return render(def);
+      }
+    };
+    return resolve(event);
+  };
+}