@vertigis/react-ui 21.8.0 → 21.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import type { FC } from "react";
|
|
2
|
+
import type { BoxProps } from "../Box/index.js";
|
|
3
|
+
/**
|
|
4
|
+
* Properties for the `Markdown` component.
|
|
5
|
+
*/
|
|
6
|
+
export interface MarkdownProps extends BoxProps {
|
|
7
|
+
/**
|
|
8
|
+
* The markdown text to render.
|
|
9
|
+
*/
|
|
10
|
+
markdown: string;
|
|
11
|
+
/**
|
|
12
|
+
* Override the default sanitization behaviour with a caller-supplied
|
|
13
|
+
* sanitization function that ensures that the resulting HTML is safe to
|
|
14
|
+
* insert into the DOM.
|
|
15
|
+
*/
|
|
16
|
+
sanitize?: (unsafeHtml: string) => string;
|
|
17
|
+
/**
|
|
18
|
+
* If specified, produces HTML that is valid for contexts where only inline
|
|
19
|
+
* content is allowed (e.g. inside `<h1>` or `<span>` tags). HTML tags for
|
|
20
|
+
* block-level elements will be removed, but any text content will be
|
|
21
|
+
* preserved.
|
|
22
|
+
*/
|
|
23
|
+
inline?: boolean;
|
|
24
|
+
/**
|
|
25
|
+
* If true, any HTML in the markdown will be escaped rather than passed
|
|
26
|
+
* through directly to the output as normal (since Markdown is a superset of
|
|
27
|
+
* HTML). This is useful in situations where you wish to only support pure
|
|
28
|
+
* Markdown syntax without also supporting HTML syntax. The default is
|
|
29
|
+
* `false`.
|
|
30
|
+
*
|
|
31
|
+
* IMPORTANT: The resulting HTML still needs to be sanitized whether or not
|
|
32
|
+
* this option is set.
|
|
33
|
+
*/
|
|
34
|
+
escapeHtml?: boolean;
|
|
35
|
+
/**
|
|
36
|
+
* An optional value to apply to external hyperlinks via the `target`
|
|
37
|
+
* attribute.
|
|
38
|
+
*
|
|
39
|
+
* If this is omitted, links may still open in a separate target if the host
|
|
40
|
+
* page specifies a `target` via the `<base>` element in its `<head>`.
|
|
41
|
+
*/
|
|
42
|
+
linkTarget?: string;
|
|
43
|
+
}
|
|
44
|
+
/**
|
|
45
|
+
* A component that renders markdown as HTML.
|
|
46
|
+
*/
|
|
47
|
+
declare const Markdown: FC<MarkdownProps>;
|
|
48
|
+
export default Markdown;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import clsx from "clsx";
|
|
3
|
+
import Box from "../Box/index.js";
|
|
4
|
+
import { sanitizeHtml } from "../utils/html.js";
|
|
5
|
+
import { markdownToHtml } from "../utils/markdown.js";
|
|
6
|
+
/**
|
|
7
|
+
* A component that renders markdown as HTML.
|
|
8
|
+
*/
|
|
9
|
+
const Markdown = ({ markdown, inline, escapeHtml, sanitize = sanitizeHtml, linkTarget, className, ...otherProps }) => (_jsx(Box, { component: inline ? "span" : "div", className: clsx("GcxMarkdown", className), dangerouslySetInnerHTML: {
|
|
10
|
+
__html: sanitize(markdownToHtml(markdown, { inline, escapeHtml, linkTarget })),
|
|
11
|
+
}, ...otherProps }));
|
|
12
|
+
export default Markdown;
|