Skip to content

[Components] Basics

picasso edited this page Sep 29, 2021 · 2 revisions

simpleMarkdown

simpleMarkdown(string, params) - function that converts a string to a set of React components based on simple Markdown constructs.

Available parameters (params) and their default values:

    {
        links: null,
        br: false,
        externalLink: true,
        raw: false,
        json: false,
    }
  • replaces *text* with <em>text</em>
  • replaces **text** with <strong>text</strong>
  • replaces `text` with <span>text</span>
  • replaces [text](link) with <a href="link">text</a>
  • when externalLink is true then adds "components-external-link" class to the <a> markup
  • replaces newlines(\n) with <p> or with <br/> (if br key is true)
  • when json is true then \\n considered a newline
  • also replaces $link{index} constructs with elements from the links array
  • if links is string then it will be converted to [links]

if raw is true then returns string with HTML markup without converting it to React components.

// convert 'help' to simple markdown, replace '\n' with <br/>
simpleMarkdown(help, { br: true });

// convert 'info' to simple markdown,
// replace `$link1` with 'https://www.apple.com' and `$link2` with 'https://www.amazon.com'
let links = ['https://www.apple.com', 'https://www.amazon.com'];
simpleMarkdown(info, { links });

// convert 'message' (that was JSON string) to simple markdown, replace '\\n' with <br/>
simpleMarkdown(message, { br: true, json: true })

Tables

❗ Description required