@otl-core/block-registry 1.1.0

package/LICENSE

@@ -0,0 +1,13 @@
+Copyright (c) 2025 OTL Core
+
+Licensed under the PolyForm Shield License, Version 1.0.0 (the "License");
+you may not use this file except in compliance with the License. You may
+obtain a copy of the License at
+
+    https://polyformproject.org/licenses/shield/1.0.0/
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+License for the specific language governing permissions and limitations
+under the License.

package/README.md

@@ -0,0 +1,159 @@
+# @otl-core/block-registry
+
+Block registry infrastructure for OTL CMS. This package provides the core registry and rendering
+system for block components.
+
+## Purpose
+
+This package contains **ONLY infrastructure** - registry classes and renderers. Actual block
+components (Markdown, Image, Video, etc.) remain in your application code for customization.
+
+## SSR Compatibility
+
+All components in this package are **server-component safe** and work with Next.js App Router SSR:
+
+- No client-only hooks (useState, useEffect, useMemo, etc.)
+- Pure synchronous logic
+- Deterministic rendering
+
+Individual block components in your app can be client components if they need interactivity - just
+add `"use client"` at the top of those files.
+
+## Installation
+
+This package is part of the OTL CMS monorepo and uses workspace protocol:
+
+```json
+{
+  "dependencies": {
+    "@otl-core/block-registry": "workspace:*"
+  }
+}
+```
+
+## Usage
+
+### 1. Create a Registry Instance
+
+```typescript
+// In your app: src/lib/registries/block-registry.ts
+import { BlockRegistry } from "@otl-core/block-registry";
+import Markdown from "@/components/blocks/markdown";
+import Image from "@/components/blocks/image";
+// ... import all your block components
+
+export const blockRegistry = new BlockRegistry();
+
+// Register your blocks
+blockRegistry.register("markdown", Markdown);
+blockRegistry.register("image", Image);
+// ... register all blocks
+```
+
+### 2. Use BlockRenderer
+
+```typescript
+import { BlockRenderer } from '@otl-core/block-registry';
+import { blockRegistry } from '@/lib/registries/block-registry';
+
+export default function MyPage({ blocks }) {
+  return (
+    <div>
+      {blocks.map((block) => (
+        <BlockRenderer
+          key={block.id}
+          block={block}
+          blockRegistry={blockRegistry}
+          siteId="your-site-id"  // Optional, for form blocks
+        />
+      ))}
+    </div>
+  );
+}
+```
+
+### 3. Form Block Support
+
+Form blocks receive special props:
+
+```typescript
+// Your form block component
+interface FormInputProps {
+  blockId: string;
+  siteId?: string;
+}
+
+export default function FormInput({ blockId, siteId }: FormInputProps) {
+  // Your form block implementation
+}
+
+// Register it with type starting with "form-"
+blockRegistry.register("form-input", FormInput);
+```
+
+The BlockRenderer automatically detects form blocks (types starting with `"form-"`) and passes
+`blockId` and `siteId` instead of `config`.
+
+## API Reference
+
+### BlockRegistry
+
+```typescript
+class BlockRegistry<TProps> {
+  register(type: string, component: ComponentType<TProps>): void;
+  get(type: string): ComponentType<TProps> | undefined;
+  has(type: string): boolean;
+  getAll(): string[];
+  size(): number;
+}
+```
+
+### BlockRenderer Props
+
+```typescript
+interface BlockRendererProps {
+  block: BlockInstance; // The block to render
+  blockRegistry: BlockRegistry; // Registry containing block components
+  siteId?: string; // Optional, for form blocks
+}
+```
+
+### Block Component Props
+
+Regular blocks receive:
+
+```typescript
+interface BlockComponentProps {
+  config: Record<string, unknown>;
+}
+```
+
+Form blocks receive:
+
+```typescript
+interface FormBlockComponentProps {
+  blockId: string;
+  siteId?: string;
+}
+```
+
+## Error Handling
+
+If a block type is not found in the registry, `ComponentNotFound` is rendered, which:
+
+- Logs detailed error information in development
+- Logs minimal error in production
+- Calls global error handler if available (`window.__CMS_ERROR_HANDLER__`)
+- Renders invisible placeholder to prevent layout breaks
+
+## Best Practices
+
+1. **Keep components in your app**: Don't put actual block components in this package
+2. **Server-first**: Use server components by default, only add `"use client"` when needed
+3. **Type safety**: Import types from this package for consistency
+4. **Registry singleton**: Create one registry instance and export it
+5. **Register all blocks**: Ensure all block types used in content are registered
+
+## Examples
+
+See `frontend/engine/examples/custom-block-example.tsx` for a complete example.

