5.0.0

This release may cause style issues

While this release shouldn’t outright break compatibility with react-native-markdown-renderer, or people who are using react-native-markdown-display it may cause some style issues. check out the example at the end of these notes.

• Added mergeStyle prop - by default this is false for backwards compatibility but if true, the style prop will merge with pre-defined styles instead of overwriting them
• Stopped applying text styles to Views (#44)
• Changed the unknown element to render nothing instead of some strange error component by default - can still be changed through render rules
• Remove platform enum to make it easier to override styles and render rules
• Remove some unused style definitions
• Added a key to the default topLevelMaxExceededItem value
• Reworked how the root element is rendered so it can be used to apply global styles to text etc.
• Removed some use of styles.text so that styles.text is only used on the text render rule, not elsewhere as some kind of weird text styling thing
• Swap priority of styles when rendering - applies them in order of priority parent (least) to child (most)
• Updated how text styles are applied (and updated the readme) to apply them to non-traditional text style items - see below

Text styles are now applied in a way that makes it much more convenient to manage changes to global styles while also allowing fine tuning of individual elements.

Think of the new implementation like applying styles in CSS. changes to the body effect everything, but can be overwritten further down the style / component tree

The gotcha is if you try to use the text style override to change all text styles, this only changes things that are rendered using the ‘text’ rule. Instead you should change root, and then modify other styles (like code blocks and quotes etc) as needed.

an example:

    const copy = `
    This is some text which is red because of the root style, which is also really small!

    ```
    //This is a code block woooo

    const cool = () => {
      console.log('????');
    };
    ```

    and some more small text

    # This is a h1
    ## this is a h2
    ### this is a h3
    `;

    const App: () => React$Node = () => {
      return (
        <>
          <SafeAreaView>
            <View style={{marginHorizontal: 20}}>
              <Markdown
                mergeStyle={true} 
                style={{
                  root: {color: 'red', fontSize: 10},
                  heading1: {color: 'purple'},
                  codeBlock: {color: 'black', fontSize: 14}
                }}
              >
                {copy}
              </Markdown>
            </View>
          </SafeAreaView>
        </>
      );
    };