@stream-mdx/react 0.4.0 → 1.0.0

package/dist/index-D2MYusAM.d.ts

@@ -1,248 +0,0 @@
-import { InlineNode, TokenLineV1, CompiledMdxModule, InlineHtmlDescriptor, Block, LazyTokenizationPriority, FormatAnticipationConfig, CodeHighlightingMode, CodeHighlightOutputMode, MixedContentSegment } from '@stream-mdx/core';
-import React from 'react';
-
-type GenericComponent = React.ComponentType<any>;
-interface TableElements {
-    Table: GenericComponent;
-    Thead: GenericComponent;
-    Tbody: GenericComponent;
-    Tr: GenericComponent;
-    Th: GenericComponent;
-    Td: GenericComponent;
-}
-type HtmlElements = Record<string, GenericComponent>;
-type InlineHtmlRenderer = (descriptor: InlineHtmlDescriptor, context: {
-    key?: React.Key;
-    defaultRender: () => React.ReactElement | null;
-}) => React.ReactElement | null;
-type InlineHtmlRendererMap = Record<string, InlineHtmlRenderer>;
-interface BlockComponents {
-    paragraph: React.FC<{
-        inlines: InlineNode[];
-        raw?: string;
-        meta?: Record<string, unknown>;
-        children?: React.ReactNode;
-    }>;
-    heading: React.FC<{
-        level: 1 | 2 | 3 | 4 | 5 | 6;
-        inlines: InlineNode[];
-        text?: string;
-        meta?: Record<string, unknown>;
-    }>;
-    code: React.FC<{
-        html: string;
-        meta?: Record<string, unknown>;
-        lines?: ReadonlyArray<{
-            id: string;
-            index: number;
-            text: string;
-            html?: string | null;
-            tokens?: TokenLineV1 | null;
-        }>;
-        lang?: string;
-        preAttrs?: Record<string, string>;
-        codeAttrs?: Record<string, string>;
-    }>;
-    blockquote: React.FC<{
-        inlines: InlineNode[];
-        renderedContent?: React.ReactNode;
-    }>;
-    list: React.FC<{
-        ordered: boolean;
-        items: InlineNode[][];
-    }>;
-    html: React.FC<{
-        __trustedHtml: TrustedHTML | string;
-        elements?: Record<string, GenericComponent>;
-    }>;
-    mdx: React.FC<{
-        compiledRef?: {
-            id: string;
-        };
-        compiledModule?: CompiledMdxModule | null;
-        status?: "pending" | "compiled" | "error";
-        errorMessage?: string;
-        raw?: string;
-    }>;
-    hr: React.FC<React.HTMLAttributes<HTMLHRElement>>;
-    table: React.FC<{
-        header?: InlineNode[][];
-        rows: InlineNode[][][];
-        align?: Array<"left" | "center" | "right" | null>;
-        elements?: Partial<TableElements>;
-    }>;
-    [k: string]: GenericComponent;
-}
-type InlineComponents = Record<string, GenericComponent> & {
-    text: React.FC<{
-        text: string;
-    }>;
-    strong: React.FC<{
-        children: React.ReactNode;
-    }>;
-    em: React.FC<{
-        children: React.ReactNode;
-    }>;
-    strike?: React.FC<{
-        children: React.ReactNode;
-    }>;
-    code: React.FC<{
-        text: string;
-    }>;
-    link: React.FC<{
-        href?: string;
-        title?: string;
-        children: React.ReactNode;
-    }>;
-    image: React.FC<{
-        src: string;
-        alt?: string;
-        title?: string;
-    }>;
-    br: React.FC<Record<string, never>>;
-};
-interface RendererConfig {
-    themes?: {
-        light: string;
-        dark: string;
-    };
-    highlight?: {
-        browserEngine?: "js" | "wasm";
-        serverEngine?: "wasm";
-        langs?: string[];
-    };
-    sanitization?: {
-        schemaId?: string;
-    };
-    mdx?: {
-        enabled?: boolean;
-        compileEndpoint?: string;
-        compileStrategy?: "server" | "worker";
-        components?: Record<string, GenericComponent>;
-    };
-    plugins?: {
-        footnotes?: boolean;
-        html?: boolean;
-        mdx?: boolean;
-        tables?: boolean;
-        callouts?: boolean;
-        math?: boolean;
-        formatAnticipation?: FormatAnticipationConfig;
-        codeHighlighting?: CodeHighlightingMode;
-        outputMode?: CodeHighlightOutputMode;
-        liveCodeHighlighting?: boolean;
-        liveTokenization?: boolean;
-        emitHighlightTokens?: boolean;
-        emitDiffBlocks?: boolean;
-    };
-    performance?: {
-        frameBudgetMs?: number;
-        flushTimeoutMs?: number;
-        maxBatchesPerFlush?: number;
-        maxLowPriorityBatchesPerFlush?: number;
-        lowPriorityFrameBudgetMs?: number;
-        urgentQueueThreshold?: number;
-        batch?: "rAF" | "microtask" | "timeout";
-        historyLimit?: number;
-    };
-}
-interface RendererStore {
-    reset(blocks: Block[]): void;
-    getBlocks(): ReadonlyArray<Block>;
-    getVersion(): number;
-    subscribe(listener: () => void): () => void;
-}
-type CodeHighlightRangeRequest = {
-    blockId: string;
-    startLine: number;
-    endLine: number;
-    priority?: LazyTokenizationPriority;
-};
-interface Renderer {
-    attachWorker(worker: Worker, options?: {
-        skipInit?: boolean;
-    }): void;
-    append(text: string): void;
-    renderStatic(text: string): Promise<Block[]>;
-    onUpdate(cb: (blocks: ReadonlyArray<Block>) => void): () => void;
-    setBlockComponents(map: Partial<BlockComponents>): void;
-    setInlineComponents(map: Partial<InlineComponents>): void;
-    setMdxComponents(map: Record<string, GenericComponent>): void;
-    getComponentRegistry(): ComponentRegistry;
-    getStore(): RendererStore;
-    requestCodeHighlightRange(request: CodeHighlightRangeRequest): void;
-}
-
-type LinkSafetyModalProps = {
-    url: string;
-    isOpen: boolean;
-    isChecking?: boolean;
-    onClose: () => void;
-    onConfirm: () => void;
-    onCopy: () => void;
-};
-declare const DefaultLinkSafetyModal: React.FC<LinkSafetyModalProps>;
-
-/**
- * Render inline nodes to React elements
- */
-declare function renderInlineNodes(nodes: InlineNode[], components: InlineComponents): React.ReactNode;
-/**
- * Default inline components
- */
-declare const defaultInlineComponents: InlineComponents;
-/**
- * Default block components
- */
-declare const defaultBlockComponents: BlockComponents;
-/**
- * Component registry that allows customization
- */
-declare class ComponentRegistry {
-    private blockComponents;
-    private inlineComponents;
-    private htmlElements;
-    private tableElements;
-    private blockComponentMapCache;
-    private inlineComponentMapCache;
-    constructor(blockComponents?: Partial<BlockComponents>, inlineComponents?: Partial<InlineComponents>);
-    /**
-     * Update block components
-     */
-    setBlockComponents(components: Partial<BlockComponents>): void;
-    /**
-     * Update inline components
-     */
-    setInlineComponents(components: Partial<InlineComponents>): void;
-    /** Update HTML element mapping for html blocks */
-    setHtmlElements(map: Partial<HtmlElements>): void;
-    /** Update table element mapping for table blocks */
-    setTableElements(map: Partial<TableElements>): void;
-    /**
-     * Get block component
-     */
-    getBlockComponent(type: string): React.ComponentType<Record<string, unknown>>;
-    /**
-     * Get inline components
-     */
-    getInlineComponents(): InlineComponents;
-    getBlockComponentMap(): BlockComponents;
-    getInlineComponentMap(): InlineComponents;
-    getTableElements(): TableElements;
-    /**
-     * Render a block
-     */
-    renderBlock(block: Block): React.ReactElement;
-    /**
-     * Get props for a block based on its type
-     */
-    private getBlockProps;
-    /**
-     * Extract heading level from raw markdown
-     */
-    private extractHeadingLevel;
-}
-declare function mapHtmlToReact(html: string, elements: HtmlElements): React.ReactNode;
-declare function renderParagraphMixedSegments(segments: MixedContentSegment[], inlineComponents: InlineComponents, inlineHtmlRenderers: InlineHtmlRendererMap): React.ReactNode[];
-
-export { type BlockComponents as B, ComponentRegistry as C, DefaultLinkSafetyModal as D, type HtmlElements as H, type InlineHtmlRendererMap as I, type LinkSafetyModalProps as L, type Renderer as R, type TableElements as T, type InlineComponents as a, type InlineHtmlRenderer as b, type RendererConfig as c, defaultInlineComponents as d, defaultBlockComponents as e, renderParagraphMixedSegments as f, type CodeHighlightRangeRequest as g, mapHtmlToReact as m, renderInlineNodes as r };

