import { MDXRemote } from "remote-mdx/rsc";

const components = {
  h1: (props: any) => <h1 className="text-2xl font-semibold pb-2" {...props} />,
  h2: (props: any) => <h1 className="text-xl font-semibold pb-2 pt-4" {...props} />,
};

export function CustomMDX(props: any) {
  return <MDXRemote {...props} components={{ ...components, ...(props.components || {}) }} />;
}