cms-renderer 0.1.3 → 0.1.4

package/dist/lib/markdown-utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../lib/markdown-utils.ts"],"sourcesContent":["/**\n * Markdown Parsing Utilities\n *\n * Three implementations showing the progression from naive to production-ready:\n * - v1 (Naive): Direct call, crashes on bad input\n * - v2 (Defensive): Try-catch with null fallback\n * - v3 (Robust): Result type, validation, sanitization\n *\n * The robust version (v3) is exported as the default `parseMarkdown`.\n */\n\nimport type { MDTree } from 'md4w';\nimport { mdToJSON } from 'md4w';\n\nimport { err, ok, type Result } from './result';\n\n// -----------------------------------------------------------------------------\n// Types\n// -----------------------------------------------------------------------------\n\n/**\n * Error codes for markdown parsing failures.\n */\nexport const ParseErrorCode = {\n  INVALID_INPUT: 'INVALID_INPUT',\n  EMPTY_CONTENT: 'EMPTY_CONTENT',\n  PARSE_FAILED: 'PARSE_FAILED',\n  CONTENT_TOO_LONG: 'CONTENT_TOO_LONG',\n  NESTED_TOO_DEEP: 'NESTED_TOO_DEEP',\n} as const;\n\nexport type ParseErrorCode = (typeof ParseErrorCode)[keyof typeof ParseErrorCode];\n\n/**\n * Structured error for markdown parsing failures.\n */\nexport interface ParseError {\n  code: ParseErrorCode;\n  message: string;\n  cause?: Error;\n}\n\n/**\n * Options for robust markdown parsing.\n */\nexport interface ParseOptions {\n  /**\n   * Maximum content length in characters.\n   * @default 500000 (500KB of text, ~100K words)\n   */\n  maxLength?: number;\n\n  /**\n   * Whether to sanitize XSS attempts in the output.\n   * @default true\n   */\n  sanitize?: boolean;\n\n  /**\n   * Whether to allow empty content.\n   * @default false\n   */\n  allowEmpty?: boolean;\n}\n\n// -----------------------------------------------------------------------------\n// Constants\n// -----------------------------------------------------------------------------\n\nconst DEFAULT_MAX_LENGTH = 500_000; // 500KB of text\n\n/**\n * Patterns that indicate potential XSS attempts in markdown.\n * These are checked in raw content before parsing.\n */\nconst XSS_PATTERNS = [\n  /<script\\b/i,\n  /javascript:/i,\n  /on\\w+\\s*=/i, // onclick=, onerror=, etc.\n  /data:/i, // data: URIs can be dangerous\n  /vbscript:/i,\n] as const;\n\n// -----------------------------------------------------------------------------\n// V1: Naive Implementation\n// -----------------------------------------------------------------------------\n\n/**\n * Naive markdown parser - crashes on bad input.\n *\n * DO NOT USE IN PRODUCTION. This is for demonstration only.\n *\n * Problems:\n * - No input validation\n * - No error handling\n * - Will crash the entire app on malformed input\n * - No protection against XSS\n * - No content limits\n *\n * @example\n * ```ts\n * // This crashes if content is null, undefined, or malformed\n * const ast = parseMarkdownV1(userInput);\n * ```\n */\nexport function parseMarkdownV1(content: string): MDTree {\n  return mdToJSON(content);\n}\n\n// -----------------------------------------------------------------------------\n// V2: Defensive Implementation\n// -----------------------------------------------------------------------------\n\n/**\n * Defensive markdown parser - catches errors but loses context.\n *\n * Better than v1 but still problematic:\n * - Returns null on any error (loses error details)\n * - Caller can't distinguish between empty content and parse failure\n * - Still no XSS protection\n * - Still no content limits\n *\n * @example\n * ```ts\n * const ast = parseMarkdownV2(userInput);\n * if (!ast) {\n *   // What went wrong? We don't know.\n *   return <ErrorFallback />;\n * }\n * ```\n */\nexport function parseMarkdownV2(content: string): MDTree | null {\n  try {\n    // Basic null check\n    if (content == null) {\n      return null;\n    }\n    return mdToJSON(content);\n  } catch {\n    return null;\n  }\n}\n\n// -----------------------------------------------------------------------------\n// V3: Robust Implementation\n// -----------------------------------------------------------------------------\n\n/**\n * Creates a ParseError with the given code and message.\n */\nfunction createParseError(code: ParseErrorCode, message: string, cause?: Error): ParseError {\n  return { code, message, cause };\n}\n\n/**\n * Checks content for potential XSS patterns.\n * Returns the first matched pattern or null if clean.\n */\nfunction detectXssPattern(content: string): RegExp | null {\n  for (const pattern of XSS_PATTERNS) {\n    if (pattern.test(content)) {\n      return pattern;\n    }\n  }\n  return null;\n}\n\n/**\n * Sanitizes content by removing dangerous patterns.\n * This is a basic sanitizer; production should use DOMPurify.\n */\nfunction sanitizeContent(content: string): string {\n  let sanitized = content;\n\n  // Remove script tags\n  sanitized = sanitized.replace(/<script\\b[^<]*(?:(?!<\\/script>)<[^<]*)*<\\/script>/gi, '');\n\n  // Remove javascript: and vbscript: URLs\n  sanitized = sanitized.replace(/javascript:/gi, 'removed:');\n  sanitized = sanitized.replace(/vbscript:/gi, 'removed:');\n\n  // Remove event handlers (onclick, onerror, etc.)\n  sanitized = sanitized.replace(/\\bon\\w+\\s*=\\s*[\"'][^\"']*[\"']/gi, '');\n  sanitized = sanitized.replace(/\\bon\\w+\\s*=\\s*\\S+/gi, '');\n\n  return sanitized;\n}\n\n/**\n * Robust markdown parser - production-ready with full error context.\n *\n * Features:\n * - Input validation with specific error codes\n * - Result type for explicit error handling\n * - XSS pattern detection and optional sanitization\n * - Content length limits\n * - Preserves error context for debugging\n *\n * @param content - Markdown string to parse\n * @param options - Parsing options\n * @returns Result containing the AST or a structured error\n *\n * @example\n * ```ts\n * const result = parseMarkdownV3(userInput);\n *\n * if (!result.ok) {\n *   switch (result.error.code) {\n *     case 'INVALID_INPUT':\n *       return <InvalidInputError message={result.error.message} />;\n *     case 'CONTENT_TOO_LONG':\n *       return <ContentTooLongError />;\n *     case 'PARSE_FAILED':\n *       console.error('Parse error:', result.error.cause);\n *       return <ParseError />;\n *     default:\n *       return <GenericError />;\n *   }\n * }\n *\n * return <MarkdownRenderer ast={result.value} />;\n * ```\n */\nexport function parseMarkdownV3(\n  content: string,\n  options: ParseOptions = {}\n): Result<MDTree, ParseError> {\n  const { maxLength = DEFAULT_MAX_LENGTH, sanitize = true, allowEmpty = false } = options;\n\n  // 1. Validate input type\n  if (content === null || content === undefined) {\n    return err(\n      createParseError(\n        ParseErrorCode.INVALID_INPUT,\n        `Content must be a string, received ${content === null ? 'null' : 'undefined'}`\n      )\n    );\n  }\n\n  if (typeof content !== 'string') {\n    return err(\n      createParseError(\n        ParseErrorCode.INVALID_INPUT,\n        `Content must be a string, received ${typeof content}`\n      )\n    );\n  }\n\n  // 2. Handle empty content\n  const trimmed = content.trim();\n  if (trimmed.length === 0 && !allowEmpty) {\n    return err(\n      createParseError(ParseErrorCode.EMPTY_CONTENT, 'Content is empty or contains only whitespace')\n    );\n  }\n\n  // 3. Check content length\n  if (content.length > maxLength) {\n    return err(\n      createParseError(\n        ParseErrorCode.CONTENT_TOO_LONG,\n        `Content exceeds maximum length of ${maxLength.toLocaleString()} characters ` +\n          `(received ${content.length.toLocaleString()})`\n      )\n    );\n  }\n\n  // 4. Check for XSS patterns\n  const xssPattern = detectXssPattern(content);\n  if (xssPattern) {\n    if (process.env.NODE_ENV === 'development') {\n      console.warn(\n        `[parseMarkdownV3] XSS pattern detected: ${xssPattern.toString()}`,\n        sanitize ? 'Content will be sanitized.' : 'Sanitization is disabled!'\n      );\n    }\n  }\n\n  // 5. Optionally sanitize content\n  const processedContent = sanitize ? sanitizeContent(content) : content;\n\n  // 6. Parse markdown with error handling\n  try {\n    const ast = mdToJSON(processedContent);\n    return ok(ast);\n  } catch (error) {\n    const cause = error instanceof Error ? error : new Error(String(error));\n    return err(\n      createParseError(\n        ParseErrorCode.PARSE_FAILED,\n        `Failed to parse markdown: ${cause.message}`,\n        cause\n      )\n    );\n  }\n}\n\n// -----------------------------------------------------------------------------\n// Default Export\n// -----------------------------------------------------------------------------\n\n/**\n * Production-ready markdown parser.\n *\n * This is an alias for `parseMarkdownV3` - the robust implementation\n * with validation, sanitization, and Result-based error handling.\n *\n * @example\n * ```ts\n * import { parseMarkdown } from '@/lib/markdown-utils';\n *\n * const result = parseMarkdown(content);\n * if (!result.ok) {\n *   // Handle error with full context\n *   console.error(`[${result.error.code}] ${result.error.message}`);\n *   return null;\n * }\n * return result.value;\n * ```\n */\nexport const parseMarkdown = parseMarkdownV3;\n\n// -----------------------------------------------------------------------------\n// Utility Functions\n// -----------------------------------------------------------------------------\n\n/**\n * Checks if content is safe markdown (no XSS patterns detected).\n *\n * @param content - Markdown string to check\n * @returns true if no XSS patterns detected\n */\nexport function isSafeMarkdown(content: string): boolean {\n  return detectXssPattern(content) === null;\n}\n\n/**\n * Estimates the word count of markdown content.\n * Useful for content length limits and reading time estimates.\n *\n * @param content - Markdown string to count\n * @returns Estimated word count\n */\nexport function estimateWordCount(content: string): number {\n  // Remove markdown syntax for more accurate count\n  const plainText = content\n    .replace(/#+\\s/g, '') // Remove headings\n    .replace(/\\*\\*|__|~~|`/g, '') // Remove formatting\n    .replace(/\\[([^\\]]+)\\]\\([^)]+\\)/g, '$1') // Convert links to text\n    .replace(/!\\[([^\\]]*)\\]\\([^)]+\\)/g, '') // Remove images\n    .replace(/```[\\s\\S]*?```/g, '') // Remove code blocks\n    .replace(/`[^`]+`/g, ''); // Remove inline code\n\n  const words = plainText.trim().split(/\\s+/).filter(Boolean);\n  return words.length;\n}\n\n/**\n * Estimates reading time for markdown content.\n *\n * @param content - Markdown string\n * @param wordsPerMinute - Reading speed (default 200 WPM)\n * @returns Reading time in minutes\n */\nexport function estimateReadingTime(content: string, wordsPerMinute = 200): number {\n  const wordCount = estimateWordCount(content);\n  return Math.ceil(wordCount / wordsPerMinute);\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../lib/markdown-utils.ts","../../lib/result.ts"],"sourcesContent":["/**\n * Markdown Parsing Utilities\n *\n * Three implementations showing the progression from naive to production-ready:\n * - v1 (Naive): Direct call, crashes on bad input\n * - v2 (Defensive): Try-catch with null fallback\n * - v3 (Robust): Result type, validation, sanitization\n *\n * The robust version (v3) is exported as the default `parseMarkdown`.\n */\n\nimport type { MDTree } from 'md4w';\nimport { mdToJSON } from 'md4w';\n\nimport { err, ok, type Result } from './result';\n\n// -----------------------------------------------------------------------------\n// Types\n// -----------------------------------------------------------------------------\n\n/**\n * Error codes for markdown parsing failures.\n */\nexport const ParseErrorCode = {\n  INVALID_INPUT: 'INVALID_INPUT',\n  EMPTY_CONTENT: 'EMPTY_CONTENT',\n  PARSE_FAILED: 'PARSE_FAILED',\n  CONTENT_TOO_LONG: 'CONTENT_TOO_LONG',\n  NESTED_TOO_DEEP: 'NESTED_TOO_DEEP',\n} as const;\n\nexport type ParseErrorCode = (typeof ParseErrorCode)[keyof typeof ParseErrorCode];\n\n/**\n * Structured error for markdown parsing failures.\n */\nexport interface ParseError {\n  code: ParseErrorCode;\n  message: string;\n  cause?: Error;\n}\n\n/**\n * Options for robust markdown parsing.\n */\nexport interface ParseOptions {\n  /**\n   * Maximum content length in characters.\n   * @default 500000 (500KB of text, ~100K words)\n   */\n  maxLength?: number;\n\n  /**\n   * Whether to sanitize XSS attempts in the output.\n   * @default true\n   */\n  sanitize?: boolean;\n\n  /**\n   * Whether to allow empty content.\n   * @default false\n   */\n  allowEmpty?: boolean;\n}\n\n// -----------------------------------------------------------------------------\n// Constants\n// -----------------------------------------------------------------------------\n\nconst DEFAULT_MAX_LENGTH = 500_000; // 500KB of text\n\n/**\n * Patterns that indicate potential XSS attempts in markdown.\n * These are checked in raw content before parsing.\n */\nconst XSS_PATTERNS = [\n  /<script\\b/i,\n  /javascript:/i,\n  /on\\w+\\s*=/i, // onclick=, onerror=, etc.\n  /data:/i, // data: URIs can be dangerous\n  /vbscript:/i,\n] as const;\n\n// -----------------------------------------------------------------------------\n// V1: Naive Implementation\n// -----------------------------------------------------------------------------\n\n/**\n * Naive markdown parser - crashes on bad input.\n *\n * DO NOT USE IN PRODUCTION. This is for demonstration only.\n *\n * Problems:\n * - No input validation\n * - No error handling\n * - Will crash the entire app on malformed input\n * - No protection against XSS\n * - No content limits\n *\n * @example\n * ```ts\n * // This crashes if content is null, undefined, or malformed\n * const ast = parseMarkdownV1(userInput);\n * ```\n */\nexport function parseMarkdownV1(content: string): MDTree {\n  return mdToJSON(content);\n}\n\n// -----------------------------------------------------------------------------\n// V2: Defensive Implementation\n// -----------------------------------------------------------------------------\n\n/**\n * Defensive markdown parser - catches errors but loses context.\n *\n * Better than v1 but still problematic:\n * - Returns null on any error (loses error details)\n * - Caller can't distinguish between empty content and parse failure\n * - Still no XSS protection\n * - Still no content limits\n *\n * @example\n * ```ts\n * const ast = parseMarkdownV2(userInput);\n * if (!ast) {\n *   // What went wrong? We don't know.\n *   return <ErrorFallback />;\n * }\n * ```\n */\nexport function parseMarkdownV2(content: string): MDTree | null {\n  try {\n    // Basic null check\n    if (content == null) {\n      return null;\n    }\n    return mdToJSON(content);\n  } catch {\n    return null;\n  }\n}\n\n// -----------------------------------------------------------------------------\n// V3: Robust Implementation\n// -----------------------------------------------------------------------------\n\n/**\n * Creates a ParseError with the given code and message.\n */\nfunction createParseError(code: ParseErrorCode, message: string, cause?: Error): ParseError {\n  return { code, message, cause };\n}\n\n/**\n * Checks content for potential XSS patterns.\n * Returns the first matched pattern or null if clean.\n */\nfunction detectXssPattern(content: string): RegExp | null {\n  for (const pattern of XSS_PATTERNS) {\n    if (pattern.test(content)) {\n      return pattern;\n    }\n  }\n  return null;\n}\n\n/**\n * Sanitizes content by removing dangerous patterns.\n * This is a basic sanitizer; production should use DOMPurify.\n */\nfunction sanitizeContent(content: string): string {\n  let sanitized = content;\n\n  // Remove script tags\n  sanitized = sanitized.replace(/<script\\b[^<]*(?:(?!<\\/script>)<[^<]*)*<\\/script>/gi, '');\n\n  // Remove javascript: and vbscript: URLs\n  sanitized = sanitized.replace(/javascript:/gi, 'removed:');\n  sanitized = sanitized.replace(/vbscript:/gi, 'removed:');\n\n  // Remove event handlers (onclick, onerror, etc.)\n  sanitized = sanitized.replace(/\\bon\\w+\\s*=\\s*[\"'][^\"']*[\"']/gi, '');\n  sanitized = sanitized.replace(/\\bon\\w+\\s*=\\s*\\S+/gi, '');\n\n  return sanitized;\n}\n\n/**\n * Robust markdown parser - production-ready with full error context.\n *\n * Features:\n * - Input validation with specific error codes\n * - Result type for explicit error handling\n * - XSS pattern detection and optional sanitization\n * - Content length limits\n * - Preserves error context for debugging\n *\n * @param content - Markdown string to parse\n * @param options - Parsing options\n * @returns Result containing the AST or a structured error\n *\n * @example\n * ```ts\n * const result = parseMarkdownV3(userInput);\n *\n * if (!result.ok) {\n *   switch (result.error.code) {\n *     case 'INVALID_INPUT':\n *       return <InvalidInputError message={result.error.message} />;\n *     case 'CONTENT_TOO_LONG':\n *       return <ContentTooLongError />;\n *     case 'PARSE_FAILED':\n *       console.error('Parse error:', result.error.cause);\n *       return <ParseError />;\n *     default:\n *       return <GenericError />;\n *   }\n * }\n *\n * return <MarkdownRenderer ast={result.value} />;\n * ```\n */\nexport function parseMarkdownV3(\n  content: string,\n  options: ParseOptions = {}\n): Result<MDTree, ParseError> {\n  const { maxLength = DEFAULT_MAX_LENGTH, sanitize = true, allowEmpty = false } = options;\n\n  // 1. Validate input type\n  if (content === null || content === undefined) {\n    return err(\n      createParseError(\n        ParseErrorCode.INVALID_INPUT,\n        `Content must be a string, received ${content === null ? 'null' : 'undefined'}`\n      )\n    );\n  }\n\n  if (typeof content !== 'string') {\n    return err(\n      createParseError(\n        ParseErrorCode.INVALID_INPUT,\n        `Content must be a string, received ${typeof content}`\n      )\n    );\n  }\n\n  // 2. Handle empty content\n  const trimmed = content.trim();\n  if (trimmed.length === 0 && !allowEmpty) {\n    return err(\n      createParseError(ParseErrorCode.EMPTY_CONTENT, 'Content is empty or contains only whitespace')\n    );\n  }\n\n  // 3. Check content length\n  if (content.length > maxLength) {\n    return err(\n      createParseError(\n        ParseErrorCode.CONTENT_TOO_LONG,\n        `Content exceeds maximum length of ${maxLength.toLocaleString()} characters ` +\n          `(received ${content.length.toLocaleString()})`\n      )\n    );\n  }\n\n  // 4. Check for XSS patterns\n  const xssPattern = detectXssPattern(content);\n  if (xssPattern) {\n    if (process.env.NODE_ENV === 'development') {\n      console.warn(\n        `[parseMarkdownV3] XSS pattern detected: ${xssPattern.toString()}`,\n        sanitize ? 'Content will be sanitized.' : 'Sanitization is disabled!'\n      );\n    }\n  }\n\n  // 5. Optionally sanitize content\n  const processedContent = sanitize ? sanitizeContent(content) : content;\n\n  // 6. Parse markdown with error handling\n  try {\n    const ast = mdToJSON(processedContent);\n    return ok(ast);\n  } catch (error) {\n    const cause = error instanceof Error ? error : new Error(String(error));\n    return err(\n      createParseError(\n        ParseErrorCode.PARSE_FAILED,\n        `Failed to parse markdown: ${cause.message}`,\n        cause\n      )\n    );\n  }\n}\n\n// -----------------------------------------------------------------------------\n// Default Export\n// -----------------------------------------------------------------------------\n\n/**\n * Production-ready markdown parser.\n *\n * This is an alias for `parseMarkdownV3` - the robust implementation\n * with validation, sanitization, and Result-based error handling.\n *\n * @example\n * ```ts\n * import { parseMarkdown } from '@/lib/markdown-utils';\n *\n * const result = parseMarkdown(content);\n * if (!result.ok) {\n *   // Handle error with full context\n *   console.error(`[${result.error.code}] ${result.error.message}`);\n *   return null;\n * }\n * return result.value;\n * ```\n */\nexport const parseMarkdown = parseMarkdownV3;\n\n// -----------------------------------------------------------------------------\n// Utility Functions\n// -----------------------------------------------------------------------------\n\n/**\n * Checks if content is safe markdown (no XSS patterns detected).\n *\n * @param content - Markdown string to check\n * @returns true if no XSS patterns detected\n */\nexport function isSafeMarkdown(content: string): boolean {\n  return detectXssPattern(content) === null;\n}\n\n/**\n * Estimates the word count of markdown content.\n * Useful for content length limits and reading time estimates.\n *\n * @param content - Markdown string to count\n * @returns Estimated word count\n */\nexport function estimateWordCount(content: string): number {\n  // Remove markdown syntax for more accurate count\n  const plainText = content\n    .replace(/#+\\s/g, '') // Remove headings\n    .replace(/\\*\\*|__|~~|`/g, '') // Remove formatting\n    .replace(/\\[([^\\]]+)\\]\\([^)]+\\)/g, '$1') // Convert links to text\n    .replace(/!\\[([^\\]]*)\\]\\([^)]+\\)/g, '') // Remove images\n    .replace(/```[\\s\\S]*?```/g, '') // Remove code blocks\n    .replace(/`[^`]+`/g, ''); // Remove inline code\n\n  const words = plainText.trim().split(/\\s+/).filter(Boolean);\n  return words.length;\n}\n\n/**\n * Estimates reading time for markdown content.\n *\n * @param content - Markdown string\n * @param wordsPerMinute - Reading speed (default 200 WPM)\n * @returns Reading time in minutes\n */\nexport function estimateReadingTime(content: string, wordsPerMinute = 200): number {\n  const wordCount = estimateWordCount(content);\n  return Math.ceil(wordCount / wordsPerMinute);\n}\n","/**\n * Result Type Utilities\n *\n * Go-style error handling with discriminated union types.\n * Provides type-safe success/error handling without exceptions.\n *\n * @example\n * ```ts\n * const [err, data] = await handle(async () => {\n *   const response = await fetch(url);\n *   if (!response.ok) throw new Error(`HTTP ${response.status}`);\n *   return response.json();\n * });\n *\n * if (err) {\n *   console.error('Failed:', err.message);\n *   return { error: err.message };\n * }\n * return { data };\n * ```\n */\n\n// -----------------------------------------------------------------------------\n// Result Type\n// -----------------------------------------------------------------------------\n\n/**\n * A discriminated union representing either success or failure.\n *\n * @template T - The success value type\n * @template E - The error type (defaults to Error)\n *\n * @example\n * ```ts\n * function divide(a: number, b: number): Result<number, string> {\n *   if (b === 0) return err('Division by zero');\n *   return ok(a / b);\n * }\n *\n * const result = divide(10, 2);\n * if (isOk(result)) {\n *   console.log('Result:', result.value); // 5\n * } else {\n *   console.error('Error:', result.error);\n * }\n * ```\n */\nexport type Result<T, E = Error> = { ok: true; value: T } | { ok: false; error: E };\n\n// -----------------------------------------------------------------------------\n// Constructors\n// -----------------------------------------------------------------------------\n\n/**\n * Creates a success Result.\n *\n * @param value - The success value\n * @returns A success Result containing the value\n *\n * @example\n * ```ts\n * const result = ok(42);\n * // { ok: true, value: 42 }\n * ```\n */\nexport function ok<T>(value: T): Result<T, never> {\n  return { ok: true, value };\n}\n\n/**\n * Creates a failure Result.\n *\n * @param error - The error value\n * @returns A failure Result containing the error\n *\n * @example\n * ```ts\n * const result = err(new Error('Something went wrong'));\n * // { ok: false, error: Error('Something went wrong') }\n * ```\n */\nexport function err<E>(error: E): Result<never, E> {\n  return { ok: false, error };\n}\n\n// -----------------------------------------------------------------------------\n// Type Guards\n// -----------------------------------------------------------------------------\n\n/**\n * Type guard to check if a Result is successful.\n *\n * @param result - The Result to check\n * @returns true if the Result is a success\n *\n * @example\n * ```ts\n * const result = fetchData();\n * if (isOk(result)) {\n *   // TypeScript knows result.value exists here\n *   console.log(result.value);\n * }\n * ```\n */\nexport function isOk<T, E>(result: Result<T, E>): result is { ok: true; value: T } {\n  return result.ok === true;\n}\n\n/**\n * Type guard to check if a Result is a failure.\n *\n * @param result - The Result to check\n * @returns true if the Result is a failure\n *\n * @example\n * ```ts\n * const result = fetchData();\n * if (isErr(result)) {\n *   // TypeScript knows result.error exists here\n *   console.error(result.error);\n * }\n * ```\n */\nexport function isErr<T, E>(result: Result<T, E>): result is { ok: false; error: E } {\n  return result.ok === false;\n}\n\n// -----------------------------------------------------------------------------\n// Extractors\n// -----------------------------------------------------------------------------\n\n/**\n * Extracts the value from a Result, throwing if it's an error.\n *\n * @param result - The Result to unwrap\n * @returns The success value\n * @throws The error if Result is a failure\n *\n * @example\n * ```ts\n * const result = ok(42);\n * const value = unwrap(result); // 42\n *\n * const errorResult = err(new Error('fail'));\n * const value2 = unwrap(errorResult); // throws Error('fail')\n * ```\n */\nexport function unwrap<T, E>(result: Result<T, E>): T {\n  if (isOk(result)) {\n    return result.value;\n  }\n  throw result.error;\n}\n\n/**\n * Extracts the value from a Result, returning a default on error.\n *\n * @param result - The Result to unwrap\n * @param defaultValue - The value to return if Result is an error\n * @returns The success value or the default value\n *\n * @example\n * ```ts\n * const result = err(new Error('fail'));\n * const value = unwrapOr(result, 0); // 0\n *\n * const okResult = ok(42);\n * const value2 = unwrapOr(okResult, 0); // 42\n * ```\n */\nexport function unwrapOr<T, E>(result: Result<T, E>, defaultValue: T): T {\n  if (isOk(result)) {\n    return result.value;\n  }\n  return defaultValue;\n}\n\n/**\n * Extracts the value from a Result, computing a default on error.\n *\n * @param result - The Result to unwrap\n * @param fn - Function to compute the default value from the error\n * @returns The success value or the computed default\n *\n * @example\n * ```ts\n * const result = err(new Error('not found'));\n * const value = unwrapOrElse(result, (e) => {\n *   console.error('Error:', e.message);\n *   return [];\n * });\n * ```\n */\nexport function unwrapOrElse<T, E>(result: Result<T, E>, fn: (error: E) => T): T {\n  if (isOk(result)) {\n    return result.value;\n  }\n  return fn(result.error);\n}\n\n// -----------------------------------------------------------------------------\n// Transformers\n// -----------------------------------------------------------------------------\n\n/**\n * Maps a successful Result's value.\n *\n * @param result - The Result to map\n * @param fn - Function to transform the value\n * @returns A new Result with the transformed value, or the original error\n *\n * @example\n * ```ts\n * const result = ok(5);\n * const doubled = map(result, (n) => n * 2); // ok(10)\n *\n * const errorResult = err('fail');\n * const still = map(errorResult, (n) => n * 2); // err('fail')\n * ```\n */\nexport function map<T, U, E>(result: Result<T, E>, fn: (value: T) => U): Result<U, E> {\n  if (isOk(result)) {\n    return ok(fn(result.value));\n  }\n  return result;\n}\n\n/**\n * Maps a failed Result's error.\n *\n * @param result - The Result to map\n * @param fn - Function to transform the error\n * @returns A new Result with the transformed error, or the original value\n *\n * @example\n * ```ts\n * const result = err('not found');\n * const mapped = mapErr(result, (e) => new Error(e)); // err(Error('not found'))\n * ```\n */\nexport function mapErr<T, E, F>(result: Result<T, E>, fn: (error: E) => F): Result<T, F> {\n  if (isErr(result)) {\n    return err(fn(result.error));\n  }\n  return result;\n}\n\n/**\n * Chains Result-returning operations.\n *\n * @param result - The Result to chain from\n * @param fn - Function that returns a new Result\n * @returns The chained Result\n *\n * @example\n * ```ts\n * function parse(input: string): Result<number, string> {\n *   const n = parseInt(input, 10);\n *   return isNaN(n) ? err('not a number') : ok(n);\n * }\n *\n * function double(n: number): Result<number, string> {\n *   return ok(n * 2);\n * }\n *\n * const result = flatMap(parse('5'), double); // ok(10)\n * const fail = flatMap(parse('abc'), double); // err('not a number')\n * ```\n */\nexport function flatMap<T, U, E>(\n  result: Result<T, E>,\n  fn: (value: T) => Result<U, E>\n): Result<U, E> {\n  if (isOk(result)) {\n    return fn(result.value);\n  }\n  return result;\n}\n\n// -----------------------------------------------------------------------------\n// Async Helpers\n// -----------------------------------------------------------------------------\n\n/**\n * Wraps a Promise in a Result type.\n *\n * @param promise - The Promise to wrap\n * @returns A Promise that resolves to a Result\n *\n * @example\n * ```ts\n * const result = await fromPromise(fetch('/api/data'));\n * if (isErr(result)) {\n *   console.error('Fetch failed:', result.error);\n *   return;\n * }\n * const response = result.value;\n * ```\n */\nexport async function fromPromise<T>(promise: Promise<T>): Promise<Result<T, Error>> {\n  try {\n    const value = await promise;\n    return ok(value);\n  } catch (error) {\n    return err(error instanceof Error ? error : new Error(String(error)));\n  }\n}\n\n/**\n * Wraps a throwing function in a Result type.\n *\n * @param fn - The function to wrap\n * @returns A Result containing the return value or the thrown error\n *\n * @example\n * ```ts\n * const result = tryCatch(() => JSON.parse(input));\n * if (isErr(result)) {\n *   console.error('Invalid JSON:', result.error);\n *   return null;\n * }\n * return result.value;\n * ```\n */\nexport function tryCatch<T>(fn: () => T): Result<T, Error> {\n  try {\n    return ok(fn());\n  } catch (error) {\n    return err(error instanceof Error ? error : new Error(String(error)));\n  }\n}\n\n/**\n * Wraps an async function in a Result type.\n *\n * @param fn - The async function to wrap\n * @returns A Promise that resolves to a Result\n *\n * @example\n * ```ts\n * const result = await tryCatchAsync(async () => {\n *   const response = await fetch('/api/data');\n *   if (!response.ok) throw new Error(`HTTP ${response.status}`);\n *   return response.json();\n * });\n * ```\n */\nexport async function tryCatchAsync<T>(fn: () => Promise<T>): Promise<Result<T, Error>> {\n  try {\n    const value = await fn();\n    return ok(value);\n  } catch (error) {\n    return err(error instanceof Error ? error : new Error(String(error)));\n  }\n}\n\n// -----------------------------------------------------------------------------\n// Tuple Helpers (Go-style)\n// -----------------------------------------------------------------------------\n\n/**\n * Go-style tuple for error handling: [error, value]\n *\n * @example\n * ```ts\n * const [err, data] = await handle(fetchData);\n * if (err) {\n *   console.error(err);\n *   return;\n * }\n * console.log(data);\n * ```\n */\nexport type GoTuple<T, E = Error> = [E, undefined] | [undefined, T];\n\n/**\n * Converts a Result to a Go-style tuple.\n *\n * @param result - The Result to convert\n * @returns A tuple of [error, value]\n *\n * @example\n * ```ts\n * const result = await fetchData();\n * const [err, data] = toTuple(result);\n * ```\n */\nexport function toTuple<T, E>(result: Result<T, E>): GoTuple<T, E> {\n  if (isOk(result)) {\n    return [undefined, result.value];\n  }\n  return [result.error, undefined];\n}\n\n/**\n * Wraps an async function and returns a Go-style tuple.\n *\n * @param fn - The async function to wrap\n * @returns A Promise that resolves to [error, value] tuple\n *\n * @example\n * ```ts\n * const [err, data] = await handle(async () => {\n *   const res = await fetch('/api/users');\n *   if (!res.ok) throw new Error(`HTTP ${res.status}`);\n *   return res.json();\n * });\n *\n * if (err) {\n *   console.error('Failed to fetch users:', err.message);\n *   return [];\n * }\n * return data;\n * ```\n */\nexport async function handle<T>(fn: () => Promise<T>): Promise<GoTuple<T, Error>> {\n  try {\n    const value = await fn();\n    return [undefined, value];\n  } catch (error) {\n    const err = error instanceof Error ? error : new Error(String(error));\n    return [err, undefined];\n  }\n}\n\n/**\n * Wraps a synchronous function and returns a Go-style tuple.\n *\n * @param fn - The function to wrap\n * @returns A tuple of [error, value]\n *\n * @example\n * ```ts\n * const [err, parsed] = handleSync(() => JSON.parse(input));\n * if (err) {\n *   console.error('Invalid JSON:', err.message);\n *   return null;\n * }\n * return parsed;\n * ```\n */\nexport function handleSync<T>(fn: () => T): GoTuple<T, Error> {\n  try {\n    const value = fn();\n    return [undefined, value];\n  } catch (error) {\n    const err = error instanceof Error ? error : new Error(String(error));\n    return [err, undefined];\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/lib/renderer.js

