juiceo/react-native-easy-markdown

Simple & customizable React Native component to render Github-flavoured markdown using minimal native components.

react-native-easy-markdown's Issues

does not work with 'create-react-native-app' v0.0.6 / expo

Hi!

Thanks for the package! I've been trying to use it with no success.
I used the example from the readme in a brand new React Native project created from create-react-native-app CLI.

Any thoughts?

import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import Markdown from 'react-native-easy-markdown';

export default class App extends React.Component {
  render() {
    return (
      <Markdown>
        # Why is markdown cool?

        * because it lets us do simple formatting **easily**
        * _without_ the need for complex CMS data structures
        * and you can outsource ~~your~~ work to the content creators!

        ![We can add images!](http://placehold.it/300x300)
        [Or link to places](http://foobar.com)
      </Markdown>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

Yields Views nested within a <Text> must have a width and height:

Thanks!
DK

exception is thrown when a unsupported node type is in use

#2 and #3 addresses these issues

removed typescript when updating from 1.5 to 2.0

After updating I see that you have removed the index.d.ts file, providing the typescript definitions. Could you add that for next update.

Please publish new version

Current npm version still uses React.PropTypes

I've added HR support

Hey,

I've added HR support. I'm new to pull requests and how that works, how would i do that?

I've done it here: http://github.com/morksinaanab/react-native-easy-markdown

Support for bold links

Support for links inside bold text is not there.

Provided PR #24

Blockquotes broken in 1.2.0

I believe there was a regression introduced in #17 . I cannot render a simple blockquote now with react-native (expo and native build).

> This is a quote

On 1.1.9 it renders correctly. On 1.2.0 it immediately fails with: "Unexpected view type nested under text node."

As I'm also running react-native @ 0.55, I'm currently exploring if it's possible to revert the isTextOnly removal and get both images and quotes working at the same time. It's not possible to have both working in either build.

EDIT: I brought back Util.isTextOnly and the detecting block, and I now have images working (but still no blockQuotes)

        if (Utils.isTextOnly(nodes)) {
            if (isBlockQuote) {
                style.push(styles.blockQuote)
                return(
                    <View key={'blockQuote_' + key} style={[styles.block, styles.blockQuote]}>
                        <Text>{nodes}</Text>
                    </View>
                );
            } else {
                return(
                    <Text key={'block_' + key} style={styles.block}>
                        <Text style={styles.text}>
                            <Text style={styles.text}>
                                {nodes}
                            </Text>
                        </Text>
                    </Text>
                );
            }
        } else {
            return (
                <View key={'block_' + key} style={styles.block}>
                    {nodes}
                </View>
            );
        }

Nested unordered lists are not rendered correctly

I saw a problem with the rendering of nested unordered lists:

1. Unordered list without nesting - rendered correctly:
   <Markdown> {"* Bullet 1\n* Bullet 2"} </Markdown>

2. Unordered list with nesting - not correct:
   <Markdown> {"* Parent Bullet\n * Nested Bullet"} </Markdown>

Thank you!

Android crashes with Image and React Native 0.55.3

Essentially embedding any image in the markdown causes the following error on Android:

Unexpected view type nested under text node

This stems from the fact that View components are nested within Text components, which is no longer supported on Android.

Text elements wrapping unexpectedly

Is there a reason on line 215 of index.js the nodes are not wrapped in a Text?

<Text>{nodes}</Text>

Without this, every time a new styled text element is encountered a line break will occur. This is not the desired behavior.

The desired behavior should be: Styled elements such as bold and italic should not line break unless the new line character is encountered.

Support for Images in Links

@zivester Since your fork has issues disabled, I'll try to ping you this way.

What a great component. Thank you both for your hard work! I'm circumventing the hassle with embedding local html files by using it.

Now what works out of the box:

Images
![alt text](https://github.com/adam-p/markdown-here/raw/master/src/common/images/icon48.png "Logo Title Text 1")

Links
[I'm an inline-style link](https://www.google.com)

But what about adding support for images inside of links?

[![alt text](https://github.com/adam-p/markdown-here/raw/master/src/common/images/icon48.png "Logo Title Text 1")](http://google.com/)

What do you think?

crash on android release build app

<Markdown>
     {'![test](https://homepages.cae.wisc.edu/~ece533/images/arctichare.png)'}
</Markdown>

above simple code causes "Cannot Add a child that doesn't have a YogaNode to a parent with out a measure function!" error on android release apk.

It works perfect on debug mode.

react-native version: 0.51.0
react-native-easy-markdown: 1.1.9

In react-native 0.57.7 links in the text throw exception

It comes from top-level renderApplication as an Invariant violation error (Nesting of <View> within <Text> is not currently supported). It is because links are wrapped in TouchableOpacity in react-native-easy-markdown, and in react-native 0.57.7 the TouchableOpacity contains a View (and animated one).

As a workaround it's possible to use a renderLink function with a TouchableWithoutFeedback, but that lacks the visual feedback that TouchableOpacity have, so it can be considered as a regression.

Text overflows right margin when links are added.

When I add a link to wrapped text, the text overflows the margin and is cut off. Note that the bullet and text are also no longer aligned, which is not as severe an issue. Maybe related - I also had to add a maxWidth style to the containing View in order to keep small amounts of listItem text from being cut off, regardness of whether or not a link was included.

E.g., the following markDown source results in the screenshot (using the Genymotion emulator on Windows 10).

"+ [**Body scan**](http://www.healthforthewholeself.com/2010/11/my-favorite-relaxation-technique-the-body-scan-meditation/) – toes to head, noticing sensations.",

Support for subscript and superscript

Hi,

Thanks for the great work. I have an issue in making subscript and superscript work with this lib. When i pass :

<sub>he<sup>l</sup>lo</sub>

It does not work. are they supported?