fixed issue with link not rendering completly inline #19

Author: mientjan

src/lib/parser.js

@@ -3,6 +3,7 @@ import { View } from "react-native";
 import tokensToAST from "./util/tokensToAST";
 import { stringToTokens } from "./util/stringToTokens";
 import { cleanupTokens } from "./util/cleanupTokens";
+import groupTextTokens from "./util/groupTextTokens";
 
 /**
  *
@@ -13,6 +14,6 @@ import { cleanupTokens } from "./util/cleanupTokens";
  */
 export function parser(source, renderer, markdownIt) {
   return renderer(
-    tokensToAST(cleanupTokens(stringToTokens(source, markdownIt)))
+    tokensToAST(groupTextTokens(cleanupTokens(stringToTokens(source, markdownIt))))
   );
 }

src/lib/renderRules.js

@@ -2,11 +2,9 @@ import React, { Component, PropTypes } from "react";
 import { Text, View } from "react-native";
 
 import FitImage from "react-native-fit-image";
-import getUniqueID from "./util/getUniqueID";
 import openUrl from "./util/openUrl";
 import hasParents from "./util/hasParents";
 import applyStyle from "./util/applyStyle";
-import ImageComponent from "./ImageComponent";
 
 const renderRules = {
   // when unknown elements are introduced, so it wont break
@@ -53,10 +51,11 @@ const renderRules = {
   },
   // a
   link: (node, children, parent, styles) => {
+    console.log(node);
     return (
       <Text
         key={node.key}
-        style={styles.a}
+        style={styles.link}
         onPress={() => openUrl(node.attributes.href)}
       >
         {children}
@@ -80,12 +79,7 @@ const renderRules = {
   },
 
   heading2: (node, children, parent, styles) => {
-
     children = applyStyle(children, [styles.heading, styles.heading2], "Text");
-
-    console.log(children);
-
-
     return (
       <View key={node.key} style={styles.headingContainer}>
         {children}
@@ -235,10 +229,11 @@ const renderRules = {
   ),
   image: (node, children, parent, styles) => {
     return (
-      <ImageComponent
+      <FitImage
+        indicator={true}
         key={node.key}
         style={styles.image}
-        uri={node.attributes.src}
+        source={{ uri: node.attributes.src }}
       />
     );
   }

src/lib/styles.js

@@ -133,11 +133,16 @@ export const styles = StyleSheet.create({
   strikethrough: {
     textDecorationLine: "line-through"
   },
-  a: {
-    textDecorationLine: "underline"
+  link: {
+    textDecorationLine: "underline",
+      color: 'red'
   },
   u: {
     borderColor: "#000000",
     borderBottomWidth: 1
+  },
+  image: {
+    flex: 1,
+
   }
 });

src/lib/util/cleanupTokens.js

@@ -5,6 +5,5 @@ import removeInlineTokens from "./removeInlineTokens";
 export function cleanupTokens(tokens) {
   tokens = removeInlineTokens(tokens);
   tokens.forEach(token => (token.type = getTokenTypeByToken(token)));
-  tokens = groupTextTokens(tokens);
   return tokens;
 }

src/lib/util/getIsInlineTextType.js

@@ -6,7 +6,7 @@ const textTypes = [
   'text',
   'span',
   'strong',
-  'a',
+  'link',
   's',
   'em',
   'br',

src/lib/util/getIsTextType.js

@@ -6,19 +6,12 @@ const textTypes = [
   'text',
   'span',
   'strong',
-  'a',
+  'link',
   's',
   'em',
   'softbreak',
 ];
 
-// 'heading1',
-// 'heading2',
-// 'heading3',
-// 'heading4',
-// 'heading5',
-// 'heading6',
-
 /**
  *
  * @param node