package/dist/index.cjs

@@ -0,0 +1,150 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/registry/block-registry.ts
+var BlockRegistry = class {
+  constructor() {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    this.components = /* @__PURE__ */ new Map();
+  }
+  /**
+   * Register a block component
+   */
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  register(type, component) {
+    this.components.set(type, component);
+  }
+  /**
+   * Get a block component by type
+   */
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  get(type) {
+    return this.components.get(type);
+  }
+  /**
+   * Check if a block type is registered
+   */
+  has(type) {
+    return this.components.has(type);
+  }
+  /**
+   * Get all registered block types
+   */
+  getAll() {
+    return Array.from(this.components.keys());
+  }
+  /**
+   * Get count of registered components
+   */
+  size() {
+    return this.components.size;
+  }
+};
+function ComponentNotFound({
+  type,
+  config,
+  availableTypes,
+  componentKind
+}) {
+  const isDev = process.env.NODE_ENV === "development";
+  const errorDetails = {
+    componentKind,
+    type,
+    config,
+    availableTypes,
+    timestamp: (/* @__PURE__ */ new Date()).toISOString(),
+    suggestion: `Create components/${componentKind}s/${type}.tsx and register it in lib/registries/${componentKind}-registry.ts`
+  };
+  if (isDev) {
+    console.error(
+      `[${componentKind === "section" ? "SectionRenderer" : "BlockRenderer"}] Component not found: "${type}"`,
+      errorDetails
+    );
+  } else {
+    console.error(`[CMS] Unknown ${componentKind}: "${type}"`);
+  }
+  if (typeof window !== "undefined" && window.__CMS_ERROR_HANDLER__) {
+    try {
+      window.__CMS_ERROR_HANDLER__({
+        errorType: "COMPONENT_NOT_FOUND",
+        severity: "warning",
+        ...errorDetails
+      });
+    } catch {
+    }
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: { minHeight: "1px" }, "aria-hidden": "true" });
+}
+var globalAnalyticsWrapper = null;
+function registerAnalyticsWrapper(wrapper) {
+  globalAnalyticsWrapper = wrapper;
+}
+function BlockRenderer({
+  block,
+  blockRegistry,
+  siteId,
+  analyticsWrapper
+}) {
+  const AnalyticsWrapper = analyticsWrapper ?? globalAnalyticsWrapper;
+  const { type, id } = block;
+  const BlockComponent = blockRegistry.get(type);
+  if (!BlockComponent) {
+    const config2 = "config" in block && block.config !== void 0 ? block.config : "data" in block && block.data !== void 0 ? block.data : {};
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      ComponentNotFound,
+      {
+        type,
+        config: config2,
+        availableTypes: blockRegistry.getAll(),
+        componentKind: "block"
+      }
+    );
+  }
+  const blockAnalytics = block.config?.analytics;
+  const wrapWithAnalytics = (element) => {
+    if (AnalyticsWrapper) {
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        AnalyticsWrapper,
+        {
+          analyticsConfig: blockAnalytics,
+          blockId: id,
+          blockType: type,
+          children: element
+        }
+      );
+    }
+    return element;
+  };
+  if (type.startsWith("form-")) {
+    return wrapWithAnalytics(/* @__PURE__ */ jsxRuntime.jsx(BlockComponent, { blockId: id, siteId }));
+  }
+  if (type === "form") {
+    const config2 = block.config || {};
+    const data = block.data;
+    return wrapWithAnalytics(
+      /* @__PURE__ */ jsxRuntime.jsx(BlockComponent, { config: config2, data, siteId })
+    );
+  }
+  const config = "config" in block && block.config !== void 0 ? block.config : "data" in block && block.data !== void 0 ? block.data : {};
+  if (type === "alert" || type === "card" || type === "modal" || type === "grid-layout" || type === "flexbox-layout" || type === "container-layout" || type === "entry-content") {
+    return wrapWithAnalytics(
+      /* @__PURE__ */ jsxRuntime.jsx(
+        BlockComponent,
+        {
+          config,
+          siteId,
+          blockRegistry
+        }
+      )
+    );
+  }
+  return wrapWithAnalytics(/* @__PURE__ */ jsxRuntime.jsx(BlockComponent, { config, siteId }));
+}
+
+exports.BlockRegistry = BlockRegistry;
+exports.BlockRenderer = BlockRenderer;
+exports.ComponentNotFound = ComponentNotFound;
+exports.registerAnalyticsWrapper = registerAnalyticsWrapper;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/registry/block-registry.ts","../src/renderer/component-not-found.tsx","../src/renderer/block-renderer.tsx"],"names":["jsx","config"],"mappings":"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","file":"index.cjs","sourcesContent":["/**\n * Block Component Registry\n * Manages registration and retrieval of block components\n */\n\nimport { ComponentType } from \"react\";\n\nexport class BlockRegistry {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  private components = new Map<string, ComponentType<any>>();\n\n  /**\n   * Register a block component\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  register(type: string, component: ComponentType<any>): void {\n    this.components.set(type, component);\n  }\n\n  /**\n   * Get a block component by type\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  get(type: string): ComponentType<any> | undefined {\n    return this.components.get(type);\n  }\n\n  /**\n   * Check if a block type is registered\n   */\n  has(type: string): boolean {\n    return this.components.has(type);\n  }\n\n  /**\n   * Get all registered block types\n   */\n  getAll(): string[] {\n    return Array.from(this.components.keys());\n  }\n\n  /**\n   * Get count of registered components\n   */\n  size(): number {\n    return this.components.size;\n  }\n}\n","/**\n * Component Not Found Fallback\n * Logs error when a component type is not registered in the registry\n */\n\ninterface ComponentNotFoundProps {\n  type: string;\n  config: Record<string, unknown>;\n  availableTypes: string[];\n  componentKind: \"section\" | \"block\";\n}\n\nexport default function ComponentNotFound({\n  type,\n  config,\n  availableTypes,\n  componentKind,\n}: ComponentNotFoundProps) {\n  const isDev = process.env.NODE_ENV === \"development\";\n\n  const errorDetails = {\n    componentKind,\n    type,\n    config,\n    availableTypes,\n    timestamp: new Date().toISOString(),\n    suggestion: `Create components/${componentKind}s/${type}.tsx and register it in lib/registries/${componentKind}-registry.ts`,\n  };\n\n  if (isDev) {\n    console.error(\n      `[${componentKind === \"section\" ? \"SectionRenderer\" : \"BlockRenderer\"}] Component not found: \"${type}\"`,\n      errorDetails,\n    );\n  } else {\n    console.error(`[CMS] Unknown ${componentKind}: \"${type}\"`);\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  if (typeof window !== \"undefined\" && (window as any).__CMS_ERROR_HANDLER__) {\n    try {\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      (window as any).__CMS_ERROR_HANDLER__({\n        errorType: \"COMPONENT_NOT_FOUND\",\n        severity: \"warning\",\n        ...errorDetails,\n      });\n    } catch {\n      // Ignore errors from error handler\n    }\n  }\n\n  return <div style={{ minHeight: \"1px\" }} aria-hidden=\"true\" />;\n}\n","/**\n * Block Renderer\n * Dynamically renders block components based on schema instance type\n *\n * SSR COMPATIBLE: This is a pure server component with no client hooks.\n * Analytics wrapper is a client component that is rendered by this server\n * component (valid in Next.js RSC architecture).\n */\n\nimport { BlockRegistry } from \"../registry/block-registry\";\nimport ComponentNotFound from \"./component-not-found\";\n\ninterface BlockAnalyticsConfig {\n  enabled: boolean;\n  event_label: string;\n  track_type: \"click\" | \"visibility\" | \"both\";\n  visibility_threshold?: number;\n  fire_once?: boolean;\n  target_providers?: \"all\" | string[];\n  custom_params?: Record<string, string>;\n}\n\ntype AnalyticsWrapperComponent = React.ComponentType<{\n  analyticsConfig: BlockAnalyticsConfig | undefined;\n  blockId: string;\n  blockType: string;\n  children: React.ReactNode;\n}>;\n\nlet globalAnalyticsWrapper: AnalyticsWrapperComponent | null = null;\n\n/**\n * Register a global analytics wrapper component that will be applied to\n * all blocks rendered by BlockRenderer. Call once during app initialization.\n */\nexport function registerAnalyticsWrapper(\n  wrapper: AnalyticsWrapperComponent,\n): void {\n  globalAnalyticsWrapper = wrapper;\n}\n\ninterface BlockInstance {\n  id: string;\n  type: string;\n  config?: Record<string, unknown>;\n  data?: Record<string, unknown>;\n}\n\ninterface BlockRendererProps {\n  block: BlockInstance;\n  blockRegistry: BlockRegistry;\n  siteId?: string;\n  /** Optional wrapper component for block-level analytics (overrides global) */\n  analyticsWrapper?: AnalyticsWrapperComponent;\n}\n\n// NO \"use client\" directive - this is a server component\nexport default function BlockRenderer({\n  block,\n  blockRegistry,\n  siteId,\n  analyticsWrapper,\n}: BlockRendererProps) {\n  const AnalyticsWrapper = analyticsWrapper ?? globalAnalyticsWrapper;\n  const { type, id } = block;\n\n  const BlockComponent = blockRegistry.get(type);\n\n  if (!BlockComponent) {\n    const config =\n      \"config\" in block && block.config !== undefined\n        ? block.config\n        : \"data\" in block && block.data !== undefined\n          ? block.data\n          : {};\n\n    return (\n      <ComponentNotFound\n        type={type}\n        config={config}\n        availableTypes={blockRegistry.getAll()}\n        componentKind=\"block\"\n      />\n    );\n  }\n\n  // Extract analytics config from the block config\n  const blockAnalytics = block.config?.analytics as\n    | BlockAnalyticsConfig\n    | undefined;\n\n  // Helper to wrap rendered block with analytics if wrapper is provided\n  const wrapWithAnalytics = (element: React.ReactElement) => {\n    if (AnalyticsWrapper) {\n      return (\n        <AnalyticsWrapper\n          analyticsConfig={blockAnalytics}\n          blockId={id}\n          blockType={type}\n        >\n          {element}\n        </AnalyticsWrapper>\n      );\n    }\n    return element;\n  };\n\n  // Form blocks get blockId, siteId, and their embedded data\n  if (type.startsWith(\"form-\")) {\n    return wrapWithAnalytics(<BlockComponent blockId={id} siteId={siteId} />);\n  }\n\n  // Special handling for the \"form\" block (embedded form)\n  // This block type receives both config AND data\n  if (type === \"form\") {\n    const config = block.config || {};\n    const data = block.data; // This contains FormBlockData from backend\n    return wrapWithAnalytics(\n      <BlockComponent config={config} data={data} siteId={siteId} />,\n    );\n  }\n\n  // Regular blocks get config (or data if config is not present)\n  const config =\n    \"config\" in block && block.config !== undefined\n      ? block.config\n      : \"data\" in block && block.data !== undefined\n        ? block.data\n        : {};\n\n  // Blocks that can contain nested blocks need the blockRegistry and siteId\n  if (\n    type === \"alert\" ||\n    type === \"card\" ||\n    type === \"modal\" ||\n    type === \"grid-layout\" ||\n    type === \"flexbox-layout\" ||\n    type === \"container-layout\" ||\n    type === \"entry-content\"\n  ) {\n    return wrapWithAnalytics(\n      <BlockComponent\n        config={config}\n        siteId={siteId}\n        blockRegistry={blockRegistry}\n      />,\n    );\n  }\n\n  return wrapWithAnalytics(<BlockComponent config={config} siteId={siteId} />);\n}\n"]}

