markdown-to-jsx
- Version 9.1.1
- Published
- 3.18 MB
- No dependencies
- MIT license
Install
npm i markdown-to-jsxyarn add markdown-to-jsxpnpm add markdown-to-jsxOverview
A very fast and versatile markdown toolchain. AST, React, and HTML output available with full customization.
Index
Variables
Functions
Type Aliases
Namespaces
MarkdownToJSX
- ASTNode
- ASTRender
- BlockQuoteNode
- BreakLineNode
- BreakThematicNode
- CodeBlockNode
- CodeInlineNode
- CreateElement
- FootnoteNode
- FootnoteReferenceNode
- FormattedTextNode
- FrontmatterNode
- GFMTaskNode
- HeadingNode
- HTMLCommentNode
- HTMLNode
- HTMLSelfClosingNode
- HTMLTags
- ImageNode
- LinkNode
- Options
- OrderedListNode
- Override
- Overrides
- ParagraphNode
- ReferenceCollectionNode
- ReferenceNode
- RequireAtLeastOne
- State
- TableNode
- TextNode
- UnorderedListNode
Variables
variable Markdown
const Markdown: React2.FC< Omit<React2.HTMLAttributes<Element>, 'children'> & { children?: string | null; options?: MarkdownToJSX.Options; }>;A simple HOC for easy React use. Feed the markdown content as a direct child and the rest is taken care of automatically.
variable RuleType
const RuleType: { readonly blockQuote: 0; readonly breakLine: 1; readonly breakThematic: 2; readonly codeBlock: 3; readonly codeInline: 4; readonly footnote: 5; readonly footnoteReference: 6; readonly frontmatter: 7; readonly gfmTask: 8; readonly heading: 9; readonly htmlBlock: 10; readonly htmlComment: 11; readonly htmlSelfClosing: 12; readonly image: 13; readonly link: 14; readonly orderedList: 15; readonly paragraph: 16; readonly ref: 17; readonly refCollection: 18; readonly table: 19; readonly text: 20; readonly textFormatted: 21; readonly unorderedList: 22;};variable RuleTypeConst
const RuleTypeConst: { readonly blockQuote: 0; readonly breakLine: 1; readonly breakThematic: 2; readonly codeBlock: 3; readonly codeInline: 4; readonly footnote: 5; readonly footnoteReference: 6; readonly frontmatter: 7; readonly gfmTask: 8; readonly heading: 9; readonly htmlBlock: 10; readonly htmlComment: 11; readonly htmlSelfClosing: 12; readonly image: 13; readonly link: 14; readonly orderedList: 15; readonly paragraph: 16; readonly ref: 17; readonly refCollection: 18; readonly table: 19; readonly text: 20; readonly textFormatted: 21; readonly unorderedList: 22;};Analogous to
node.type. Please note that the values here may change at any time, so do not hard code against the value directly.
Functions
function compiler
compiler: ( markdown?: string, options?: MarkdownToJSX.Options) => React2.ReactNode;function parser
parser: ( source: string, options?: MarkdownToJSX.Options) => MarkdownToJSX.ASTNode[];Given a markdown string, return an abstract syntax tree (AST) of the markdown.
The first node in the AST is a reference collection node. This node contains all the reference definitions found in the markdown. These reference definitions are used to resolve reference links and images in the markdown.
Parameter source
The markdown string to parse.
Parameter options
The options for the parser.
Returns
The AST of the markdown.
function sanitizer
sanitizer: (input: string) => string | null;function slugify
slugify: (str: string) => string;Type Aliases
type RuleType
type RuleType2 = RuleTypeValue;Namespaces
namespace global
namespace global {}variable parseMetrics
var parseMetrics: { blockParsers: { [key: string]: { attempts: number; hits: number; hitTimings: number[] }; }; inlineParsers: { [key: string]: { attempts: number; hits: number; hitTimings: number[] }; }; totalOperations: number; blockParseIterations: number; inlineParseIterations: number;};variable parseMetricsStartTimes
var parseMetricsStartTimes: Map<string, number>;namespace MarkdownToJSX
namespace MarkdownToJSX {}markdown-to-jsx types and interfaces
interface BlockQuoteNode
interface BlockQuoteNode {}interface BreakLineNode
interface BreakLineNode {}property type
type: typeof RuleType2.breakLine;interface BreakThematicNode
interface BreakThematicNode {}property type
type: typeof RuleType2.breakThematic;interface CodeBlockNode
interface CodeBlockNode {}interface CodeInlineNode
interface CodeInlineNode {}interface FootnoteNode
interface FootnoteNode {}property type
type: typeof RuleType2.footnote;interface FootnoteReferenceNode
interface FootnoteReferenceNode {}interface FormattedTextNode
interface FormattedTextNode {}interface FrontmatterNode
interface FrontmatterNode {}interface GFMTaskNode
interface GFMTaskNode {}interface HeadingNode
interface HeadingNode {}interface HTMLCommentNode
interface HTMLCommentNode {}interface HTMLNode
interface HTMLNode {}interface HTMLSelfClosingNode
interface HTMLSelfClosingNode {}property attrs
attrs?: Record<string, any>;property isClosingTag
isClosingTag?: boolean;property tag
tag: string;property type
type: typeof RuleType2.htmlSelfClosing;interface ImageNode
interface ImageNode {}interface LinkNode
interface LinkNode {}interface OrderedListNode
interface OrderedListNode {}interface ParagraphNode
interface ParagraphNode {}interface ReferenceCollectionNode
interface ReferenceCollectionNode {}interface ReferenceNode
interface ReferenceNode {}property type
type: typeof RuleType2.ref;interface TableNode
interface TableNode {}interface TextNode
interface TextNode {}interface UnorderedListNode
interface UnorderedListNode {}type ASTNode
type ASTNode = | BlockQuoteNode | BreakLineNode | BreakThematicNode | CodeBlockNode | CodeInlineNode | FootnoteNode | FootnoteReferenceNode | FrontmatterNode | GFMTaskNode | HeadingNode | HTMLCommentNode | ImageNode | LinkNode | OrderedListNode | UnorderedListNode | ParagraphNode | ReferenceNode | ReferenceCollectionNode | TableNode | TextNode | FormattedTextNode | HTMLNode | HTMLSelfClosingNode;type ASTRender
type ASTRender = ( ast: MarkdownToJSX.ASTNode | MarkdownToJSX.ASTNode[], state: MarkdownToJSX.State) => React.ReactNode;type CreateElement
type CreateElement = typeof React.createElement;type HTMLTags
type HTMLTags = keyof React.JSX.IntrinsicElements & (string & {});type Options
type Options = Partial<{ /** * Ultimate control over the output of all rendered JSX. */ createElement: ( tag: Parameters<CreateElement>[0], props: React.JSX.IntrinsicAttributes, ...children: React.ReactNode[] ) => React.ReactNode; /** * The library automatically generates an anchor tag for bare URLs included in the markdown * document, but this behavior can be disabled if desired. */ disableAutoLink: boolean; /** * Disable the compiler's best-effort transcription of provided raw HTML * into JSX-equivalent. This is the functionality that prevents the need to * use `dangerouslySetInnerHTML` in React. */ disableParsingRawHTML: boolean; /** * Enable GFM tagfilter extension to filter potentially dangerous HTML tags. * When enabled, the following tags are escaped: title, textarea, style, xmp, * iframe, noembed, noframes, script, plaintext. * https://github.github.com/gfm/#disallowed-raw-html-extension- * @default true */ tagfilter?: boolean; /** * Forces the compiler to have space between hash sign and the header text which * is explicitly stated in the most of the markdown specs. * https://github.github.com/gfm/#atx-heading * `The opening sequence of # characters must be followed by a space or by the end of line.` */ enforceAtxHeadings: boolean; /** * Forces the compiler to always output content with a block-level wrapper * (`<p>` or any block-level syntax your markdown already contains.) */ forceBlock: boolean; /** * Forces the compiler to always output content with an inline wrapper (`<span>`) */ forceInline: boolean; /** * Forces the compiler to wrap results, even if there is only a single * child or no children. */ forceWrapper: boolean; /** * Selectively control the output of particular HTML tags as they would be * emitted by the compiler. */ overrides: Overrides; /** * Allows for full control over rendering of particular rules. * For example, to implement a LaTeX renderer such as `react-katex`: * * ``` * renderRule(next, node, renderChildren, state) { * if (node.type === RuleType.codeBlock && node.lang === 'latex') { * return ( * <TeX as="div" key={state.key}> * {String.raw`${node.text}`} * </TeX> * ) * } * * return next(); * } * ``` * * Thar be dragons obviously, but you can do a lot with this * (have fun!) To see how things work internally, check the `render` * method in source for a particular rule. */ renderRule: ( next: () => React.ReactNode, node: ASTNode, renderChildren: ASTRender, state: State ) => React.ReactNode; /** * Override the built-in sanitizer function for URLs, etc if desired. The built-in version is available as a library export called `sanitizer`. */ sanitizer: (value: string, tag: HTMLTags, attribute: string) => string | null; /** * Override normalization of non-URI-safe characters for use in generating * HTML IDs for anchor linking purposes. */ slugify: (input: string, defaultFn: (input: string) => string) => string; /** * Declare the type of the wrapper to be used when there are multiple * children to render. Set to `null` to get an array of children back * without any wrapper, or use `React.Fragment` to get a React element * that won't show up in the DOM. */ wrapper: React.ElementType | null; /** * Props to apply to the wrapper element. */ wrapperProps?: React.JSX.IntrinsicAttributes; /** * Preserve frontmatter in the output by rendering it as a <pre> element. * By default, frontmatter is parsed but not rendered. * @default false */ preserveFrontmatter?: boolean;}>;type Override
type Override = | RequireAtLeastOne<{ component: React.ElementType; props: Object; }> | React.ElementType;type Overrides
type Overrides = { [tag in HTMLTags]?: Override } & { [customComponent: string]: Override;};type RequireAtLeastOne
type RequireAtLeastOne<T, Keys extends keyof T = keyof T> = Pick< T, Exclude<keyof T, Keys>> & { [K in Keys]-?: Required<Pick<T, K>> & Partial<Pick<T, Exclude<Keys, K>>>; }[Keys];RequireAtLeastOne<{ ... }> <- only requires at least one key
type State
type State = { /** true if the current content is inside anchor link grammar */ inAnchor?: boolean; /** true if inside a blockquote */ inBlockQuote?: boolean; /** true if parsing in an HTML context */ inHTML?: boolean; /** true if in a list */ inList?: boolean; /** true if parsing in an inline context (subset of rules around formatting and links) */ inline?: boolean; /** use this for the `key` prop */ key?: React.Key; /** reference definitions (footnotes are stored with '^' prefix) */ refs?: { [key: string]: { target: string; title: string | undefined; }; }; /** current recursion depth during rendering */ renderDepth?: number;};Package Files (1)
Dependencies (0)
No dependencies.
Dev Dependencies (50)
- @babel/plugin-proposal-nullish-coalescing-operator
- @babel/plugin-proposal-object-rest-spread
- @babel/plugin-proposal-optional-chaining
- @babel/plugin-transform-typescript
- @changesets/cli
- @matejmazur/react-katex
- @tailwindcss/typography
- @tailwindcss/vite
- @types/benchmark
- @types/bun
- @types/node
- @types/react
- @types/react-dom
- @vitejs/plugin-react
- acorn
- acorn-typescript
- benchtable
- bunup
- cli-progress
- in-publish
- markdown-it
- markdown-to-jsx-latest
- marked
- microbundle
- microtime
- mkdirp
- preact
- prettier
- react
- react-dom
- react-markdown
- recast
- rehype-raw
- rehype-react
- remark
- remark-directive
- remark-gfm
- remark-parse
- remark-rehype
- rimraf
- simple-markdown
- source-map
- styled-components
- tailwindcss
- theredoc
- three
- twgl
- typescript
- vite
- yaml-js
Peer Dependencies (1)
Badge
To add a badge like this oneto your package's README, use the codes available below.
You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/markdown-to-jsx.
- Markdown[](https://www.jsdocs.io/package/markdown-to-jsx)
- HTML<a href="https://www.jsdocs.io/package/markdown-to-jsx"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>
- Updated .
Package analyzed in 4297 ms. - Missing or incorrect documentation? Open an issue for this package.
