Types
render()
async function render(
input: string,
codeTheme: BundledTheme = "github-dark",
): Promise<string>;
This function will return the rendered HTML string for the input passed into the constructor. Syntax highlighting using Shiki, LaTeX rendering using KaTeX and heading IDs are all included in the rendered HTML.
input
: The input text to be converted to HTML. This can be from a Markdown file as long as the syntax is supported by Znak. See the syntax documentation for the supported syntax.
codeTheme
: The theme for code blocks. This is optional, and set to "github-dark" by default, but can be set to any of the syntax highlighting themes included in Shiki.
import { render } from "@noclaps/znak";
const text = "# Hello World"; // Your text to be rendered.
const renderedHTML: string = await render(text);
// <h1 id="hello-world">Hello World</h1>
headings()
function headings(input: string): Heading[];
This method will return the list of headings used in the given input text, along with the depth and heading slug. The heading slug is generated using github-slugger, and matches the slugs automatically generated by GitHub.
You can use this heading list to generate a table of contents, for example.
input
: The input text to extract the headings from. This can be from a Markdown file as long as the syntax is supported by Znak. See the syntax documentation for the supported syntax.
import { headings } from "@noclaps/znak";
const text = "# Hello World"; // Your text to be rendered.
const headings: Heading[] = headings(text);
// [{depth: 1, slug: "hello-world", title: "Hello World"}]
Heading
The Heading
type was taken from Astro's MarkdownHeading
type.
type Heading = {
depth: number;
slug: string;
title: string;
};