react-native-marked 1.6.12 → 1.6.14

package/dist/module/utils/string.js.map

@@ -1 +1 @@
-{"version":3,"names":["generateRandomString","Math","random","toString","substring"],"sourceRoot":"../../src","sources":["string.ts"],"mappings":"AAAA;AACA;AACA;AACA;AACA,OAAO,MAAMA,oBAAoB,GAAG,MAAM;EACzC,OAAOC,IAAI,CAACC,MAAL,GAAcC,QAAd,CAAuB,EAAvB,EAA2BC,SAA3B,CAAqC,CAArC,CAAP;AACA,CAFM"}
+{"version":3,"names":["generateRandomString","Math","random","toString","substring"],"sourceRoot":"../../../src","sources":["utils/string.ts"],"mappings":"AAAA;AACA;AACA;AACA;AACA,OAAO,MAAMA,oBAAoB,GAAG,MAAM;EACzC,OAAOC,IAAI,CAACC,MAAL,GAAcC,QAAd,CAAuB,EAAvB,EAA2BC,SAA3B,CAAqC,CAArC,CAAP;AACA,CAFM"}

package/dist/module/utils/url.js.map

@@ -1 +1 @@
-{"version":3,"names":["getValidURL","prefix","path","endsWith","slice","startsWith"],"sourceRoot":"../../src","sources":["url.ts"],"mappings":"AAAA,OAAO,MAAMA,WAAW,GAAG,CAACC,MAAD,EAAiBC,IAAjB,KAAkC;EAC5D;EACA,IAAID,MAAM,CAACE,QAAP,CAAgB,GAAhB,CAAJ,EAA0B;IACzBF,MAAM,GAAGA,MAAM,CAACG,KAAP,CAAa,CAAb,EAAgB,CAAC,CAAjB,CAAT;EACA,CAJ2D,CAM5D;;;EACA,IAAIF,IAAI,CAACG,UAAL,CAAgB,OAAhB,KAA4BH,IAAI,CAACG,UAAL,CAAgB,MAAhB,CAAhC,EAAyD;IACxD,OAAOH,IAAP;EACA,CAT2D,CAW5D;;;EACA,IAAIA,IAAI,CAACG,UAAL,CAAgB,GAAhB,CAAJ,EAA0B;IACzB,OAAQ,GAAEJ,MAAO,GAAEC,IAAK,EAAxB;EACA,CAd2D,CAgB5D;;;EACA,OAAQ,GAAED,MAAO,IAAGC,IAAK,EAAzB;AACA,CAlBM"}
+{"version":3,"names":["getValidURL","prefix","path","endsWith","slice","startsWith"],"sourceRoot":"../../../src","sources":["utils/url.ts"],"mappings":"AAAA,OAAO,MAAMA,WAAW,GAAG,CAACC,MAAD,EAAiBC,IAAjB,KAAkC;EAC5D;EACA,IAAID,MAAM,CAACE,QAAP,CAAgB,GAAhB,CAAJ,EAA0B;IACzBF,MAAM,GAAGA,MAAM,CAACG,KAAP,CAAa,CAAb,EAAgB,CAAC,CAAjB,CAAT;EACA,CAJ2D,CAM5D;;;EACA,IAAIF,IAAI,CAACG,UAAL,CAAgB,OAAhB,KAA4BH,IAAI,CAACG,UAAL,CAAgB,MAAhB,CAAhC,EAAyD;IACxD,OAAOH,IAAP;EACA,CAT2D,CAW5D;;;EACA,IAAIA,IAAI,CAACG,UAAL,CAAgB,GAAhB,CAAJ,EAA0B;IACzB,OAAQ,GAAEJ,MAAO,GAAEC,IAAK,EAAxB;EACA,CAd2D,CAgB5D;;;EACA,OAAQ,GAAED,MAAO,IAAGC,IAAK,EAAzB;AACA,CAlBM"}

