import { marked } from 'marked';
import type { ReactNode } from 'react';

/**
 * Render first-party lesson markdown to HTML.
 *
 * The source is always a repo `.md` file authored by us (parsed by
 * `@core/lesson-parse`), never user input — so `dangerouslySetInnerHTML` here is
 * not an XSS surface. `marked` runs synchronously with default options.
 */
export function Markdown({ source, className }: { source: string; className?: string }): ReactNode {
  const html = marked.parse(source, { async: false });
  return <div className={className} dangerouslySetInnerHTML={{ __html: html }} />;
}