package/dist/mdx-client.cjs

@@ -1,408 +0,0 @@
-"use client";
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/mdx-client.ts
-var mdx_client_exports = {};
-__export(mdx_client_exports, {
-  MDXClient: () => MDXClient,
-  MDXComponentFactory: () => MDXComponentFactory,
-  getMDXClient: () => getMDXClient,
-  getMDXComponentFactory: () => getMDXComponentFactory,
-  registerInlineMdxModule: () => registerInlineMdxModule,
-  registerMDXComponents: () => registerMDXComponents
-});
-module.exports = __toCommonJS(mdx_client_exports);
-var import_react = __toESM(require("react"), 1);
-var ReactJsxRuntime = __toESM(require("react/jsx-runtime"), 1);
-var withClassName = (tag, className) => {
-  return (props) => import_react.default.createElement(tag, { className, ...props });
-};
-function assignMdxChildKey(child, index) {
-  if (child == null) return child;
-  if (Array.isArray(child)) {
-    return child.map((entry, subIndex) => assignMdxChildKey(entry, `${index}-${subIndex}`));
-  }
-  if (import_react.default.isValidElement(child)) {
-    if (child.key !== null && child.key !== void 0) {
-      return child;
-    }
-    return import_react.default.cloneElement(child, { key: index });
-  }
-  return child;
-}
-var MDXClient = class {
-  constructor(compileEndpoint = "/api/mdx-compile-v2") {
-    this.cache = /* @__PURE__ */ new Map();
-    this.inlineModules = /* @__PURE__ */ new Map();
-    this.compiledCache = /* @__PURE__ */ new Map();
-    this.compiledInflight = /* @__PURE__ */ new Map();
-    this.compileEndpoint = compileEndpoint;
-  }
-  /**
-   * Compile MDX block on server
-   */
-  async compile(block) {
-    if (block.type !== "mdx") {
-      throw new Error("Block is not MDX type");
-    }
-    const cacheKey = block.id;
-    const cachedPromise = this.cache.get(cacheKey);
-    if (cachedPromise) {
-      return cachedPromise;
-    }
-    const compilationPromise = this.doCompile(block);
-    this.cache.set(cacheKey, compilationPromise);
-    try {
-      const result = await compilationPromise;
-      return result;
-    } catch (error) {
-      this.cache.delete(cacheKey);
-      throw error;
-    }
-  }
-  async getCompiledInternal(ref) {
-    const inline = this.inlineModules.get(ref.id);
-    if (inline) {
-      return this.cloneCompiled(inline);
-    }
-    const cached = this.compiledCache.get(ref.id);
-    if (cached) {
-      return this.cloneCompiled(cached);
-    }
-    const inflight = this.compiledInflight.get(ref.id);
-    if (inflight) {
-      const resolved = await inflight;
-      return this.cloneCompiled(resolved);
-    }
-    const fetchPromise = this.fetchCompiled(ref);
-    this.compiledInflight.set(ref.id, fetchPromise);
-    try {
-      const data = await fetchPromise;
-      this.compiledCache.set(ref.id, data);
-      return this.cloneCompiled(data);
-    } finally {
-      this.compiledInflight.delete(ref.id);
-    }
-  }
-  async getCompiled(ref, options) {
-    if (options?.signal) {
-      const inline = this.inlineModules.get(ref.id);
-      if (inline) {
-        return this.cloneCompiled(inline);
-      }
-      const cached = this.compiledCache.get(ref.id);
-      if (cached) {
-        return this.cloneCompiled(cached);
-      }
-      const data = await this.fetchCompiled(ref, options);
-      this.compiledCache.set(ref.id, data);
-      return this.cloneCompiled(data);
-    }
-    return this.getCompiledInternal(ref);
-  }
-  /**
-   * Clear compilation cache
-   */
-  clearCache() {
-    this.cache.clear();
-    this.compiledCache.clear();
-    this.compiledInflight.clear();
-  }
-  registerInlineModule(compiled) {
-    this.inlineModules.set(compiled.id, {
-      ...compiled,
-      dependencies: Array.isArray(compiled.dependencies) ? [...compiled.dependencies] : []
-    });
-  }
-  clearInlineModules() {
-    this.inlineModules.clear();
-  }
-  /**
-   * Actual compilation implementation
-   */
-  async doCompile(block) {
-    const response = await fetch(this.compileEndpoint, {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json"
-      },
-      body: JSON.stringify({
-        content: block.payload.raw,
-        blockId: block.id
-      })
-    });
-    if (!response.ok) {
-      const error = await response.json().catch(() => ({ error: "Unknown error" }));
-      throw new Error(`MDX compilation failed: ${error.error || response.statusText}`);
-    }
-    const data = await response.json();
-    return {
-      id: data.id,
-      code: data.code,
-      dependencies: data.dependencies || [],
-      cached: data.cached || false
-    };
-  }
-  async fetchCompiled(ref, options) {
-    const response = await fetch(`${this.compileEndpoint}?id=${ref.id}`, {
-      signal: options?.signal
-    });
-    if (!response.ok) {
-      throw new Error(`Failed to get compiled MDX: ${response.statusText}`);
-    }
-    const data = await response.json();
-    return {
-      id: data.id,
-      code: data.code,
-      dependencies: data.dependencies || [],
-      timestamp: data.timestamp
-    };
-  }
-  cloneCompiled(compiled) {
-    return {
-      ...compiled,
-      dependencies: Array.isArray(compiled.dependencies) ? [...compiled.dependencies] : []
-    };
-  }
-};
-var MDXComponentFactory = class {
-  constructor(mdxClient) {
-    this.components = /* @__PURE__ */ new Map();
-    this.customComponents = /* @__PURE__ */ new Map();
-    this.mdxClient = mdxClient;
-    this.baseComponents = this.createBaseComponents();
-  }
-  registerInlineModule(module2) {
-    this.mdxClient.registerInlineModule(module2);
-    this.components.delete(module2.id);
-  }
-  /**
-   * Create React component from compiled MDX
-   */
-  async createComponent(ref) {
-    const cached = this.components.get(ref.id);
-    if (cached) {
-      return cached;
-    }
-    const compiled = await this.mdxClient.getCompiled(ref);
-    const component = this.evaluateCompiledMDX(compiled);
-    this.components.set(ref.id, component);
-    return component;
-  }
-  /**
-   * Safely evaluate compiled MDX code
-   */
-  evaluateCompiledMDX(compiled) {
-    try {
-      const context = this.createEvaluationContext();
-      const argNames = Object.keys(context);
-      const argValues = Object.values(context);
-      const moduleExports = new Function(...argNames, compiled.code)(...argValues);
-      const MDXComponent = this.resolveEvaluatedModule(moduleExports);
-      return (props) => {
-        const registryComponents = this.getComponents();
-        const incomingComponents = props?.components;
-        const mergedComponents = incomingComponents ? { ...registryComponents, ...incomingComponents } : registryComponents;
-        return import_react.default.createElement(MDXComponent, {
-          ...props,
-          components: mergedComponents
-        });
-      };
-    } catch (error) {
-      console.error("Failed to evaluate MDX:", error);
-      return () => import_react.default.createElement(
-        "div",
-        {
-          className: "mdx-error"
-        },
-        `MDX Error: ${error instanceof Error ? error.message : "Unknown error"}`
-      );
-    }
-  }
-  /**
-   * Create safe evaluation context for MDX
-   */
-  createEvaluationContext() {
-    const runtime = ReactJsxRuntime;
-    const createElementWithChildren = (type, props, key) => {
-      const baseProps = props ?? {};
-      const finalProps = key === void 0 || key === null ? baseProps : { ...baseProps, key };
-      if (Array.isArray(finalProps.children)) {
-        finalProps.children = finalProps.children.map((child, index) => assignMdxChildKey(child, index));
-      }
-      return import_react.default.createElement(type, finalProps);
-    };
-    const runtimeJsx = typeof runtime.jsx === "function" ? runtime.jsx.bind(runtime) : createElementWithChildren;
-    const runtimeJsxs = typeof runtime.jsxs === "function" ? runtime.jsxs.bind(runtime) : createElementWithChildren;
-    const runtimeJsxDEV = typeof runtime.jsxDEV === "function" ? runtime.jsxDEV.bind(runtime) : (type, props, key, ..._rest) => createElementWithChildren(type, props, key);
-    const jsxRuntime = {
-      jsx: runtimeJsx,
-      jsxs: runtimeJsxs,
-      jsxDEV: runtimeJsxDEV,
-      Fragment: runtime.Fragment ?? import_react.default.Fragment
-    };
-    return {
-      __mdx_runtime: jsxRuntime,
-      React: import_react.default,
-      Fragment: import_react.default.Fragment,
-      useState: import_react.default.useState,
-      useEffect: import_react.default.useEffect,
-      useMemo: import_react.default.useMemo,
-      useCallback: import_react.default.useCallback,
-      useRef: import_react.default.useRef,
-      useContext: import_react.default.useContext,
-      useReducer: import_react.default.useReducer,
-      useLayoutEffect: import_react.default.useLayoutEffect,
-      console: {
-        log: console.log,
-        warn: console.warn,
-        error: console.error
-      }
-    };
-  }
-  resolveEvaluatedModule(output) {
-    if (!output) {
-      throw new Error("Compiled MDX module returned no exports");
-    }
-    if (typeof output === "function") {
-      return output;
-    }
-    if (typeof output.default === "function") {
-      return output.default;
-    }
-    if (typeof output.MDXContent === "function") {
-      return output.MDXContent;
-    }
-    throw new Error("Compiled MDX module did not export a component");
-  }
-  getComponents() {
-    if (this.customComponents.size === 0) {
-      return { ...this.baseComponents };
-    }
-    const merged = { ...this.baseComponents };
-    for (const [key, component] of this.customComponents) {
-      merged[key] = component;
-    }
-    return merged;
-  }
-  /**
-   * Register or replace custom MDX components
-   */
-  registerComponents(components, options) {
-    if (options?.replace) {
-      this.customComponents.clear();
-    }
-    for (const [key, component] of Object.entries(components)) {
-      if (!component) continue;
-      this.customComponents.set(key, component);
-    }
-  }
-  /**
-   * Get base MDX components
-   */
-  createBaseComponents() {
-    return {
-      // Standard HTML elements
-      h1: withClassName("h1", "mdx-h1"),
-      h2: withClassName("h2", "mdx-h2"),
-      h3: withClassName("h3", "mdx-h3"),
-      h4: withClassName("h4", "mdx-h4"),
-      h5: withClassName("h5", "mdx-h5"),
-      h6: withClassName("h6", "mdx-h6"),
-      p: withClassName("p", "mdx-p"),
-      strong: withClassName("strong", "mdx-strong"),
-      em: withClassName("em", "mdx-em"),
-      code: withClassName("code", "mdx-code"),
-      pre: withClassName("pre", "mdx-pre"),
-      ul: withClassName("ul", "mdx-ul"),
-      ol: withClassName("ol", "mdx-ol"),
-      li: withClassName("li", "mdx-li"),
-      blockquote: withClassName("blockquote", "mdx-blockquote"),
-      a: (props) => import_react.default.createElement("a", {
-        className: "mdx-link",
-        target: props.href?.startsWith("http") ? "_blank" : void 0,
-        rel: props.href?.startsWith("http") ? "noopener noreferrer" : void 0,
-        ...props
-      }),
-      img: (props) => import_react.default.createElement("img", { className: "mdx-img", ...props }),
-      table: withClassName("table", "mdx-table"),
-      thead: withClassName("thead", "mdx-thead"),
-      tbody: withClassName("tbody", "mdx-tbody"),
-      tr: withClassName("tr", "mdx-tr"),
-      th: withClassName("th", "mdx-th"),
-      td: withClassName("td", "mdx-td")
-    };
-  }
-  /**
-   * Clear component cache
-   */
-  clearCache() {
-    this.components.clear();
-  }
-  clearCustomComponents() {
-    this.customComponents.clear();
-  }
-};
-var globalMDXClient = null;
-var globalComponentFactory = null;
-function getMDXClient(compileEndpoint) {
-  if (!globalMDXClient) {
-    globalMDXClient = new MDXClient(compileEndpoint);
-  }
-  return globalMDXClient;
-}
-function getMDXComponentFactory(compileEndpoint) {
-  if (!globalComponentFactory) {
-    const client = getMDXClient(compileEndpoint);
-    globalComponentFactory = new MDXComponentFactory(client);
-  }
-  return globalComponentFactory;
-}
-function registerMDXComponents(components, options) {
-  const factory = getMDXComponentFactory();
-  factory.registerComponents(components, options);
-}
-function registerInlineMdxModule(compiled) {
-  const factory = getMDXComponentFactory();
-  factory.registerInlineModule({
-    id: compiled.id,
-    code: compiled.code,
-    dependencies: compiled.dependencies ?? []
-  });
-}
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  MDXClient,
-  MDXComponentFactory,
-  getMDXClient,
-  getMDXComponentFactory,
-  registerInlineMdxModule,
-  registerMDXComponents
-});