Skip to content

🖋 Turns Markdown-like strings into beautiful JSX

License

Notifications You must be signed in to change notification settings

huskiesio/message-renderer

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

16 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Turns Markdown-like strings into beautiful JSX

Turns

https://s3.amazonaws.com/keybase_processed_uploads/d24c7479498157f2cb81e185977dfd05_360_360.jpeg

into

<div>
  <div className="markdown">
    <p>
      <a href="https://s3.amazonaws.com/keybase_processed_uploads/d24c7479498157f2cb81e185977dfd05_360_360.jpeg">https://s3.amazonaws.com/keybase_processed_uploads/d24c7479498157f2cb81e185977dfd05_360_360.jpeg</a>
    </p>
  </div>
  <div class="previews">
    <img src="https://s3.amazonaws.com/keybase_processed_uploads/d24c7479498157f2cb81e185977dfd05_360_360.jpeg">
  </div>
</div>

Usage

import MessageRenderer from '@huskiesio/message-renderer';

const SampleMessage = <MessageRenderer text="**Bolded text**"/>;

You need to include a couple stylesheets as well:

  • https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.5.1/katex.min.css for the KaTeX math renderer
  • https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.18.1/styles/default.min.css for the code highlighting

About

🖋 Turns Markdown-like strings into beautiful JSX

Resources

License

Stars

Watchers

Forks

Packages

No packages published