fixed issue where links where blocking rending of the rest of the markdown copy

Author: mientjan

example/App.js

@@ -4,7 +4,7 @@
  */
 
 import React, { Component } from 'react';
-import { Platform, Picker, ScrollView, StyleSheet, Text, View, Alert } from 'react-native';
+import { Platform, Picker, ScrollView, StyleSheet, Text, View, Dimensions } from 'react-native';
 
 import Markdown, {
   AstRenderer,
@@ -15,10 +15,14 @@ import Markdown, {
 } from './react-native-markdown-renderer';
 //
 import markdownItCheckbox from 'markdown-it-checkbox';
+import { TabViewAnimated, SceneMap, TabBar } from 'react-native-tab-view';
+
 import copyAll from './src/copyAll';
 import customMarkdownStyle from './src/customMarkdownStyle';
 import copyAllCheckboxPlugin from './src/copyAllCheckboxPlugin';
 import pluginRules from './src/pluginRules';
+import all from './src/copy/all';
+import linkedimg from './src/copy/linkedimg';
 
 const instructions = Platform.select({
   ios: 'Press Cmd+R to reload,\n' + 'Cmd+D or shake for dev menu',
@@ -55,20 +59,25 @@ const renderer = new AstRenderer(
   styles
 );
 
+const routes = {
+    all: () => <ScrollView><Markdown children={all} /></ScrollView>,
+    linkedimg: () => <ScrollView><Markdown children={linkedimg} /></ScrollView>,
+};
+
+const initialLayout = {
+  height: 0,
+  width: Dimensions.get('window').width,
+};
+
 export default class App extends Component {
   state = {
-    view: 0,
+    index: 0,
+    routes: [
+        { key: 'all', title: 'All Markdown' },
+        { key: 'linkedimg', title: 'Linked Images' },
+        ],
   };
 
-  list = [
-    { description: 'default' },
-    { description: 'custom renderer' },
-    { description: 'custom style sheet' },
-    { description: 'custom rules' },
-    { description: 'custom rules & styles' },
-    { description: 'plugins (checkbox)' },
-  ];
-
   getView(value) {
     switch (value) {
       case 0: {
@@ -107,7 +116,23 @@ export default class App extends Component {
     this.setState({ view: itemIndex });
   };
 
+  handleIndexChange = index => this.setState({ index });
+  renderHeader = props => <TabBar {...props} />;
+  renderScene = SceneMap(routes);
+
   render() {
+    return (
+      <TabViewAnimated
+        navigationState={this.state}
+        renderScene={this.renderScene}
+        renderHeader={this.renderHeader}
+        onIndexChange={this.handleIndexChange}
+        initialLayout={initialLayout}
+      />
+    );
+  }
+
+  render3() {
     let currentView = this.state.view;
 
     return (

example/package.json

@@ -13,7 +13,9 @@
     "prop-types": "^15.6.1",
     "react": "16.3.1",
     "react-native": "0.55.2",
-    "react-native-fit-image": "^1.5.4"
+    "react-native-fit-image": "^1.5.4",
+    "react-native-markdown-renderer": "^3.2.0",
+    "react-native-tab-view": "0.0.77"
   },
   "devDependencies": {
     "babel-jest": "22.4.3",

example/react-native-markdown-renderer/index.d.ts

@@ -0,0 +1,84 @@
+// tslint:disable:max-classes-per-file
+import { MarkdownIt, Token } from 'markdown-it';
+import { ComponentType, ReactNode } from 'react';
+import { StyleSheet, View } from 'react-native';
+
+export function getUniqueID(): string;
+export function openUrl(url: string): void;
+
+export function hasParents(parents: any[], type: string): boolean;
+
+export type RenderFunction = (
+  node: any,
+  children: ReactNode[],
+  parent: ReactNode,
+  styles: any,
+) => ReactNode;
+
+export interface RenderRules {
+  [name: string]: RenderFunction;
+}
+
+export const renderRules: RenderRules;
+
+export interface MarkdownParser {
+  parse: (value: string, options: any) => Token[];
+}
+
+export interface ASTNode {
+  type: string;
+  sourceType: string; // original source token name
+  key: string;
+  content: string;
+  tokenIndex: number;
+  index: number;
+  attributes: Record<string, any>;
+  children: ASTNode[];
+}
+
+export class AstRenderer {
+  constructor(renderRules: RenderRules, style?: any);
+  getRenderFunction(type: string): RenderFunction;
+  renderNode(node: any, parentNodes: ReadonlyArray<any>): ReactNode;
+  render(nodes: ReadonlyArray<any>): View;
+}
+
+export function parser(
+  source: string,
+  renderer: (node: ASTNode) => View,
+  parser: MarkdownParser,
+): any;
+
+export function stringToTokens(
+  source: string,
+  markdownIt: MarkdownParser,
+): Token[];
+
+export function tokensToAST(tokens: ReadonlyArray<Token>): ASTNode[];
+
+interface PluginContainerResult<A> extends Array<any> {
+  0: A;
+}
+
+export class PluginContainer<A> {
+  constructor(plugin: A, ...options: any[]);
+  toArray(): PluginContainerResult<A>;
+}
+
+export function blockPlugin(md: any, name: string, options: object): any;
+
+export const styles: any;
+
+export interface MarkdownProps {
+  rules?: RenderRules;
+  style?: StyleSheet.NamedStyles<any>;
+  renderer?: AstRenderer;
+  markdownit?: MarkdownIt;
+  plugins?: Array<PluginContainer<any>>;
+}
+
+type MarkdownStatic = React.ComponentType<MarkdownProps>;
+export const Markdown: MarkdownStatic;
+export type Markdown = MarkdownStatic;
+
+export default Markdown;

example/react-native-markdown-renderer/lib/parser.js

@@ -21,7 +21,6 @@ export function parser(source, renderer, markdownIt) {
   tokens = groupTextTokens(tokens);
 
   const astTree = tokensToAST(tokens);
-  console.log(astTree);
 
   return renderer(astTree);
 }

example/react-native-markdown-renderer/lib/util/cleanupTokens.js

@@ -15,7 +15,7 @@ export function cleanupTokens(tokens) {
     if (token.type === 'link' && token.nesting === 1) {
       stack.push(token);
     } else if (stack.length > 0 && token.type === 'link' && token.nesting === -1) {
-      if (stack.findIndex(stackToken => !getIsTextType(stackToken)) > -1) {
+      if (stack.some(stackToken => !getIsTextType(stackToken.type))) {
         stack[0].type = 'blocklink';
         token.type = 'blocklink';
       }

example/react-native-markdown-renderer/lib/util/tokensToAST.js

@@ -3,7 +3,7 @@ import getTokenTypeByToken from './getTokenTypeByToken';
 
 /**
  *
- * @param {{type: string, tag:string, content: string, children: *, attrs: Array}} token
+ * @param {{type: string, tag:string, content: string, children: *, attrs: Array, meta, info}} token
  * @param {number} tokenIndex
  * @return {{type: string, content, tokenIndex: *, index: number, attributes: {}, children: *}}
  */
@@ -18,13 +18,13 @@ function createNode(token, tokenIndex) {
       const [name, value] = curr;
       return { ...prev, [name]: value };
     }, {});
-
   }
 
-
   return {
     type,
     sourceType: token.type,
+    sourceInfo: token.info,
+    sourceMeta: token.meta,
     key: getUniqueID(),
     content,
     tokenIndex,
@@ -34,7 +34,6 @@ function createNode(token, tokenIndex) {
   };
 }
 
-
 /**
  *
  * @param {Array<{type: string, tag:string, content: string, children: *, attrs: Array}>}tokens