Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Multi-line comments don't render #22

Open
kipprice opened this issue Jan 31, 2020 · 0 comments
Open

Multi-line comments don't render #22

kipprice opened this issue Jan 31, 2020 · 0 comments

Comments

@kipprice
Copy link

kipprice commented Jan 31, 2020

Multiline comments seem to have some visual oddities:

  • When rendering standard multiline comments (/* ... */), any line that does not have a start or end comment marker (/* or */) gets rendered as standard text.
  • When rendering documentation headers(/** ... **/), every line except the first renders correctly as a comment

These issues are reproducible through the snack demo via the following code:

import React from 'react';
import { Text, View } from 'react-native';
import SyntaxHighlighter from 'react-native-syntax-highlighter'; // 2.0.0
import { tomorrow } from 'react-syntax-highlighter/styles/prism' // 7.0.1

const code = `
/* this is the header
   of this very complicated
   function

   it is very important
   that we keep track 
   of all of this context */
function veryImportant() {
  doSomething();
}

/**
 * @description This does something
 * @params [optionalParam] 
 * @returns A value
 **/
 function doSomething(optionalParam) {
   console.log("wowza")
 }
`;

export default class App extends React.Component {
  constructor() {
    super();
    this.state = { code };
  }
  render() {
    return (
      <View style={{ backgroundColor: '#E87A90', height: '100%'}}>
        <Text style={{ marginTop: 30, marginBottom: 30, textAlign: 'center', fontSize: 22, fontWeight: '900' }}>React Native Syntax Higlighter</Text>
        <SyntaxHighlighter
          {...this.props}
          style={tomorrow}
          customStyle={{padding: 0, margin: 0 }}
          language='javascript'
          fontSize={18}
          highlighter="prism"
        >
          {this.state.code}
        </SyntaxHighlighter>
      </View>
    );
  }
}

image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant