"use client";

import katex from "katex";

interface MathDisplayProps {
  math: string;
  className?: string;
}

export function MathDisplay({ math, className }: MathDisplayProps) {
  const html = katex.renderToString(math, {
    displayMode: true,
    throwOnError: false,
  });

  return (
    <div
      className={className}
      dangerouslySetInnerHTML={{ __html: html }}
    />
  );
}

export function MathInline({ math, className }: MathDisplayProps) {
  const html = katex.renderToString(math, {
    displayMode: false,
    throwOnError: false,
  });

  return (
    <span
      className={className}
      dangerouslySetInnerHTML={{ __html: html }}
    />
  );
}