package/dist/index.d.cts

@@ -0,0 +1,94 @@
+import { ComponentType } from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+/**
+ * Block Component Registry
+ * Manages registration and retrieval of block components
+ */
+
+declare class BlockRegistry {
+    private components;
+    /**
+     * Register a block component
+     */
+    register(type: string, component: ComponentType<any>): void;
+    /**
+     * Get a block component by type
+     */
+    get(type: string): ComponentType<any> | undefined;
+    /**
+     * Check if a block type is registered
+     */
+    has(type: string): boolean;
+    /**
+     * Get all registered block types
+     */
+    getAll(): string[];
+    /**
+     * Get count of registered components
+     */
+    size(): number;
+}
+
+/**
+ * Type definitions for Block Registry
+ */
+
+interface BlockComponentProps<TConfig = Record<string, unknown>> {
+    config: TConfig;
+    siteId?: string;
+}
+interface FormBlockComponentProps {
+    blockId: string;
+    siteId?: string;
+}
+type BlockComponent = ComponentType<BlockComponentProps> | ComponentType<FormBlockComponentProps>;
+
+interface BlockAnalyticsConfig {
+    enabled: boolean;
+    event_label: string;
+    track_type: "click" | "visibility" | "both";
+    visibility_threshold?: number;
+    fire_once?: boolean;
+    target_providers?: "all" | string[];
+    custom_params?: Record<string, string>;
+}
+type AnalyticsWrapperComponent = React.ComponentType<{
+    analyticsConfig: BlockAnalyticsConfig | undefined;
+    blockId: string;
+    blockType: string;
+    children: React.ReactNode;
+}>;
+/**
+ * Register a global analytics wrapper component that will be applied to
+ * all blocks rendered by BlockRenderer. Call once during app initialization.
+ */
+declare function registerAnalyticsWrapper(wrapper: AnalyticsWrapperComponent): void;
+interface BlockInstance {
+    id: string;
+    type: string;
+    config?: Record<string, unknown>;
+    data?: Record<string, unknown>;
+}
+interface BlockRendererProps {
+    block: BlockInstance;
+    blockRegistry: BlockRegistry;
+    siteId?: string;
+    /** Optional wrapper component for block-level analytics (overrides global) */
+    analyticsWrapper?: AnalyticsWrapperComponent;
+}
+declare function BlockRenderer({ block, blockRegistry, siteId, analyticsWrapper, }: BlockRendererProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Component Not Found Fallback
+ * Logs error when a component type is not registered in the registry
+ */
+interface ComponentNotFoundProps {
+    type: string;
+    config: Record<string, unknown>;
+    availableTypes: string[];
+    componentKind: "section" | "block";
+}
+declare function ComponentNotFound({ type, config, availableTypes, componentKind, }: ComponentNotFoundProps): react_jsx_runtime.JSX.Element;
+
+export { type BlockComponent, type BlockComponentProps, BlockRegistry, BlockRenderer, ComponentNotFound, type FormBlockComponentProps, registerAnalyticsWrapper };

package/dist/index.d.ts

@@ -0,0 +1,94 @@
+import { ComponentType } from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+/**
+ * Block Component Registry
+ * Manages registration and retrieval of block components
+ */
+
+declare class BlockRegistry {
+    private components;
+    /**
+     * Register a block component
+     */
+    register(type: string, component: ComponentType<any>): void;
+    /**
+     * Get a block component by type
+     */
+    get(type: string): ComponentType<any> | undefined;
+    /**
+     * Check if a block type is registered
+     */
+    has(type: string): boolean;
+    /**
+     * Get all registered block types
+     */
+    getAll(): string[];
+    /**
+     * Get count of registered components
+     */
+    size(): number;
+}
+
+/**
+ * Type definitions for Block Registry
+ */
+
+interface BlockComponentProps<TConfig = Record<string, unknown>> {
+    config: TConfig;
+    siteId?: string;
+}
+interface FormBlockComponentProps {
+    blockId: string;
+    siteId?: string;
+}
+type BlockComponent = ComponentType<BlockComponentProps> | ComponentType<FormBlockComponentProps>;
+
+interface BlockAnalyticsConfig {
+    enabled: boolean;
+    event_label: string;
+    track_type: "click" | "visibility" | "both";
+    visibility_threshold?: number;
+    fire_once?: boolean;
+    target_providers?: "all" | string[];
+    custom_params?: Record<string, string>;
+}
+type AnalyticsWrapperComponent = React.ComponentType<{
+    analyticsConfig: BlockAnalyticsConfig | undefined;
+    blockId: string;
+    blockType: string;
+    children: React.ReactNode;
+}>;
+/**
+ * Register a global analytics wrapper component that will be applied to
+ * all blocks rendered by BlockRenderer. Call once during app initialization.
+ */
+declare function registerAnalyticsWrapper(wrapper: AnalyticsWrapperComponent): void;
+interface BlockInstance {
+    id: string;
+    type: string;
+    config?: Record<string, unknown>;
+    data?: Record<string, unknown>;
+}
+interface BlockRendererProps {
+    block: BlockInstance;
+    blockRegistry: BlockRegistry;
+    siteId?: string;
+    /** Optional wrapper component for block-level analytics (overrides global) */
+    analyticsWrapper?: AnalyticsWrapperComponent;
+}
+declare function BlockRenderer({ block, blockRegistry, siteId, analyticsWrapper, }: BlockRendererProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Component Not Found Fallback
+ * Logs error when a component type is not registered in the registry
+ */
+interface ComponentNotFoundProps {
+    type: string;
+    config: Record<string, unknown>;
+    availableTypes: string[];
+    componentKind: "section" | "block";
+}
+declare function ComponentNotFound({ type, config, availableTypes, componentKind, }: ComponentNotFoundProps): react_jsx_runtime.JSX.Element;
+
+export { type BlockComponent, type BlockComponentProps, BlockRegistry, BlockRenderer, ComponentNotFound, type FormBlockComponentProps, registerAnalyticsWrapper };

package/dist/index.js

@@ -0,0 +1,145 @@
+import { jsx } from 'react/jsx-runtime';
+
+// src/registry/block-registry.ts
+var BlockRegistry = class {
+  constructor() {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    this.components = /* @__PURE__ */ new Map();
+  }
+  /**
+   * Register a block component
+   */
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  register(type, component) {
+    this.components.set(type, component);
+  }
+  /**
+   * Get a block component by type
+   */
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  get(type) {
+    return this.components.get(type);
+  }
+  /**
+   * Check if a block type is registered
+   */
+  has(type) {
+    return this.components.has(type);
+  }
+  /**
+   * Get all registered block types
+   */
+  getAll() {
+    return Array.from(this.components.keys());
+  }
+  /**
+   * Get count of registered components
+   */
+  size() {
+    return this.components.size;
+  }
+};
+function ComponentNotFound({
+  type,
+  config,
+  availableTypes,
+  componentKind
+}) {
+  const isDev = process.env.NODE_ENV === "development";
+  const errorDetails = {
+    componentKind,
+    type,
+    config,
+    availableTypes,
+    timestamp: (/* @__PURE__ */ new Date()).toISOString(),
+    suggestion: `Create components/${componentKind}s/${type}.tsx and register it in lib/registries/${componentKind}-registry.ts`
+  };
+  if (isDev) {
+    console.error(
+      `[${componentKind === "section" ? "SectionRenderer" : "BlockRenderer"}] Component not found: "${type}"`,
+      errorDetails
+    );
+  } else {
+    console.error(`[CMS] Unknown ${componentKind}: "${type}"`);
+  }
+  if (typeof window !== "undefined" && window.__CMS_ERROR_HANDLER__) {
+    try {
+      window.__CMS_ERROR_HANDLER__({
+        errorType: "COMPONENT_NOT_FOUND",
+        severity: "warning",
+        ...errorDetails
+      });
+    } catch {
+    }
+  }
+  return /* @__PURE__ */ jsx("div", { style: { minHeight: "1px" }, "aria-hidden": "true" });
+}
+var globalAnalyticsWrapper = null;
+function registerAnalyticsWrapper(wrapper) {
+  globalAnalyticsWrapper = wrapper;
+}
+function BlockRenderer({
+  block,
+  blockRegistry,
+  siteId,
+  analyticsWrapper
+}) {
+  const AnalyticsWrapper = analyticsWrapper ?? globalAnalyticsWrapper;
+  const { type, id } = block;
+  const BlockComponent = blockRegistry.get(type);
+  if (!BlockComponent) {
+    const config2 = "config" in block && block.config !== void 0 ? block.config : "data" in block && block.data !== void 0 ? block.data : {};
+    return /* @__PURE__ */ jsx(
+      ComponentNotFound,
+      {
+        type,
+        config: config2,
+        availableTypes: blockRegistry.getAll(),
+        componentKind: "block"
+      }
+    );
+  }
+  const blockAnalytics = block.config?.analytics;
+  const wrapWithAnalytics = (element) => {
+    if (AnalyticsWrapper) {
+      return /* @__PURE__ */ jsx(
+        AnalyticsWrapper,
+        {
+          analyticsConfig: blockAnalytics,
+          blockId: id,
+          blockType: type,
+          children: element
+        }
+      );
+    }
+    return element;
+  };
+  if (type.startsWith("form-")) {
+    return wrapWithAnalytics(/* @__PURE__ */ jsx(BlockComponent, { blockId: id, siteId }));
+  }
+  if (type === "form") {
+    const config2 = block.config || {};
+    const data = block.data;
+    return wrapWithAnalytics(
+      /* @__PURE__ */ jsx(BlockComponent, { config: config2, data, siteId })
+    );
+  }
+  const config = "config" in block && block.config !== void 0 ? block.config : "data" in block && block.data !== void 0 ? block.data : {};
+  if (type === "alert" || type === "card" || type === "modal" || type === "grid-layout" || type === "flexbox-layout" || type === "container-layout" || type === "entry-content") {
+    return wrapWithAnalytics(
+      /* @__PURE__ */ jsx(
+        BlockComponent,
+        {
+          config,
+          siteId,
+          blockRegistry
+        }
+      )
+    );
+  }
+  return wrapWithAnalytics(/* @__PURE__ */ jsx(BlockComponent, { config, siteId }));
+}
+
+export { BlockRegistry, BlockRenderer, ComponentNotFound, registerAnalyticsWrapper };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/registry/block-registry.ts","../src/renderer/component-not-found.tsx","../src/renderer/block-renderer.tsx"],"names":["config","jsx"],"mappings":"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","file":"index.js","sourcesContent":["/**\n * Block Component Registry\n * Manages registration and retrieval of block components\n */\n\nimport { ComponentType } from \"react\";\n\nexport class BlockRegistry {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  private components = new Map<string, ComponentType<any>>();\n\n  /**\n   * Register a block component\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  register(type: string, component: ComponentType<any>): void {\n    this.components.set(type, component);\n  }\n\n  /**\n   * Get a block component by type\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  get(type: string): ComponentType<any> | undefined {\n    return this.components.get(type);\n  }\n\n  /**\n   * Check if a block type is registered\n   */\n  has(type: string): boolean {\n    return this.components.has(type);\n  }\n\n  /**\n   * Get all registered block types\n   */\n  getAll(): string[] {\n    return Array.from(this.components.keys());\n  }\n\n  /**\n   * Get count of registered components\n   */\n  size(): number {\n    return this.components.size;\n  }\n}\n","/**\n * Component Not Found Fallback\n * Logs error when a component type is not registered in the registry\n */\n\ninterface ComponentNotFoundProps {\n  type: string;\n  config: Record<string, unknown>;\n  availableTypes: string[];\n  componentKind: \"section\" | \"block\";\n}\n\nexport default function ComponentNotFound({\n  type,\n  config,\n  availableTypes,\n  componentKind,\n}: ComponentNotFoundProps) {\n  const isDev = process.env.NODE_ENV === \"development\";\n\n  const errorDetails = {\n    componentKind,\n    type,\n    config,\n    availableTypes,\n    timestamp: new Date().toISOString(),\n    suggestion: `Create components/${componentKind}s/${type}.tsx and register it in lib/registries/${componentKind}-registry.ts`,\n  };\n\n  if (isDev) {\n    console.error(\n      `[${componentKind === \"section\" ? \"SectionRenderer\" : \"BlockRenderer\"}] Component not found: \"${type}\"`,\n      errorDetails,\n    );\n  } else {\n    console.error(`[CMS] Unknown ${componentKind}: \"${type}\"`);\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  if (typeof window !== \"undefined\" && (window as any).__CMS_ERROR_HANDLER__) {\n    try {\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      (window as any).__CMS_ERROR_HANDLER__({\n        errorType: \"COMPONENT_NOT_FOUND\",\n        severity: \"warning\",\n        ...errorDetails,\n      });\n    } catch {\n      // Ignore errors from error handler\n    }\n  }\n\n  return <div style={{ minHeight: \"1px\" }} aria-hidden=\"true\" />;\n}\n","/**\n * Block Renderer\n * Dynamically renders block components based on schema instance type\n *\n * SSR COMPATIBLE: This is a pure server component with no client hooks.\n * Analytics wrapper is a client component that is rendered by this server\n * component (valid in Next.js RSC architecture).\n */\n\nimport { BlockRegistry } from \"../registry/block-registry\";\nimport ComponentNotFound from \"./component-not-found\";\n\ninterface BlockAnalyticsConfig {\n  enabled: boolean;\n  event_label: string;\n  track_type: \"click\" | \"visibility\" | \"both\";\n  visibility_threshold?: number;\n  fire_once?: boolean;\n  target_providers?: \"all\" | string[];\n  custom_params?: Record<string, string>;\n}\n\ntype AnalyticsWrapperComponent = React.ComponentType<{\n  analyticsConfig: BlockAnalyticsConfig | undefined;\n  blockId: string;\n  blockType: string;\n  children: React.ReactNode;\n}>;\n\nlet globalAnalyticsWrapper: AnalyticsWrapperComponent | null = null;\n\n/**\n * Register a global analytics wrapper component that will be applied to\n * all blocks rendered by BlockRenderer. Call once during app initialization.\n */\nexport function registerAnalyticsWrapper(\n  wrapper: AnalyticsWrapperComponent,\n): void {\n  globalAnalyticsWrapper = wrapper;\n}\n\ninterface BlockInstance {\n  id: string;\n  type: string;\n  config?: Record<string, unknown>;\n  data?: Record<string, unknown>;\n}\n\ninterface BlockRendererProps {\n  block: BlockInstance;\n  blockRegistry: BlockRegistry;\n  siteId?: string;\n  /** Optional wrapper component for block-level analytics (overrides global) */\n  analyticsWrapper?: AnalyticsWrapperComponent;\n}\n\n// NO \"use client\" directive - this is a server component\nexport default function BlockRenderer({\n  block,\n  blockRegistry,\n  siteId,\n  analyticsWrapper,\n}: BlockRendererProps) {\n  const AnalyticsWrapper = analyticsWrapper ?? globalAnalyticsWrapper;\n  const { type, id } = block;\n\n  const BlockComponent = blockRegistry.get(type);\n\n  if (!BlockComponent) {\n    const config =\n      \"config\" in block && block.config !== undefined\n        ? block.config\n        : \"data\" in block && block.data !== undefined\n          ? block.data\n          : {};\n\n    return (\n      <ComponentNotFound\n        type={type}\n        config={config}\n        availableTypes={blockRegistry.getAll()}\n        componentKind=\"block\"\n      />\n    );\n  }\n\n  // Extract analytics config from the block config\n  const blockAnalytics = block.config?.analytics as\n    | BlockAnalyticsConfig\n    | undefined;\n\n  // Helper to wrap rendered block with analytics if wrapper is provided\n  const wrapWithAnalytics = (element: React.ReactElement) => {\n    if (AnalyticsWrapper) {\n      return (\n        <AnalyticsWrapper\n          analyticsConfig={blockAnalytics}\n          blockId={id}\n          blockType={type}\n        >\n          {element}\n        </AnalyticsWrapper>\n      );\n    }\n    return element;\n  };\n\n  // Form blocks get blockId, siteId, and their embedded data\n  if (type.startsWith(\"form-\")) {\n    return wrapWithAnalytics(<BlockComponent blockId={id} siteId={siteId} />);\n  }\n\n  // Special handling for the \"form\" block (embedded form)\n  // This block type receives both config AND data\n  if (type === \"form\") {\n    const config = block.config || {};\n    const data = block.data; // This contains FormBlockData from backend\n    return wrapWithAnalytics(\n      <BlockComponent config={config} data={data} siteId={siteId} />,\n    );\n  }\n\n  // Regular blocks get config (or data if config is not present)\n  const config =\n    \"config\" in block && block.config !== undefined\n      ? block.config\n      : \"data\" in block && block.data !== undefined\n        ? block.data\n        : {};\n\n  // Blocks that can contain nested blocks need the blockRegistry and siteId\n  if (\n    type === \"alert\" ||\n    type === \"card\" ||\n    type === \"modal\" ||\n    type === \"grid-layout\" ||\n    type === \"flexbox-layout\" ||\n    type === \"container-layout\" ||\n    type === \"entry-content\"\n  ) {\n    return wrapWithAnalytics(\n      <BlockComponent\n        config={config}\n        siteId={siteId}\n        blockRegistry={blockRegistry}\n      />,\n    );\n  }\n\n  return wrapWithAnalytics(<BlockComponent config={config} siteId={siteId} />);\n}\n"]}

package/package.json

@@ -0,0 +1,49 @@
+{
+  "name": "@otl-core/block-registry",
+  "version": "1.1.0",
+  "type": "module",
+  "description": "Block registry and renderer for OTL CMS",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "tsup",
+    "clean": "rm -rf dist",
+    "rebuild": "npm run clean && npm run build"
+  },
+  "keywords": [
+    "blocks",
+    "registry",
+    "react",
+    "cms"
+  ],
+  "author": "OTL Core",
+  "license": "PolyForm-Shield-1.0.0",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/otl-core/block-registry.git"
+  },
+  "dependencies": {
+    "@otl-core/cms-types": "^1.1.0"
+  },
+  "peerDependencies": {
+    "react": "^18.0.0"
+  },
+  "devDependencies": {
+    "@types/node": "^25.3.3",
+    "@types/react": "^19.0.0",
+    "react": "^19.0.0",
+    "tsup": "^8.0.0",
+    "typescript": "^5.0.0"
+  }
+}