package/dist/typescript/src/components/MDImage.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { ImageStyle } from "react-native";
+import { type ImageStyle } from "react-native";
 interface MDImageProps {
     uri: string;
     alt?: string;

package/dist/typescript/src/components/MDImage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MDImage.d.ts","sourceRoot":"","sources":["../../../../src/components/MDImage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0B,MAAM,OAAO,CAAC;AAC/C,OAAO,EAAS,UAAU,EAAE,MAAM,cAAc,CAAC;AAGjD,UAAU,YAAY;IACrB,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,UAAU,CAAC;CACnB;;AAmBD,wBAA6B"}
+{"version":3,"file":"MDImage.d.ts","sourceRoot":"","sources":["../../../../src/components/MDImage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0B,MAAM,OAAO,CAAC;AAC/C,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAGtD,UAAU,YAAY;IACrB,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,UAAU,CAAC;CACnB;;AAmBD,wBAA6B"}

package/dist/typescript/src/lib/Markdown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Markdown.d.ts","sourceRoot":"","sources":["../../../../src/lib/Markdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAgD,MAAM,OAAO,CAAC;AAKrE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;;AA4C7C,wBAA8B"}
+{"version":3,"file":"Markdown.d.ts","sourceRoot":"","sources":["../../../../src/lib/Markdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAMN,MAAM,OAAO,CAAC;AAKf,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;;AAgD7C,wBAA8B"}

package/dist/typescript/src/lib/Parser.d.ts

@@ -1,5 +1,4 @@
 import type { ReactNode } from "react";
-import type { TextStyle, ViewStyle, ImageStyle } from "react-native";
 import type { marked } from "marked";
 import type { ParserOptions } from "./types";
 declare class Parser {
@@ -9,7 +8,8 @@ declare class Parser {
     private baseUrl;
     constructor(options: ParserOptions);
     parse(tokens: marked.Token[]): ReactNode[];
-    parseInline(tokens: marked.Token[], styles?: ViewStyle | TextStyle | ImageStyle): ReactNode[];
+    private _parse;
+    private _parseToken;
     private getNormalizedSiblingNodesForBlockAndInlineTokens;
 }
 export default Parser;

package/dist/typescript/src/lib/Parser.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Parser.d.ts","sourceRoot":"","sources":["../../../../src/lib/Parser.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AACrE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAGrC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAG7C,cAAM,MAAM;IACX,OAAO,CAAC,QAAQ,CAAC;IACjB,OAAO,CAAC,MAAM,CAAe;IAC7B,OAAO,CAAC,gBAAgB,CAAwC;IAChE,OAAO,CAAC,OAAO,CAAS;gBACZ,OAAO,EAAE,aAAa;IAclC,KAAK,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,EAAE;IA0E5B,WAAW,CACV,MAAM,EAAE,MAAM,CAAC,KAAK,EAAE,EACtB,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,UAAU;IA8F5C,OAAO,CAAC,gDAAgD,CAuDtD;CACF;AAED,eAAe,MAAM,CAAC"}
+{"version":3,"file":"Parser.d.ts","sourceRoot":"","sources":["../../../../src/lib/Parser.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAGrC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAG7C,cAAM,MAAM;IACX,OAAO,CAAC,QAAQ,CAAC;IACjB,OAAO,CAAC,MAAM,CAAe;IAC7B,OAAO,CAAC,gBAAgB,CAAwC;IAChE,OAAO,CAAC,OAAO,CAAS;gBACZ,OAAO,EAAE,aAAa;IAclC,KAAK,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,EAAE;IAI5B,OAAO,CAAC,MAAM;IAUd,OAAO,CAAC,WAAW;IA6JnB,OAAO,CAAC,gDAAgD,CAuDtD;CACF;AAED,eAAe,MAAM,CAAC"}

package/dist/typescript/src/lib/Renderer.d.ts

@@ -1,5 +1,5 @@
-import { ReactNode } from "react";
-import { TextStyle, ViewStyle, ImageStyle } from "react-native";
+import { type ReactNode } from "react";
+import { type TextStyle, type ViewStyle, type ImageStyle } from "react-native";
 declare class Renderer {
     getTextNode: (children: string | ReactNode[], styles?: TextStyle) => JSX.Element;
     getTextLinkNode: (children: string | ReactNode[], href: string, styles?: TextStyle) => JSX.Element;

package/dist/typescript/src/lib/Renderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Renderer.d.ts","sourceRoot":"","sources":["../../../../src/lib/Renderer.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAKN,SAAS,EACT,SAAS,EACT,UAAU,EACV,MAAM,cAAc,CAAC;AAQtB,cAAM,QAAQ;IACb,WAAW,aAAc,MAAM,GAAG,SAAS,EAAE,WAAW,SAAS,iBAM/D;IAEF,eAAe,aACJ,MAAM,GAAG,SAAS,EAAE,QACxB,MAAM,WACH,SAAS,iBAajB;IAEF,gBAAgB,SACT,MAAM,YACF,MAAM,QACV,MAAM,UACJ,UAAU,iBAajB;IAEF,WAAW,CAAC,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,MAAM,CAAC,EAAE,SAAS;IAQ5D,gBAAgB,CACf,IAAI,EAAE,MAAM,EACZ,cAAc,CAAC,EAAE,SAAS,EAC1B,SAAS,CAAC,EAAE,SAAS;IAatB,iBAAiB,CAAC,QAAQ,EAAE,SAAS,EAAE,EAAE,MAAM,CAAC,EAAE,SAAS;IAQ3D,YAAY,CAAC,GAAG,EAAE,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,UAAU;IAM1D,WAAW,CACV,OAAO,EAAE,OAAO,EAChB,EAAE,EAAE,SAAS,EAAE,EACf,SAAS,CAAC,EAAE,SAAS,EACrB,SAAS,CAAC,EAAE,SAAS;CAatB;AAED,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"Renderer.d.ts","sourceRoot":"","sources":["../../../../src/lib/Renderer.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC9C,OAAO,EAKN,KAAK,SAAS,EACd,KAAK,SAAS,EACd,KAAK,UAAU,EACf,MAAM,cAAc,CAAC;AAQtB,cAAM,QAAQ;IACb,WAAW,aAAc,MAAM,GAAG,SAAS,EAAE,WAAW,SAAS,iBAM/D;IAEF,eAAe,aACJ,MAAM,GAAG,SAAS,EAAE,QACxB,MAAM,WACH,SAAS,iBAajB;IAEF,gBAAgB,SACT,MAAM,YACF,MAAM,QACV,MAAM,UACJ,UAAU,iBAajB;IAEF,WAAW,CAAC,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,MAAM,CAAC,EAAE,SAAS;IAQ5D,gBAAgB,CACf,IAAI,EAAE,MAAM,EACZ,cAAc,CAAC,EAAE,SAAS,EAC1B,SAAS,CAAC,EAAE,SAAS;IAatB,iBAAiB,CAAC,QAAQ,EAAE,SAAS,EAAE,EAAE,MAAM,CAAC,EAAE,SAAS;IAQ3D,YAAY,CAAC,GAAG,EAAE,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,UAAU;IAM1D,WAAW,CACV,OAAO,EAAE,OAAO,EAChB,EAAE,EAAE,SAAS,EAAE,EACf,SAAS,CAAC,EAAE,SAAS,EACrB,SAAS,CAAC,EAAE,SAAS;CAatB;AAED,eAAe,QAAQ,CAAC"}

package/dist/typescript/src/theme/styles.d.ts

@@ -1,4 +1,4 @@
-import { ColorSchemeName } from "react-native";
+import { type ColorSchemeName } from "react-native";
 import type { MarkedStyles, UserTheme } from "./types";
 declare const getStyles: (userStyles?: MarkedStyles, colorScheme?: ColorSchemeName, userTheme?: UserTheme) => MarkedStyles;
 export default getStyles;

package/dist/typescript/src/theme/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/theme/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAc,MAAM,cAAc,CAAC;AAG3D,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAgBvD,QAAA,MAAM,SAAS,gBACD,YAAY,gBACX,eAAe,cACjB,SAAS,KACnB,YA+GF,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/theme/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAGhE,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAgBvD,QAAA,MAAM,SAAS,gBACD,YAAY,gBACX,eAAe,cACjB,SAAS,KACnB,YA+GF,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-marked",
-  "version": "1.6.12",
+  "version": "1.6.14",
   "description": "Markdown renderer for React Native powered by marked.js",
   "main": "dist/commonjs/index",
   "module": "dist/module/index",
@@ -48,32 +48,32 @@
     "registry": "https://registry.npmjs.org/"
   },
   "devDependencies": {
-    "@babel/core": "7.20.12",
+    "@babel/core": "7.21.3",
     "@babel/preset-env": "7.20.2",
-    "@commitlint/config-conventional": "17.4.2",
-    "@evilmartians/lefthook": "1.2.7",
+    "@commitlint/config-conventional": "17.4.4",
+    "@evilmartians/lefthook": "1.3.7",
     "@release-it/conventional-changelog": "5.1.1",
-    "@testing-library/jest-native": "5.4.1",
-    "@testing-library/react-native": "11.5.0",
-    "@types/jest": "29.2.5",
+    "@testing-library/jest-native": "5.4.2",
+    "@testing-library/react-native": "12.0.0",
+    "@types/jest": "29.5.0",
     "@types/marked": "4.0.8",
     "@types/node": "^18.11.18",
-    "@types/react": "18.0.26",
-    "@types/react-native": "0.70.8",
-    "commitlint": "17.4.2",
-    "danger": "11.2.1",
-    "jest": "29.3.1",
-    "jest-environment-jsdom": "29.3.1",
-    "metro-react-native-babel-preset": "0.74.0",
+    "@types/react": "18.0.28",
+    "@types/react-native": "0.71.4",
+    "commitlint": "17.5.0",
+    "danger": "11.2.4",
+    "jest": "29.5.0",
+    "jest-environment-jsdom": "29.5.0",
+    "metro-react-native-babel-preset": "0.76.0",
     "pod-install": "0.1.38",
-    "react": "18.1.0",
-    "react-native": "0.70.6",
-    "react-native-builder-bob": "0.20.3",
-    "react-test-renderer": "18.1.0",
-    "reassure": "0.6.0",
-    "release-it": "15.6.0",
+    "react": "18.2.0",
+    "react-native": "0.71.4",
+    "react-native-builder-bob": "0.20.4",
+    "react-test-renderer": "18.2.0",
+    "reassure": "0.7.2",
+    "release-it": "15.9.1",
     "rome": "11.0.0",
-    "typescript": "4.9.4"
+    "typescript": "5.0.2"
   },
   "peerDependencies": {
     "react": "^16.8.6 || ^17.0.0 || ^18.0.0",
@@ -151,7 +151,7 @@
   "dependencies": {
     "@jsamr/counter-style": "2.0.2",
     "@jsamr/react-native-li": "2.3.1",
-    "marked": "4.2.12",
+    "marked": "4.3.0",
     "react-native-fit-image": "1.5.5"
   }
 }

package/src/components/MDImage.tsx

@@ -1,5 +1,5 @@
 import React, { memo, useEffect } from "react";
-import { Image, ImageStyle } from "react-native";
+import { Image, type ImageStyle } from "react-native";
 import FitImage from "react-native-fit-image";
 
 interface MDImageProps {

package/src/lib/Markdown.tsx

@@ -1,4 +1,10 @@
-import React, { memo, ReactNode, useCallback, useMemo } from "react";
+import React, {
+	memo,
+	useCallback,
+	useMemo,
+	type ReactElement,
+	type ReactNode,
+} from "react";
 import { FlatList, useColorScheme } from "react-native";
 import { marked } from "marked";
 import Parser from "./Parser";
@@ -18,14 +24,18 @@ const Markdown = ({
 		[userStyles, colorScheme, theme],
 	);
 
+	const parser = useMemo(
+		() => new Parser({ styles, baseUrl }),
+		[styles, baseUrl],
+	);
+
 	const rnElements = useMemo(() => {
-		const parser = new Parser({ styles, baseUrl });
 		const tokens = marked.lexer(value, { mangle: false, gfm: true });
 		return parser.parse(tokens);
 	}, [value, styles, baseUrl]);
 
 	const renderItem = useCallback(({ item }: { item: ReactNode }) => {
-		return <>{item}</>;
+		return item as ReactElement;
 	}, []);
 
 	const keyExtractor = useCallback(
@@ -35,10 +45,10 @@ const Markdown = ({
 
 	return (
 		<FlatList
+			removeClippedSubviews
 			keyExtractor={keyExtractor}
 			maxToRenderPerBatch={8}
 			initialNumToRender={8}
-			removeClippedSubviews={true}
 			style={styles.container}
 			{...flatListProps}
 			data={rnElements}

package/src/lib/Parser.tsx

@@ -26,173 +26,174 @@ class Parser {
 	}
 
 	parse(tokens: marked.Token[]) {
-		const elements: ReactNode[] = tokens.map((token) => {
-			switch (token.type) {
-				case "space": {
-					return null;
-				}
-				case "paragraph": {
-					const paragraphChildren =
-						this.getNormalizedSiblingNodesForBlockAndInlineTokens(
-							token.tokens,
-							this.styles.text,
-						);
-
-					return this.renderer.getViewNode(
-						paragraphChildren,
-						this.styles.paragraph,
-					);
-				}
-				case "blockquote": {
-					return this.renderer.getBlockquoteNode(
-						this.parse(token.tokens),
-						this.styles.blockquote,
-					);
-				}
-				case "heading": {
-					const styles = this.headingStylesMap[token.depth];
-					return this.renderer.getTextNode(
-						this.parseInline(token.tokens, styles),
-						styles,
-					);
-				}
-				case "code": {
-					return this.renderer.getCodeBlockNode(
-						token.text,
-						this.styles.code,
-						this.styles.em,
-					);
-				}
-				case "hr": {
-					return this.renderer.getViewNode(null, this.styles.hr);
-				}
-				case "list": {
-					const li = token.items.map((item) => {
-						const children = item.tokens.map((cItem) => {
-							if (cItem.type === "text") {
-								/* getViewNode since tokens could contain a block like elements (i.e. img) */
-								const childTokens = (cItem as marked.Tokens.Text).tokens || [];
-								const listChildren =
-									this.getNormalizedSiblingNodesForBlockAndInlineTokens(
-										childTokens,
-										this.styles.li,
-									);
-								return this.renderer.getViewNode(listChildren, this.styles.li);
-							}
-
-							/* Parse the nested token */
-							return this.parse([cItem]);
-						});
-						return this.renderer.getViewNode(children, this.styles.li);
-					});
-					return this.renderer.getListNode(
-						token.ordered,
-						li,
-						this.styles.list,
-						this.styles.li,
-					);
-				}
-				default:
-					return this.parseInline([token]);
-			}
-		});
-		return elements.filter((element) => element !== null);
+		return this._parse(tokens);
 	}
 
-	parseInline(
+	private _parse(
 		tokens: marked.Token[],
 		styles?: ViewStyle | TextStyle | ImageStyle,
 	) {
 		const elements: ReactNode[] = tokens.map((token) => {
-			switch (token.type) {
-				case "escape": {
-					return this.renderer.getTextNode(token.text, {
-						...this.styles.text,
-						...styles,
-					});
-				}
-				case "link": {
-					// Note: Linking Images (https://www.markdownguide.org/basic-syntax/#linking-images) are wrapped
-					// in paragraph token, so will be handled via `getNormalizedSiblingNodesForBlockAndInlineTokens`
-					const linkStyle = {
-						...styles,
-						...this.styles.link, // To override color property
-					};
-					const href = getValidURL(this.baseUrl, token.href);
-					return this.renderer.getTextLinkNode(
-						this.parseInline(token.tokens, linkStyle),
-						href,
-						linkStyle,
-					);
-				}
-				case "image": {
-					return this.renderer.getImageNode(
-						token.href,
-						token.text || token.title,
-						this.styles.image,
-					);
-				}
-				case "strong": {
-					const boldStyle = {
-						...this.styles.strong,
-						...styles,
-					};
-					return this.renderer.getTextNode(
-						this.parseInline(token.tokens, boldStyle),
-						boldStyle,
-					);
-				}
-				case "em": {
-					const italicStyle = {
-						...this.styles.em,
-						...styles,
-					};
-					return this.renderer.getTextNode(
-						this.parseInline(token.tokens, italicStyle),
-						italicStyle,
-					);
-				}
-				case "codespan": {
-					return this.renderer.getTextNode(token.text, {
-						...this.styles.codespan,
-						...styles,
-					});
-				}
-				case "br": {
-					return this.renderer.getTextNode("\n", {});
-				}
-				case "del": {
-					const strikethroughStyle = {
-						...this.styles.strikethrough,
-						...styles,
-					};
-					return this.renderer.getTextNode(
-						this.parseInline(token.tokens, strikethroughStyle),
-						strikethroughStyle,
+			return this._parseToken(token, styles);
+		});
+		return elements.filter((element) => element !== null);
+	}
+
+	private _parseToken(
+		token: marked.Token,
+		styles?: ViewStyle | TextStyle | ImageStyle,
+	): ReactNode {
+		switch (token.type) {
+			case "space": {
+				return null;
+			}
+			case "paragraph": {
+				const paragraphChildren =
+					this.getNormalizedSiblingNodesForBlockAndInlineTokens(
+						token.tokens,
+						this.styles.text,
 					);
-				}
-				case "text":
-				case "html": {
-					if (token.type === "html") {
-						console.warn(
-							"react-native-marked: rendering html from markdown is not supported",
-						);
-					}
 
-					return this.renderer.getTextNode(token.raw, {
-						...this.styles.text,
-						...styles,
+				return this.renderer.getViewNode(
+					paragraphChildren,
+					this.styles.paragraph,
+				);
+			}
+			case "blockquote": {
+				return this.renderer.getBlockquoteNode(
+					this._parse(token.tokens),
+					this.styles.blockquote,
+				);
+			}
+			case "heading": {
+				const styles = this.headingStylesMap[token.depth];
+				return this.renderer.getTextNode(
+					this._parse(token.tokens, styles),
+					styles,
+				);
+			}
+			case "code": {
+				return this.renderer.getCodeBlockNode(
+					token.text,
+					this.styles.code,
+					this.styles.em,
+				);
+			}
+			case "hr": {
+				return this.renderer.getViewNode(null, this.styles.hr);
+			}
+			case "list": {
+				const li = token.items.map((item) => {
+					const children = item.tokens.map((cItem) => {
+						if (cItem.type === "text") {
+							/* getViewNode since tokens could contain a block like elements (i.e. img) */
+							const childTokens = (cItem as marked.Tokens.Text).tokens || [];
+							const listChildren =
+								this.getNormalizedSiblingNodesForBlockAndInlineTokens(
+									childTokens,
+									this.styles.li,
+								);
+							return this.renderer.getViewNode(listChildren, this.styles.li);
+						}
+
+						/* Parse the nested token */
+						return this._parseToken(cItem);
 					});
-				}
-				default: {
+					return this.renderer.getViewNode(children, this.styles.li);
+				});
+				return this.renderer.getListNode(
+					token.ordered,
+					li,
+					this.styles.list,
+					this.styles.li,
+				);
+			}
+			case "escape": {
+				return this.renderer.getTextNode(token.text, {
+					...this.styles.text,
+					...styles,
+				});
+			}
+			case "link": {
+				// Note: Linking Images (https://www.markdownguide.org/basic-syntax/#linking-images) are wrapped
+				// in paragraph token, so will be handled via `getNormalizedSiblingNodesForBlockAndInlineTokens`
+				const linkStyle = {
+					...styles,
+					...this.styles.link, // To override color property
+				};
+				const href = getValidURL(this.baseUrl, token.href);
+				return this.renderer.getTextLinkNode(
+					this._parse(token.tokens, linkStyle),
+					href,
+					linkStyle,
+				);
+			}
+			case "image": {
+				return this.renderer.getImageNode(
+					token.href,
+					token.text || token.title,
+					this.styles.image,
+				);
+			}
+			case "strong": {
+				const boldStyle = {
+					...this.styles.strong,
+					...styles,
+				};
+				return this.renderer.getTextNode(
+					this._parse(token.tokens, boldStyle),
+					boldStyle,
+				);
+			}
+			case "em": {
+				const italicStyle = {
+					...this.styles.em,
+					...styles,
+				};
+				return this.renderer.getTextNode(
+					this._parse(token.tokens, italicStyle),
+					italicStyle,
+				);
+			}
+			case "codespan": {
+				return this.renderer.getTextNode(token.text, {
+					...this.styles.codespan,
+					...styles,
+				});
+			}
+			case "br": {
+				return this.renderer.getTextNode("\n", {});
+			}
+			case "del": {
+				const strikethroughStyle = {
+					...this.styles.strikethrough,
+					...styles,
+				};
+				return this.renderer.getTextNode(
+					this._parse(token.tokens, strikethroughStyle),
+					strikethroughStyle,
+				);
+			}
+			case "text":
+			case "html": {
+				if (token.type === "html") {
 					console.warn(
-						`react-native-marked: token with '${token.type}' type was not found.`,
+						"react-native-marked: rendering html from markdown is not supported",
 					);
-					return null;
 				}
+
+				return this.renderer.getTextNode(token.raw, {
+					...this.styles.text,
+					...styles,
+				});
 			}
-		});
-		return elements.filter((element) => element !== null);
+			default: {
+				console.warn(
+					`react-native-marked: token with '${token.type}' type was not found.`,
+				);
+				return null;
+			}
+		}
 	}
 
 	private getNormalizedSiblingNodesForBlockAndInlineTokens = (
@@ -215,14 +216,14 @@ class Parser {
 					t.tokens[0].type === "image")
 			) {
 				// Render existing inline tokens in the queue
-				const parsed = this.parseInline(tokenRenderQueue);
+				const parsed = this._parse(tokenRenderQueue);
 				if (parsed.length > 0) {
 					siblingNodes.push(this.renderer.getTextNode(parsed, textStyle));
 				}
 
 				// Render the current block token
 				if (t.type === "image") {
-					siblingNodes.push(this.parseInline([t]));
+					siblingNodes.push(this._parseToken(t));
 				} else if (t.type === "link") {
 					const imageToken = t.tokens[0] as marked.Tokens.Image;
 					const href = getValidURL(this.baseUrl, t.href);
@@ -245,7 +246,7 @@ class Parser {
 		/* Remaining temp tokens if any */
 		if (tokenRenderQueue.length > 0) {
 			siblingNodes.push(
-				this.renderer.getTextNode(this.parseInline(tokenRenderQueue), {}),
+				this.renderer.getTextNode(this._parse(tokenRenderQueue), {}),
 			);
 		}
 

package/src/lib/Renderer.tsx

@@ -1,12 +1,12 @@
-import React, { ReactNode } from "react";
+import React, { type ReactNode } from "react";
 import {
 	ScrollView,
 	View,
 	Text,
 	TouchableHighlight,
-	TextStyle,
-	ViewStyle,
-	ImageStyle,
+	type TextStyle,
+	type ViewStyle,
+	type ImageStyle,
 } from "react-native";
 import MarkedList from "@jsamr/react-native-li";
 import Disc from "@jsamr/counter-style/presets/disc";
@@ -76,9 +76,9 @@ class Renderer {
 	) {
 		return (
 			<ScrollView
+				horizontal
 				key={generateRandomString()}
 				contentContainerStyle={containerStyle}
-				horizontal={true}
 			>
 				<Text style={textStyle}>{text}</Text>
 			</ScrollView>

package/src/theme/styles.ts

@@ -1,6 +1,6 @@
-import { ColorSchemeName, StyleSheet } from "react-native";
+import { StyleSheet, type ColorSchemeName } from "react-native";
 import spacing from "./spacing";
-import colors, { ColorsPropType } from "./colors";
+import colors, { type ColorsPropType } from "./colors";
 import type { MarkedStyles, UserTheme } from "./types";
 
 const getFontStyles = (mdColors: ColorsPropType) => {