import React from 'react'; import PropTypes from 'prop-types'; import { Options } from 'react-markdown'; import { MarkdownAnchorHeading, MarkdownBlockquote, MarkdownCodeBlock, MarkdownCode, MarkdownHeading, MarkdownImage, MarkdownItem, MarkdownLink, MarkdownList, MarkdownParagraph } from './renderers'; import { ComponentProps } from '../utils/types'; /** @public */ type RemarkReturn = React.ReactElement | null; /** @public */ type AnchorHeadingRenderer = (props: { children: React.ReactNode[]; level: number; }) => RemarkReturn; /** @public */ type BlockquoteRenderer = (props: { children: React.ReactNode[]; }) => RemarkReturn; /** @public */ type CodeRenderer = (props: { children: React.ReactNode[]; }) => RemarkReturn; /** @public */ type CodeBlockRenderer = (props: { language?: string; children: React.ReactNode[]; }) => RemarkReturn; /** @public */ type HeadingRenderer = (props: { children: React.ReactNode[]; level: number; }) => RemarkReturn; /** @public */ type ImageRenderer = (props: { alt?: string; src?: string; title?: string; }) => RemarkReturn; /** @public */ type ItemRenderer = (props: { children: React.ReactNode[]; }) => RemarkReturn; /** @public */ type LinkRenderer = (props: { children: React.ReactNode[]; href?: string; title?: string; }) => RemarkReturn; /** @public */ type ListRenderer = (props: { children: React.ReactNode[]; depth: number; ordered: boolean; }) => RemarkReturn; /** @public */ type ParagraphRenderer = (props: { children: React.ReactNode[]; }) => RemarkReturn; type WrapperRenderer = (props: { children?: React.ReactNode; elementRef?: React.Ref; }) => JSX.Element; interface MarkdownPropsBase { /** * A custom blockquote renderer. The function is passed an object containing `children`. */ blockquoteRenderer?: BlockquoteRenderer; /** * A custom code literal renderer. The function is passed an object containing `children`. */ codeRenderer?: CodeRenderer; /** * A custom code block renderer. The function is passed an object containing `language`, * and `children`. It supports the same languages as the `Code` component. */ codeBlockRenderer?: CodeBlockRenderer; /** * A React ref which is set to the DOM element when the component mounts and null when it unmounts. */ elementRef?: React.Ref; /** * A custom heading renderer. The function is passed an object containing `level` from 1 to * 6 and `children`. */ headingRenderer?: HeadingRenderer | AnchorHeadingRenderer; /** * A custom image renderer. The function is passed an object containing `src`, `title`, * and `alt`. */ imageRenderer?: ImageRenderer; /** * A custom link renderer. This is useful for single-page apps that need to handle links * internally. The function is passed an object containing `href`, `title`, and `children`. */ linkRenderer?: LinkRenderer; /** * A custom list renderer. The function is passed an object containing `ordered`, `depth`, and `children`. */ listRenderer?: ListRenderer; /** * A custom list item renderer. The function is passed an object containing `children`. */ itemRenderer?: ItemRenderer; /** * A custom paragraph renderer. The function is passed an object containing `children`. */ paragraphRenderer?: ParagraphRenderer; /** The content to be parsed and rendered. */ text: string; /** * @private * Object of type ReactMarkdown.Options that can be used to override the props for ReactMarkdown. * * Note that the `ReactMarkdown.Options` `children` type is omitted in `renderOptions` since that * prop is superseded by `Markdown`'s `text` prop. */ rendererOptions?: Omit; /** * @private * Replaces the default Prose wrapper. * Can be set to null to render markdown without a wrapper. */ wrapper?: WrapperRenderer | null; } type MarkdownProps = ComponentProps; /** * The `Markdown` component renders the given Markdown text as a React component. * The component prefers @splunk/react-ui components over plain HTML components. For example * links are rendered as the `@splunk/react-ui/Link` component instead of plain `` tag. */ declare function Markdown({ blockquoteRenderer, codeBlockRenderer, codeRenderer, elementRef, headingRenderer, imageRenderer, itemRenderer, linkRenderer, listRenderer, paragraphRenderer, text, rendererOptions, wrapper, ...otherProps }: MarkdownProps): React.JSX.Element; declare namespace Markdown { var propTypes: { blockquoteRenderer: PropTypes.Requireable<(...args: any[]) => any>; codeBlockRenderer: PropTypes.Requireable<(...args: any[]) => any>; codeRenderer: PropTypes.Requireable<(...args: any[]) => any>; elementRef: PropTypes.Requireable; headingRenderer: PropTypes.Requireable<(...args: any[]) => any>; imageRenderer: PropTypes.Requireable<(...args: any[]) => any>; itemRenderer: PropTypes.Requireable<(...args: any[]) => any>; linkRenderer: PropTypes.Requireable<(...args: any[]) => any>; listRenderer: PropTypes.Requireable<(...args: any[]) => any>; paragraphRenderer: PropTypes.Requireable<(...args: any[]) => any>; text: PropTypes.Validator; rendererOptions: PropTypes.Requireable; /** @private */ wrapper: PropTypes.Requireable<(...args: any[]) => any>; }; } export default Markdown; export { MarkdownAnchorHeading, MarkdownBlockquote, MarkdownCodeBlock, MarkdownCode, MarkdownHeading, MarkdownImage, MarkdownItem, MarkdownLink, MarkdownList, MarkdownParagraph, BlockquoteRenderer, CodeBlockRenderer, CodeRenderer, HeadingRenderer, ImageRenderer, ItemRenderer, LinkRenderer, ListRenderer, ParagraphRenderer, WrapperRenderer, };