@@ -1,10 +1,3 @@
-import {
-  BlockRenderer
-} from "../chunk-6QR5B5KQ.js";
-import {
-  getCmsClient
-} from "../chunk-JHKDRASN.js";
-
 // ../../packages/cms-schema/src/blocks/article.ts
 function normalizeArticleContent(payload) {
   if (!payload || typeof payload !== "object") {
@@ -248,7 +241,326 @@ function isValidBlockSchemaName(name) {
 // lib/renderer.tsx
 import { unstable_noStore } from "next/cache";
 import { notFound } from "next/navigation";
-import { jsx } from "react/jsx-runtime";
+
+// lib/block-renderer.tsx
+import React from "react";
+import { BlockToolbar } from "./block-toolbar.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+function walkReactNode(node, visitors, ctx = {}) {
+  const path = ctx.path ?? [];
+  if (node == null || typeof node === "boolean") return node;
+  if (typeof node === "string" || typeof node === "number") {
+    const value = String(node);
+    return visitors.onText ? visitors.onText({ value, path, parentType: ctx.parentType, key: ctx.key }) : node;
+  }
+  if (Array.isArray(node)) {
+    return node.map((child, i) => {
+      const childKey = child?.key ?? null;
+      const result = walkReactNode(child, visitors, {
+        path: [...path, i],
+        parentType: ctx.parentType,
+        key: childKey
+      });
+      if (React.isValidElement(result) && result.key == null) {
+        return React.cloneElement(result, { key: childKey ?? `arr-${path.join("-")}-${i}` });
+      }
+      return result;
+    });
+  }
+  if (React.isValidElement(node)) {
+    const el = node;
+    const elProps = el.props;
+    const hasChildren = elProps && "children" in elProps;
+    const nextChildren = hasChildren ? React.Children.map(elProps.children, (child, i) => {
+      const childKey = child?.key ?? null;
+      const result = walkReactNode(child, visitors, {
+        path: [...path, "children", i],
+        parentType: el.type,
+        key: childKey
+      });
+      if (React.isValidElement(result) && result.key == null) {
+        return React.cloneElement(result, { key: childKey ?? `child-${path.join("-")}-${i}` });
+      }
+      return result;
+    }) : elProps?.children;
+    const cloned = hasChildren ? React.cloneElement(el, void 0, nextChildren) : el;
+    return visitors.onElement ? visitors.onElement({ element: cloned, path }) : cloned;
+  }
+  return node;
+}
+function extractContentValues(content, basePath = []) {
+  const map = /* @__PURE__ */ new Map();
+  function walk(obj, path) {
+    if (typeof obj === "string" && obj.trim() !== "") {
+      const contentPath = path.join(".");
+      const existing = map.get(obj) || [];
+      existing.push({ contentPath, value: obj });
+      map.set(obj, existing);
+    } else if (Array.isArray(obj)) {
+      for (let index = 0; index < obj.length; index++) {
+        walk(obj[index], [...path, String(index)]);
+      }
+    } else if (obj && typeof obj === "object") {
+      for (const [key, value] of Object.entries(obj)) {
+        walk(value, [...path, key]);
+      }
+    }
+  }
+  walk(content, basePath);
+  return map;
+}
+function renderToWalkableTree(node, keyPrefix = "") {
+  if (node == null || typeof node === "boolean") return node;
+  if (typeof node === "string" || typeof node === "number") return node;
+  if (Array.isArray(node)) {
+    return node.map((child, i) => {
+      const result = renderToWalkableTree(child, `${keyPrefix}${i}-`);
+      if (React.isValidElement(result) && result.key == null) {
+        const existingKey = child?.key;
+        return React.cloneElement(result, { key: existingKey ?? `${keyPrefix}${i}` });
+      }
+      return result;
+    });
+  }
+  if (React.isValidElement(node)) {
+    const el = node;
+    const elProps = el.props;
+    if (typeof el.type === "function") {
+      try {
+        const rendered = el.type(el.props);
+        return renderToWalkableTree(rendered, keyPrefix);
+      } catch {
+        return node;
+      }
+    }
+    if (elProps && "children" in elProps) {
+      const newChildren = renderToWalkableTree(elProps.children, keyPrefix);
+      return React.cloneElement(el, void 0, newChildren);
+    }
+    return node;
+  }
+  return node;
+}
+function BlockRenderer({ block, registry, disableEditable }) {
+  const Component = registry[block.type];
+  if (!Component) {
+    if (process.env.NODE_ENV === "development") {
+      console.warn(`[BlockRenderer] Unknown block type: ${block.type}`);
+    }
+    return null;
+  }
+  const component = /* @__PURE__ */ jsx(Component, { content: block.content });
+  if (disableEditable) {
+    return component;
+  }
+  const renderedTree = renderToWalkableTree(component);
+  const contentValueMap = extractContentValues(block.content);
+  const usedPaths = /* @__PURE__ */ new Set();
+  let isRoot = true;
+  const wrappedComponent = walkReactNode(renderedTree, {
+    onText: ({ value, key, path }) => {
+      const matches = contentValueMap.get(value);
+      if (!matches || matches.length === 0) {
+        return value;
+      }
+      const match = matches.find((m) => !usedPaths.has(m.contentPath)) ?? matches[0];
+      if (!match) return value;
+      usedPaths.add(match.contentPath);
+      const spanKey = key ?? `${block.id}-${match.contentPath}-${path.join("-")}`;
+      return /* @__PURE__ */ jsx(
+        "span",
+        {
+          "data-cms-editable": true,
+          "data-block-id": block.id,
+          "data-block-type": block.type,
+          "data-content-path": match.contentPath,
+          children: value
+        },
+        spanKey
+      );
+    },
+    onElement: ({ element, path }) => {
+      if (isRoot && path.length === 0) {
+        isRoot = false;
+        const elProps = element.props;
+        const existingChildren = elProps?.children;
+        return React.cloneElement(
+          element,
+          {
+            "data-cms-block": true,
+            "data-block-id": block.id,
+            "data-block-type": block.type
+          },
+          existingChildren,
+          /* @__PURE__ */ jsx(BlockToolbar, { blockId: block.id }, "cms-toolbar")
+        );
+      }
+      return element;
+    }
+  });
+  return /* @__PURE__ */ jsxs("div", { style: { display: "contents" }, children: [
+    /* @__PURE__ */ jsx("style", { children: `
+        [data-cms-block] {
+          position: relative;
+        }
+        [data-cms-block]:hover {
+          outline: 2px solid #3b82f6;
+          outline-offset: 4px;
+        }
+        [data-cms-editable] {
+          cursor: pointer;
+          border-radius: 2px;
+        }
+        [data-cms-editable]:hover {
+          outline: 2px solid #3b82f6;
+          outline-offset: 2px;
+        }
+        .cms-block-toolbar {
+          position: absolute;
+          bottom: -16px;
+          left: 50%;
+          transform: translateX(-50%);
+          display: flex;
+          gap: 4px;
+          background: #1f2937;
+          border-radius: 6px;
+          padding: 4px;
+          box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+          opacity: 0;
+          pointer-events: none;
+          transition: opacity 0.15s ease;
+          z-index: 1000;
+        }
+        [data-cms-block]:hover .cms-block-toolbar {
+          opacity: 1;
+          pointer-events: auto;
+        }
+        .cms-block-toolbar button {
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          width: 28px;
+          height: 28px;
+          border: none;
+          background: transparent;
+          color: #9ca3af;
+          border-radius: 4px;
+          cursor: pointer;
+          transition: background 0.15s ease, color 0.15s ease;
+        }
+        .cms-block-toolbar button:hover {
+          background: #374151;
+          color: #fff;
+        }
+        .cms-block-toolbar button.delete:hover {
+          background: #dc2626;
+          color: #fff;
+        }
+        .cms-block-toolbar button:disabled {
+          opacity: 0.4;
+          cursor: not-allowed;
+        }
+        .cms-block-toolbar button:disabled:hover {
+          background: transparent;
+          color: #9ca3af;
+        }
+        .cms-block-toolbar svg {
+          width: 16px;
+          height: 16px;
+        }
+      ` }),
+    /* @__PURE__ */ jsx(
+      "script",
+      {
+        dangerouslySetInnerHTML: {
+          __html: `
+            (function() {
+              if (window.__cmsEditableInitialized) return;
+              window.__cmsEditableInitialized = true;
+
+              document.addEventListener('click', function(e) {
+                // Ignore toolbar clicks
+                if (e.target.closest('.cms-block-toolbar')) {
+                  return;
+                }
+
+                // Check for editable text click first (more specific)
+                var editableTarget = e.target.closest('[data-cms-editable]');
+                if (editableTarget) {
+                  var message = {
+                    type: 'cms-editable-click',
+                    blockId: editableTarget.getAttribute('data-block-id'),
+                    blockType: editableTarget.getAttribute('data-block-type'),
+                    contentPath: editableTarget.getAttribute('data-content-path')
+                  };
+
+                  if (window.parent && window.parent !== window) {
+                    window.parent.postMessage(message, '*');
+                  }
+                  return;
+                }
+
+                // Check for block-level click
+                var blockTarget = e.target.closest('[data-cms-block]');
+                if (blockTarget) {
+                  var message = {
+                    type: 'cms-editable-click',
+                    blockId: blockTarget.getAttribute('data-block-id'),
+                    blockType: blockTarget.getAttribute('data-block-type'),
+                    contentPath: null
+                  };
+
+                  if (window.parent && window.parent !== window) {
+                    window.parent.postMessage(message, '*');
+                  }
+                }
+              });
+            })();
+          `
+        }
+      }
+    ),
+    wrappedComponent
+  ] }, block.id);
+}
+
+// lib/cms-api.ts
+import { createTRPCClient, httpBatchLink } from "@trpc/client";
+import superjson from "superjson";
+function getCmsApiUrl(cmsUrl) {
+  return `${cmsUrl}/api/trpc`;
+}
+function createFetchWithApiKey(apiKey) {
+  return async (url, options) => {
+    let finalUrl = url;
+    if (apiKey) {
+      const urlObj = new URL(url.toString());
+      urlObj.searchParams.set("api_key", apiKey);
+      finalUrl = urlObj.toString();
+    }
+    const response = await fetch(finalUrl, options);
+    return response;
+  };
+}
+function createCmsClient(options) {
+  const url = getCmsApiUrl(options.cmsUrl);
+  console.log("[CMS API] Creating client with URL:", url);
+  return createTRPCClient({
+    links: [
+      httpBatchLink({
+        url,
+        transformer: superjson,
+        fetch: createFetchWithApiKey(options.apiKey)
+      })
+    ]
+  });
+}
+function getCmsClient(options) {
+  return createCmsClient(options);
+}
+
+// lib/renderer.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
 function getWebsiteId(providedWebsiteId) {
   const websiteId = providedWebsiteId ?? process.env.NEXT_PUBLIC_WEBSITE_ID ?? process.env.WEBSITE_ID ?? process.env.CMS_WEBSITE_ID;
   if (!websiteId) {
@@ -347,7 +659,7 @@ async function ParametricRoutePage({
         content
       });
     }
-    return /* @__PURE__ */ jsx("main", { children: blocks.map((block) => /* @__PURE__ */ jsx(
+    return /* @__PURE__ */ jsx2("main", { children: blocks.map((block) => /* @__PURE__ */ jsx2(
       BlockRenderer,
       {
         block,