Mkimp React

MkImp lets you write Markdown like a programmer should be able to — with power, precision, and extensibility.

⚠️ Note: This is not standard Markdown. MkImp defines its own rules and does not support arbitrary extensions out of the box.

This is the React implementation of MkImp.

You can sanitize the result yourself, the library won't do it for you.

🔧 Usage

import { MkImp } from 'mkimp_react';

export default function MkImpExample() {
    return (<MkImp mdContent="# Hello\n\nThis *is* some __nice__ markdown!" />);
}

⚙️ Options

interface MkImpProps extends MkImpOptions {
  mdContent: string;
  sanitization?: ((html: string) => string) | undefined;
}
// The default MkImp renderer.
// The sanitization will be applied once everything is rendered if you want to add it.
function MkImp(props: MkImpProps): JSX.Element;

interface MkImpRawProps {
  emojis?: Record<string, EmojiRecord>;
  frontMatter?: (content: string) => Promise<MetaData>;
  include?: (
    location: string,
    from: number | undefined,
    to: number | undefined
  ) => Promise<string | undefined>;
  includeCode?: (
    location: string,
    from: number | undefined,
    to: number | undefined
  ) => Promise<string | undefined>;
  mdContent: string;
  metadata?: MetaData;
  overrideArticle?: (props: ArticleProps) => JSX.Element;
  convertLaTeXToHTML?: (content: string, displayMode: boolean) => string;
  highlightText?: (content: string, language: string | undefined) => string;
  overrideRenderer?: Partial<TokenRendering>;
  overrideSection?: (props: SectionProps) => JSX.Element;
  renderTarget?: RenderTarget;
  sanitization?: ((html: string) => string) | undefined;
  tabulation?: number;
  withSection?: boolean;
}
// This renderer disabled all HTML tokens and render a full react tree from markdown.
// Sanitization is still be applied in your highligter renderer and latex renderer so take it into consideration when implementing your sanitization.
function MkImpRaw(props: MkImpRawProps): JSX.Element;

📦 License

MIT