All files DOMMarkdown.js

90.91% Statements 20/22
50% Branches 1/2
94.12% Functions 16/17
95.24% Lines 20/21
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98      1x   1x   9x           1x       1x       1x     1x   1x       10x       1x       3x       1x                 1x                 1x 1x             1x         1x   13x           13x     13x                          
import React, {Component} from 'react';
import Markdown from './Markdown';
 
const LineBreak = () => <br />;
 
export const DOMComponents = {
  Text: ({children}) =>
    <span>
      {children}
    </span>,
  LineBreak,
  SoftBreak: LineBreak,
  Em: ({children}) =>
    <em>
      {children}
    </em>,
  Strong: ({children}) =>
    <strong>
      {children}
    </strong>,
  Link: ({title, destination, children}) =>
    <a title={title} href={destination}>
      {children}
    </a>,
  Image: ({title, destination}) => <img src={destination} title={title} />,
  Code: ({children}) =>
    <code>
      {children}
    </code>,
  Paragraph: ({children}) =>
    <p>
      {children}
    </p>,
  BlockQuote: ({children}) =>
    <blockquote>
      {children}
    </blockquote>,
  Item: ({children}) =>
    <li>
      {children}
    </li>,
  List: ({children, listType, listStart}) => {
    switch (listType) {
      case 'ordered': {
        return (
          <ol start={listStart}>
            {children}
          </ol>
        );
      }
      default: {
        return (
          <ul>
            {children}
          </ul>
        );
      }
    }
  },
  Heading: ({children, level}) => {
    const Heading = 'h' + level;
    return (
      <Heading>
        {children}
      </Heading>
    );
  },
  CodeBlock: ({children, info}) =>
    <pre>
      <code>
        {children}
      </code>
    </pre>,
  ThematicBreak: () => <hr />,
  Document: ({className, children}) =>
    <div className={className}>
      {children}
    </div>,
};
 
class DOMMarkdown extends Component {
  Document = props => <DOMComponents.Document {...props} className={this.props.className} />;
 
  render() {
    return (
      <Markdown
        {...this.props}
        components={{
          ...DOMComponents,
          Document: this.Document,
        }}
      />
    );
  }
}
 
export default DOMMarkdown;