react-native-marked 1.0.2 → 1.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (23) hide show
  1. package/README.md +10 -1
  2. package/dist/commonjs/lib/Markdown.js.map +1 -1
  3. package/dist/commonjs/lib/Parser.js +22 -13
  4. package/dist/commonjs/lib/Parser.js.map +1 -1
  5. package/dist/commonjs/lib/Renderer.js.map +1 -1
  6. package/dist/commonjs/lib/types.js +6 -0
  7. package/dist/commonjs/lib/types.js.map +1 -0
  8. package/dist/module/lib/Markdown.js.map +1 -1
  9. package/dist/module/lib/Parser.js +22 -13
  10. package/dist/module/lib/Parser.js.map +1 -1
  11. package/dist/module/lib/Renderer.js +1 -2
  12. package/dist/module/lib/Renderer.js.map +1 -1
  13. package/dist/module/lib/types.js +2 -0
  14. package/dist/module/lib/types.js.map +1 -0
  15. package/dist/typescript/lib/Markdown.d.ts +2 -8
  16. package/dist/typescript/lib/Parser.d.ts +2 -6
  17. package/dist/typescript/lib/Renderer.d.ts +7 -8
  18. package/dist/typescript/lib/types.d.ts +14 -0
  19. package/package.json +3 -3
  20. package/src/lib/Markdown.tsx +2 -11
  21. package/src/lib/Parser.tsx +21 -28
  22. package/src/lib/Renderer.tsx +10 -14
  23. package/src/lib/types.ts +25 -0
package/README.md CHANGED
@@ -1,6 +1,8 @@
1
1
  # react-native-marked
2
2
 
3
- Markdown renderer for React Native powered by [marked.js](https://marked.js.org/)
3
+ [![CI](https://github.com/gmsgowtham/react-native-marked/actions/workflows/build.yml/badge.svg)](https://github.com/gmsgowtham/react-native-marked/actions/workflows/build.yml)
4
+
5
+ Markdown renderer for React Native powered by [marked.js](https://marked.js.org/) with built-in theming support
4
6
 
5
7
  ## Installation
6
8
 
@@ -28,6 +30,12 @@ const ExampleComponent = () => {
28
30
  export default ExampleComponent;
29
31
  ```
30
32
 
33
+ ## Screenshots
34
+
35
+ | Dark Theme | Light Theme |
36
+ | :-------------------------------------------------------------------: | :---------------------------------------------------------------------: |
37
+ | ![Dark theme](assets/Screenshot_1662875200.png?raw=true 'Dark Theme') | ![Light theme](assets/Screenshot_1662875206.png?raw=true 'Light Theme') |
38
+
31
39
  ## Contributing
32
40
 
33
41
  See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.
@@ -42,5 +50,6 @@ Made with [create-react-native-library](https://github.com/callstack/react-nativ
42
50
 
43
51
  ## External Libraries
44
52
 
53
+ - [Marked](https://marked.js.org/)
45
54
  - [React Native Fit Image](https://github.com/huiseoul/react-native-fit-image)
46
55
  - [@jsamr/react-native-li](https://github.com/jsamr/react-native-li)
package/dist/commonjs/lib/Markdown.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["Markdown","value","flatListProps","styles","userStyles","systemTheme","useColorScheme","useMemo","getStyles","rnElements","parser","Parser","tokens","marked","lexer","trim","parse","renderItem","useCallback","item","keyExtractor","_","index","toString","container","memo"],"sources":["Markdown.tsx"],"sourcesContent":["import React, { memo, ReactNode, useCallback, useMemo } from 'react';\nimport { FlatList, FlatListProps, useColorScheme } from 'react-native';\nimport { marked } from 'marked';\nimport Parser from './Parser';\nimport getStyles from '../theme/styles';\nimport type { MarkedStyles } from '../theme/types';\n\ninterface MarkdownProps {\n value: string;\n flatListProps?: Omit<\n FlatListProps<ReactNode>,\n 'data' | 'renderItem' | 'horizontal'\n >;\n styles?: MarkedStyles;\n}\n\nconst Markdown = ({\n value,\n flatListProps,\n styles: userStyles,\n}: MarkdownProps) => {\n const systemTheme = useColorScheme();\n const styles = useMemo(\n () => getStyles(userStyles, systemTheme),\n [userStyles, systemTheme]\n );\n\n const rnElements = useMemo(() => {\n const parser = new Parser({\n styles,\n });\n const tokens = marked.lexer(value.trim());\n\n return parser.parse(tokens);\n }, [value, styles]);\n\n const renderItem = useCallback(({ item }: { item: ReactNode }) => {\n return <>{item}</>;\n }, []);\n\n const keyExtractor = useCallback((_, index) => index.toString(), []);\n\n return (\n <FlatList\n keyExtractor={keyExtractor}\n maxToRenderPerBatch={8}\n initialNumToRender={8}\n removeClippedSubviews\n style={styles.container}\n {...flatListProps}\n data={rnElements}\n renderItem={renderItem}\n />\n );\n};\n\nexport default memo(Markdown);\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAYA,MAAMA,QAAQ,GAAG,QAII;EAAA,IAJH;IAChBC,KADgB;IAEhBC,aAFgB;IAGhBC,MAAM,EAAEC;EAHQ,CAIG;EACnB,MAAMC,WAAW,GAAG,IAAAC,2BAAA,GAApB;EACA,MAAMH,MAAM,GAAG,IAAAI,cAAA,EACb,MAAM,IAAAC,eAAA,EAAUJ,UAAV,EAAsBC,WAAtB,CADO,EAEb,CAACD,UAAD,EAAaC,WAAb,CAFa,CAAf;EAKA,MAAMI,UAAU,GAAG,IAAAF,cAAA,EAAQ,MAAM;IAC/B,MAAMG,MAAM,GAAG,IAAIC,eAAJ,CAAW;MACxBR;IADwB,CAAX,CAAf;;IAGA,MAAMS,MAAM,GAAGC,cAAA,CAAOC,KAAP,CAAab,KAAK,CAACc,IAAN,EAAb,CAAf;;IAEA,OAAOL,MAAM,CAACM,KAAP,CAAaJ,MAAb,CAAP;EACD,CAPkB,EAOhB,CAACX,KAAD,EAAQE,MAAR,CAPgB,CAAnB;EASA,MAAMc,UAAU,GAAG,IAAAC,kBAAA,EAAY,SAAmC;IAAA,IAAlC;MAAEC;IAAF,CAAkC;IAChE,oBAAO,4DAAGA,IAAH,CAAP;EACD,CAFkB,EAEhB,EAFgB,CAAnB;EAIA,MAAMC,YAAY,GAAG,IAAAF,kBAAA,EAAY,CAACG,CAAD,EAAIC,KAAJ,KAAcA,KAAK,CAACC,QAAN,EAA1B,EAA4C,EAA5C,CAArB;EAEA,oBACE,6BAAC,qBAAD;IACE,YAAY,EAAEH,YADhB;IAEE,mBAAmB,EAAE,CAFvB;IAGE,kBAAkB,EAAE,CAHtB;IAIE,qBAAqB,MAJvB;IAKE,KAAK,EAAEjB,MAAM,CAACqB;EALhB,GAMMtB,aANN;IAOE,IAAI,EAAEO,UAPR;IAQE,UAAU,EAAEQ;EARd,GADF;AAYD,CAtCD;;4BAwCe,IAAAQ,WAAA,EAAKzB,QAAL,C"}
1
+ {"version":3,"names":["Markdown","value","flatListProps","styles","userStyles","systemTheme","useColorScheme","useMemo","getStyles","rnElements","parser","Parser","tokens","marked","lexer","trim","parse","renderItem","useCallback","item","keyExtractor","_","index","toString","container","memo"],"sources":["Markdown.tsx"],"sourcesContent":["import React, { memo, ReactNode, useCallback, useMemo } from 'react';\nimport { FlatList, useColorScheme } from 'react-native';\nimport { marked } from 'marked';\nimport Parser from './Parser';\nimport getStyles from '../theme/styles';\nimport type { MarkdownProps } from './types';\n\nconst Markdown = ({\n value,\n flatListProps,\n styles: userStyles,\n}: MarkdownProps) => {\n const systemTheme = useColorScheme();\n const styles = useMemo(\n () => getStyles(userStyles, systemTheme),\n [userStyles, systemTheme]\n );\n\n const rnElements = useMemo(() => {\n const parser = new Parser({\n styles,\n });\n const tokens = marked.lexer(value.trim());\n\n return parser.parse(tokens);\n }, [value, styles]);\n\n const renderItem = useCallback(({ item }: { item: ReactNode }) => {\n return <>{item}</>;\n }, []);\n\n const keyExtractor = useCallback((_, index) => index.toString(), []);\n\n return (\n <FlatList\n keyExtractor={keyExtractor}\n maxToRenderPerBatch={8}\n initialNumToRender={8}\n removeClippedSubviews\n style={styles.container}\n {...flatListProps}\n data={rnElements}\n renderItem={renderItem}\n />\n );\n};\n\nexport default memo(Markdown);\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAGA,MAAMA,QAAQ,GAAG,QAII;EAAA,IAJH;IAChBC,KADgB;IAEhBC,aAFgB;IAGhBC,MAAM,EAAEC;EAHQ,CAIG;EACnB,MAAMC,WAAW,GAAG,IAAAC,2BAAA,GAApB;EACA,MAAMH,MAAM,GAAG,IAAAI,cAAA,EACb,MAAM,IAAAC,eAAA,EAAUJ,UAAV,EAAsBC,WAAtB,CADO,EAEb,CAACD,UAAD,EAAaC,WAAb,CAFa,CAAf;EAKA,MAAMI,UAAU,GAAG,IAAAF,cAAA,EAAQ,MAAM;IAC/B,MAAMG,MAAM,GAAG,IAAIC,eAAJ,CAAW;MACxBR;IADwB,CAAX,CAAf;;IAGA,MAAMS,MAAM,GAAGC,cAAA,CAAOC,KAAP,CAAab,KAAK,CAACc,IAAN,EAAb,CAAf;;IAEA,OAAOL,MAAM,CAACM,KAAP,CAAaJ,MAAb,CAAP;EACD,CAPkB,EAOhB,CAACX,KAAD,EAAQE,MAAR,CAPgB,CAAnB;EASA,MAAMc,UAAU,GAAG,IAAAC,kBAAA,EAAY,SAAmC;IAAA,IAAlC;MAAEC;IAAF,CAAkC;IAChE,oBAAO,4DAAGA,IAAH,CAAP;EACD,CAFkB,EAEhB,EAFgB,CAAnB;EAIA,MAAMC,YAAY,GAAG,IAAAF,kBAAA,EAAY,CAACG,CAAD,EAAIC,KAAJ,KAAcA,KAAK,CAACC,QAAN,EAA1B,EAA4C,EAA5C,CAArB;EAEA,oBACE,6BAAC,qBAAD;IACE,YAAY,EAAEH,YADhB;IAEE,mBAAmB,EAAE,CAFvB;IAGE,kBAAkB,EAAE,CAHtB;IAIE,qBAAqB,MAJvB;IAKE,KAAK,EAAEjB,MAAM,CAACqB;EALhB,GAMMtB,aANN;IAOE,IAAI,EAAEO,UAPR;IAQE,UAAU,EAAEQ;EARd,GADF;AAYD,CAtCD;;4BAwCe,IAAAQ,WAAA,EAAKzB,QAAL,C"}
package/dist/commonjs/lib/Parser.js CHANGED
@@ -45,6 +45,7 @@ class Parser {
45
45
  let tempTokens = [];
46
46
  const paragraphChildren = [];
47
47
  token.tokens.forEach(t => {
48
+ /* To avoid inlining of image */
48
49
  if (t.type === 'image') {
49
50
  paragraphChildren.push(this.renderer.getTextNode(this.parseInline(tempTokens), this.styles.text));
50
51
  paragraphChildren.push(this.parseInline([t]));
@@ -101,6 +102,11 @@ class Parser {
101
102
  return this.renderer.getListNode(token.ordered, li, this.styles.list, this.styles.li);
102
103
  }
103
104
 
105
+ case 'html':
106
+ {
107
+ return this.renderer.getTextNode(token.text.trim(), this.styles.text);
108
+ }
109
+
104
110
  default:
105
111
  console.warn(`Token with '${token.type}' type was not found.`);
106
112
  return null;
@@ -109,26 +115,23 @@ class Parser {
109
115
  return elements;
110
116
  }
111
117
 
112
- parseInline(tokens) {
113
- let styles = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
118
+ parseInline(tokens, styles) {
114
119
  const elements = tokens.map(token => {
115
120
  if (!token) return null;
116
121
 
117
122
  switch (token.type) {
118
123
  case 'escape':
119
124
  {
120
- return this.renderer.getTextNode(token.text, [styles, this.styles.text]);
121
- }
122
-
123
- case 'html':
124
- {
125
- console.log('html', token);
126
- return null;
125
+ return this.renderer.getTextNode(token.text, { ...styles,
126
+ ...this.styles.text
127
+ });
127
128
  }
128
129
 
129
130
  case 'link':
130
131
  {
131
- return this.renderer.getLinkNode(token.text, token.href, [styles, this.styles.link]);
132
+ return this.renderer.getLinkNode(token.text, token.href, { ...styles,
133
+ ...this.styles.link
134
+ });
132
135
  }
133
136
 
134
137
  case 'image':
@@ -138,12 +141,16 @@ class Parser {
138
141
 
139
142
  case 'strong':
140
143
  {
141
- return this.renderer.getTextNode(this.parseInline(token.tokens, this.styles.strong), [styles, this.styles.strong]);
144
+ return this.renderer.getTextNode(this.parseInline(token.tokens, this.styles.strong), { ...styles,
145
+ ...this.styles.strong
146
+ });
142
147
  }
143
148
 
144
149
  case 'em':
145
150
  {
146
- return this.renderer.getTextNode(this.parseInline(token.tokens, this.styles.em), [styles, this.styles.em]);
151
+ return this.renderer.getTextNode(this.parseInline(token.tokens, this.styles.em), { ...styles,
152
+ ...this.styles.em
153
+ });
147
154
  }
148
155
 
149
156
  case 'codespan':
@@ -163,7 +170,9 @@ class Parser {
163
170
 
164
171
  case 'text':
165
172
  {
166
- return this.renderer.getTextNode(token.raw, [styles, this.styles.text]);
173
+ return this.renderer.getTextNode(token.raw, { ...styles,
174
+ ...this.styles.text
175
+ });
167
176
  }
168
177
 
169
178
  default:
package/dist/commonjs/lib/Parser.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["Parser","constructor","options","styles","renderer","Renderer","headingStylesMap","h1","h2","h3","h4","h5","h6","parse","tokens","elements","map","token","type","tempTokens","paragraphChildren","forEach","t","push","getTextNode","parseInline","text","length","getViewNode","paragraph","getBlockquoteNode","blockquote","depth","getCodeBlockNode","code","em","hr","li","items","item","Array","isArray","getListNode","ordered","list","console","warn","log","getLinkNode","href","link","getImageNode","strong","codespan","raw"],"sources":["Parser.tsx"],"sourcesContent":["import type { marked } from 'marked';\nimport type { ImageStyle, StyleProp, TextStyle, ViewStyle } from 'react-native';\nimport Renderer from './Renderer';\nimport type { MarkedStyles } from '../theme/types';\n\ninterface ParserOptions {\n styles?: MarkedStyles;\n}\n\nclass Parser {\n private renderer;\n private styles: MarkedStyles;\n private headingStylesMap: Record<number, TextStyle | undefined>;\n constructor(options: ParserOptions) {\n this.styles = { ...options.styles };\n this.renderer = new Renderer();\n this.headingStylesMap = {\n 1: this.styles.h1,\n 2: this.styles.h2,\n 3: this.styles.h3,\n 4: this.styles.h4,\n 5: this.styles.h5,\n 6: this.styles.h6,\n };\n }\n\n parse(tokens: marked.Token[]) {\n const elements: React.ReactNode[] = tokens.map((token) => {\n switch (token.type) {\n case 'space': {\n return null;\n }\n case 'paragraph': {\n let tempTokens: marked.Token[] = [];\n const paragraphChildren: React.ReactNode[] = [];\n token.tokens.forEach((t) => {\n if (t.type === 'image') {\n paragraphChildren.push(\n this.renderer.getTextNode(\n this.parseInline(tempTokens),\n this.styles.text\n )\n );\n paragraphChildren.push(this.parseInline([t]));\n tempTokens = [];\n return;\n }\n tempTokens = [...tempTokens, t];\n });\n\n if (tempTokens.length > 0) {\n paragraphChildren.push(\n this.renderer.getTextNode(this.parseInline(tempTokens), {})\n );\n }\n\n return this.renderer.getViewNode(\n paragraphChildren,\n this.styles.paragraph\n );\n }\n case 'blockquote': {\n return this.renderer.getBlockquoteNode(\n this.parse(token.tokens),\n this.styles.blockquote\n );\n }\n case 'heading': {\n const styles = this.headingStylesMap[token.depth] ?? this.styles.text;\n return this.renderer.getTextNode(token.text, styles);\n }\n case 'code': {\n return this.renderer.getCodeBlockNode(\n token.text,\n this.styles.code,\n this.styles.em\n );\n }\n case 'hr': {\n return this.renderer.getViewNode(null, this.styles.hr);\n }\n case 'list': {\n const li = token.items.map((item) => {\n if (\n item.tokens.length > 0 &&\n item.tokens[0]?.type === 'text' &&\n // @ts-ignore\n Array.isArray(item.tokens[0]?.tokens)\n ) {\n return this.renderer.getTextNode(\n // @ts-ignore\n this.parseInline(item.tokens[0]?.tokens),\n this.styles.li\n );\n }\n return this.renderer.getTextNode(item.text, this.styles.li);\n });\n return this.renderer.getListNode(\n token.ordered,\n li,\n this.styles.list,\n this.styles.li\n );\n }\n default:\n console.warn(`Token with '${token.type}' type was not found.`);\n return null;\n }\n });\n return elements;\n }\n\n parseInline(\n tokens: marked.Token[],\n styles: StyleProp<ViewStyle | TextStyle | ImageStyle> = {}\n ) {\n const elements: React.ReactNode[] = tokens.map((token) => {\n if (!token) return null;\n\n switch (token.type) {\n case 'escape': {\n return this.renderer.getTextNode(token.text, [\n styles,\n this.styles.text,\n ]);\n }\n case 'html': {\n console.log('html', token);\n return null;\n }\n case 'link': {\n return this.renderer.getLinkNode(token.text, token.href, [\n styles,\n this.styles.link,\n ]);\n }\n case 'image': {\n return this.renderer.getImageNode(token.href);\n }\n case 'strong': {\n return this.renderer.getTextNode(\n this.parseInline(token.tokens, this.styles.strong),\n [styles, this.styles.strong]\n );\n }\n case 'em': {\n return this.renderer.getTextNode(\n this.parseInline(token.tokens, this.styles.em),\n [styles, this.styles.em]\n );\n }\n case 'codespan': {\n return this.renderer.getTextNode(token.text, this.styles.codespan);\n }\n case 'br': {\n return this.renderer.getTextNode('\\n', {});\n }\n case 'del': {\n return null;\n }\n case 'text': {\n return this.renderer.getTextNode(token.raw, [\n styles,\n this.styles.text,\n ]);\n }\n default: {\n console.warn(`Token with '${token.type}' type was not found.`);\n return null;\n }\n }\n });\n return elements;\n }\n}\n\nexport default Parser;\n"],"mappings":"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"}
1
+ {"version":3,"names":["Parser","constructor","options","styles","renderer","Renderer","headingStylesMap","h1","h2","h3","h4","h5","h6","parse","tokens","elements","map","token","type","tempTokens","paragraphChildren","forEach","t","push","getTextNode","parseInline","text","length","getViewNode","paragraph","getBlockquoteNode","blockquote","depth","getCodeBlockNode","code","em","hr","li","items","item","Array","isArray","getListNode","ordered","list","trim","console","warn","getLinkNode","href","link","getImageNode","strong","codespan","raw"],"sources":["Parser.tsx"],"sourcesContent":["import type { marked } from 'marked';\nimport Renderer from './Renderer';\nimport type { MarkedStyles } from '../theme/types';\nimport type { CustomStyleProp, ParserOptions, TextStyleProp } from './types';\n\nclass Parser {\n private renderer;\n private styles: MarkedStyles;\n private headingStylesMap: Record<number, TextStyleProp>;\n constructor(options: ParserOptions) {\n this.styles = { ...options.styles };\n this.renderer = new Renderer();\n this.headingStylesMap = {\n 1: this.styles.h1,\n 2: this.styles.h2,\n 3: this.styles.h3,\n 4: this.styles.h4,\n 5: this.styles.h5,\n 6: this.styles.h6,\n };\n }\n\n parse(tokens: marked.Token[]) {\n const elements: React.ReactNode[] = tokens.map((token) => {\n switch (token.type) {\n case 'space': {\n return null;\n }\n case 'paragraph': {\n let tempTokens: marked.Token[] = [];\n const paragraphChildren: React.ReactNode[] = [];\n token.tokens.forEach((t) => {\n /* To avoid inlining of image */\n if (t.type === 'image') {\n paragraphChildren.push(\n this.renderer.getTextNode(\n this.parseInline(tempTokens),\n this.styles.text\n )\n );\n paragraphChildren.push(this.parseInline([t]));\n tempTokens = [];\n return;\n }\n tempTokens = [...tempTokens, t];\n });\n\n if (tempTokens.length > 0) {\n paragraphChildren.push(\n this.renderer.getTextNode(this.parseInline(tempTokens), {})\n );\n }\n\n return this.renderer.getViewNode(\n paragraphChildren,\n this.styles.paragraph\n );\n }\n case 'blockquote': {\n return this.renderer.getBlockquoteNode(\n this.parse(token.tokens),\n this.styles.blockquote\n );\n }\n case 'heading': {\n const styles = this.headingStylesMap[token.depth] ?? this.styles.text;\n return this.renderer.getTextNode(token.text, styles);\n }\n case 'code': {\n return this.renderer.getCodeBlockNode(\n token.text,\n this.styles.code,\n this.styles.em\n );\n }\n case 'hr': {\n return this.renderer.getViewNode(null, this.styles.hr);\n }\n case 'list': {\n const li = token.items.map((item) => {\n if (\n item.tokens.length > 0 &&\n item.tokens[0]?.type === 'text' &&\n // @ts-ignore\n Array.isArray(item.tokens[0]?.tokens)\n ) {\n return this.renderer.getTextNode(\n // @ts-ignore\n this.parseInline(item.tokens[0]?.tokens),\n this.styles.li\n );\n }\n return this.renderer.getTextNode(item.text, this.styles.li);\n });\n return this.renderer.getListNode(\n token.ordered,\n li,\n this.styles.list,\n this.styles.li\n );\n }\n case 'html': {\n return this.renderer.getTextNode(token.text.trim(), this.styles.text);\n }\n default:\n console.warn(`Token with '${token.type}' type was not found.`);\n return null;\n }\n });\n return elements;\n }\n\n parseInline(tokens: marked.Token[], styles?: CustomStyleProp) {\n const elements: React.ReactNode[] = tokens.map((token) => {\n if (!token) return null;\n\n switch (token.type) {\n case 'escape': {\n return this.renderer.getTextNode(token.text, {\n ...styles,\n ...this.styles.text,\n });\n }\n case 'link': {\n return this.renderer.getLinkNode(token.text, token.href, {\n ...styles,\n ...this.styles.link,\n });\n }\n case 'image': {\n return this.renderer.getImageNode(token.href);\n }\n case 'strong': {\n return this.renderer.getTextNode(\n this.parseInline(token.tokens, this.styles.strong),\n { ...styles, ...this.styles.strong }\n );\n }\n case 'em': {\n return this.renderer.getTextNode(\n this.parseInline(token.tokens, this.styles.em),\n { ...styles, ...this.styles.em }\n );\n }\n case 'codespan': {\n return this.renderer.getTextNode(token.text, this.styles.codespan);\n }\n case 'br': {\n return this.renderer.getTextNode('\\n', {});\n }\n case 'del': {\n return null;\n }\n case 'text': {\n return this.renderer.getTextNode(token.raw, {\n ...styles,\n ...this.styles.text,\n });\n }\n default: {\n console.warn(`Token with '${token.type}' type was not found.`);\n return null;\n }\n }\n });\n return elements;\n }\n}\n\nexport default Parser;\n"],"mappings":"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"}
package/dist/commonjs/lib/Renderer.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["Renderer","href","Linking","openURL","children","styles","generateRandomString","text","onLinkPress","getViewNode","getCodeBlockNode","containerStyle","textStyle","getBlockquoteNode","getImageNode","uri","getListNode","ordered","li","listStyle","Decimal","Disc","map","node"],"sources":["Renderer.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Linking, ScrollView, View, ViewStyle } from 'react-native';\nimport { Text, StyleProp, TextStyle } from 'react-native';\nimport MarkedList from '@jsamr/react-native-li';\nimport Disc from '@jsamr/counter-style/presets/disc';\nimport Decimal from '@jsamr/counter-style/presets/decimal';\nimport MDImage from './../components/MDImage';\n\nimport { generateRandomString } from '../utils/string';\n\nclass Renderer {\n private onLinkPress = (href: string) => () => Linking.openURL(href);\n\n getTextNode = (\n children: string | React.ReactNode[],\n styles: StyleProp<TextStyle>\n ) => {\n return (\n <Text key={generateRandomString()} style={styles}>\n {children}\n </Text>\n );\n };\n\n getLinkNode = (text: string, href: string, styles: StyleProp<TextStyle>) => {\n return (\n <Text\n key={generateRandomString()}\n onPress={this.onLinkPress(href)}\n style={styles}\n >\n {text}\n </Text>\n );\n };\n\n getViewNode(\n children: React.ReactNode[] | null,\n styles: StyleProp<ViewStyle>\n ) {\n return (\n <View key={generateRandomString()} style={styles}>\n {children}\n </View>\n );\n }\n\n getCodeBlockNode(\n text: string,\n containerStyle: StyleProp<ViewStyle>,\n textStyle: StyleProp<TextStyle>\n ) {\n return (\n <ScrollView contentContainerStyle={containerStyle} horizontal>\n <Text style={textStyle}>{text}</Text>\n </ScrollView>\n );\n }\n\n getBlockquoteNode(children: React.ReactNode[], styles: StyleProp<ViewStyle>) {\n return (\n <View key={generateRandomString()} style={styles}>\n {children}\n </View>\n );\n }\n\n getImageNode(uri: string) {\n return <MDImage key={generateRandomString()} uri={uri} />;\n }\n\n getListNode(\n ordered: boolean,\n li: React.ReactNode[],\n listStyle: ViewStyle | undefined,\n textStyle: TextStyle | undefined\n ) {\n return (\n <MarkedList\n counterRenderer={ordered ? Decimal : Disc}\n markerTextStyle={textStyle}\n markerBoxStyle={listStyle}\n >\n {li.map((node) => node)}\n </MarkedList>\n );\n }\n}\n\nexport default Renderer;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AAEA;;;;;;;;;;AAEA,MAAMA,QAAN,CAAe;EAAA;IAAA,qCACUC,IAAD,IAAkB,MAAMC,oBAAA,CAAQC,OAAR,CAAgBF,IAAhB,CADjC;;IAAA,qCAGC,CACZG,QADY,EAEZC,MAFY,KAGT;MACH,oBACE,oBAAC,iBAAD;QAAM,GAAG,EAAE,IAAAC,4BAAA,GAAX;QAAmC,KAAK,EAAED;MAA1C,GACGD,QADH,CADF;IAKD,CAZY;;IAAA,qCAcC,CAACG,IAAD,EAAeN,IAAf,EAA6BI,MAA7B,KAA8D;MAC1E,oBACE,oBAAC,iBAAD;QACE,GAAG,EAAE,IAAAC,4BAAA,GADP;QAEE,OAAO,EAAE,KAAKE,WAAL,CAAiBP,IAAjB,CAFX;QAGE,KAAK,EAAEI;MAHT,GAKGE,IALH,CADF;IASD,CAxBY;EAAA;;EA0BbE,WAAW,CACTL,QADS,EAETC,MAFS,EAGT;IACA,oBACE,oBAAC,iBAAD;MAAM,GAAG,EAAE,IAAAC,4BAAA,GAAX;MAAmC,KAAK,EAAED;IAA1C,GACGD,QADH,CADF;EAKD;;EAEDM,gBAAgB,CACdH,IADc,EAEdI,cAFc,EAGdC,SAHc,EAId;IACA,oBACE,oBAAC,uBAAD;MAAY,qBAAqB,EAAED,cAAnC;MAAmD,UAAU;IAA7D,gBACE,oBAAC,iBAAD;MAAM,KAAK,EAAEC;IAAb,GAAyBL,IAAzB,CADF,CADF;EAKD;;EAEDM,iBAAiB,CAACT,QAAD,EAA8BC,MAA9B,EAA4D;IAC3E,oBACE,oBAAC,iBAAD;MAAM,GAAG,EAAE,IAAAC,4BAAA,GAAX;MAAmC,KAAK,EAAED;IAA1C,GACGD,QADH,CADF;EAKD;;EAEDU,YAAY,CAACC,GAAD,EAAc;IACxB,oBAAO,oBAAC,gBAAD;MAAS,GAAG,EAAE,IAAAT,4BAAA,GAAd;MAAsC,GAAG,EAAES;IAA3C,EAAP;EACD;;EAEDC,WAAW,CACTC,OADS,EAETC,EAFS,EAGTC,SAHS,EAITP,SAJS,EAKT;IACA,oBACE,oBAAC,sBAAD;MACE,eAAe,EAAEK,OAAO,GAAGG,gBAAH,GAAaC,aADvC;MAEE,eAAe,EAAET,SAFnB;MAGE,cAAc,EAAEO;IAHlB,GAKGD,EAAE,CAACI,GAAH,CAAQC,IAAD,IAAUA,IAAjB,CALH,CADF;EASD;;AA5EY;;eA+EAvB,Q"}
1
+ {"version":3,"names":["Renderer","href","Linking","openURL","children","styles","generateRandomString","text","onLinkPress","getViewNode","getCodeBlockNode","containerStyle","textStyle","getBlockquoteNode","getImageNode","uri","getListNode","ordered","li","listStyle","Decimal","Disc","map","node"],"sources":["Renderer.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Linking, ScrollView, View, Text } from 'react-native';\nimport MarkedList from '@jsamr/react-native-li';\nimport Disc from '@jsamr/counter-style/presets/disc';\nimport Decimal from '@jsamr/counter-style/presets/decimal';\nimport MDImage from './../components/MDImage';\nimport { generateRandomString } from '../utils/string';\nimport type { TextStyleProp, ViewStyleProp } from './types';\n\nclass Renderer {\n private onLinkPress = (href: string) => () => Linking.openURL(href);\n\n getTextNode = (\n children: string | React.ReactNode[],\n styles: TextStyleProp\n ) => {\n return (\n <Text key={generateRandomString()} style={styles}>\n {children}\n </Text>\n );\n };\n\n getLinkNode = (text: string, href: string, styles: TextStyleProp) => {\n return (\n <Text\n key={generateRandomString()}\n onPress={this.onLinkPress(href)}\n style={styles}\n >\n {text}\n </Text>\n );\n };\n\n getViewNode(children: React.ReactNode[] | null, styles: ViewStyleProp) {\n return (\n <View key={generateRandomString()} style={styles}>\n {children}\n </View>\n );\n }\n\n getCodeBlockNode(\n text: string,\n containerStyle: ViewStyleProp,\n textStyle: TextStyleProp\n ) {\n return (\n <ScrollView contentContainerStyle={containerStyle} horizontal>\n <Text style={textStyle}>{text}</Text>\n </ScrollView>\n );\n }\n\n getBlockquoteNode(children: React.ReactNode[], styles: ViewStyleProp) {\n return (\n <View key={generateRandomString()} style={styles}>\n {children}\n </View>\n );\n }\n\n getImageNode(uri: string) {\n return <MDImage key={generateRandomString()} uri={uri} />;\n }\n\n getListNode(\n ordered: boolean,\n li: React.ReactNode[],\n listStyle: ViewStyleProp,\n textStyle: TextStyleProp\n ) {\n return (\n <MarkedList\n counterRenderer={ordered ? Decimal : Disc}\n markerTextStyle={textStyle}\n markerBoxStyle={listStyle}\n >\n {li.map((node) => node)}\n </MarkedList>\n );\n }\n}\n\nexport default Renderer;\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAGA,MAAMA,QAAN,CAAe;EAAA;IAAA,qCACUC,IAAD,IAAkB,MAAMC,oBAAA,CAAQC,OAAR,CAAgBF,IAAhB,CADjC;;IAAA,qCAGC,CACZG,QADY,EAEZC,MAFY,KAGT;MACH,oBACE,oBAAC,iBAAD;QAAM,GAAG,EAAE,IAAAC,4BAAA,GAAX;QAAmC,KAAK,EAAED;MAA1C,GACGD,QADH,CADF;IAKD,CAZY;;IAAA,qCAcC,CAACG,IAAD,EAAeN,IAAf,EAA6BI,MAA7B,KAAuD;MACnE,oBACE,oBAAC,iBAAD;QACE,GAAG,EAAE,IAAAC,4BAAA,GADP;QAEE,OAAO,EAAE,KAAKE,WAAL,CAAiBP,IAAjB,CAFX;QAGE,KAAK,EAAEI;MAHT,GAKGE,IALH,CADF;IASD,CAxBY;EAAA;;EA0BbE,WAAW,CAACL,QAAD,EAAqCC,MAArC,EAA4D;IACrE,oBACE,oBAAC,iBAAD;MAAM,GAAG,EAAE,IAAAC,4BAAA,GAAX;MAAmC,KAAK,EAAED;IAA1C,GACGD,QADH,CADF;EAKD;;EAEDM,gBAAgB,CACdH,IADc,EAEdI,cAFc,EAGdC,SAHc,EAId;IACA,oBACE,oBAAC,uBAAD;MAAY,qBAAqB,EAAED,cAAnC;MAAmD,UAAU;IAA7D,gBACE,oBAAC,iBAAD;MAAM,KAAK,EAAEC;IAAb,GAAyBL,IAAzB,CADF,CADF;EAKD;;EAEDM,iBAAiB,CAACT,QAAD,EAA8BC,MAA9B,EAAqD;IACpE,oBACE,oBAAC,iBAAD;MAAM,GAAG,EAAE,IAAAC,4BAAA,GAAX;MAAmC,KAAK,EAAED;IAA1C,GACGD,QADH,CADF;EAKD;;EAEDU,YAAY,CAACC,GAAD,EAAc;IACxB,oBAAO,oBAAC,gBAAD;MAAS,GAAG,EAAE,IAAAT,4BAAA,GAAd;MAAsC,GAAG,EAAES;IAA3C,EAAP;EACD;;EAEDC,WAAW,CACTC,OADS,EAETC,EAFS,EAGTC,SAHS,EAITP,SAJS,EAKT;IACA,oBACE,oBAAC,sBAAD;MACE,eAAe,EAAEK,OAAO,GAAGG,gBAAH,GAAaC,aADvC;MAEE,eAAe,EAAET,SAFnB;MAGE,cAAc,EAAEO;IAHlB,GAKGD,EAAE,CAACI,GAAH,CAAQC,IAAD,IAAUA,IAAjB,CALH,CADF;EASD;;AAzEY;;eA4EAvB,Q"}
package/dist/commonjs/lib/types.js ADDED
@@ -0,0 +1,6 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ //# sourceMappingURL=types.js.map
package/dist/commonjs/lib/types.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type {\n ImageStyle,\n TextStyle,\n ViewStyle,\n FlatListProps,\n} from 'react-native';\nimport type { MarkedStyles } from './../theme/types';\n\nexport type TextStyleProp = TextStyle | undefined;\nexport type ViewStyleProp = ViewStyle | undefined;\nexport type CustomStyleProp = ViewStyle | TextStyle | ImageStyle | undefined;\n\nexport interface ParserOptions {\n styles?: MarkedStyles;\n}\n\nexport interface MarkdownProps {\n value: string;\n flatListProps?: Omit<\n FlatListProps<ReactNode>,\n 'data' | 'renderItem' | 'horizontal'\n >;\n styles?: MarkedStyles;\n}\n"],"mappings":""}
package/dist/module/lib/Markdown.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["React","memo","useCallback","useMemo","FlatList","useColorScheme","marked","Parser","getStyles","Markdown","value","flatListProps","styles","userStyles","systemTheme","rnElements","parser","tokens","lexer","trim","parse","renderItem","item","keyExtractor","_","index","toString","container"],"sources":["Markdown.tsx"],"sourcesContent":["import React, { memo, ReactNode, useCallback, useMemo } from 'react';\nimport { FlatList, FlatListProps, useColorScheme } from 'react-native';\nimport { marked } from 'marked';\nimport Parser from './Parser';\nimport getStyles from '../theme/styles';\nimport type { MarkedStyles } from '../theme/types';\n\ninterface MarkdownProps {\n value: string;\n flatListProps?: Omit<\n FlatListProps<ReactNode>,\n 'data' | 'renderItem' | 'horizontal'\n >;\n styles?: MarkedStyles;\n}\n\nconst Markdown = ({\n value,\n flatListProps,\n styles: userStyles,\n}: MarkdownProps) => {\n const systemTheme = useColorScheme();\n const styles = useMemo(\n () => getStyles(userStyles, systemTheme),\n [userStyles, systemTheme]\n );\n\n const rnElements = useMemo(() => {\n const parser = new Parser({\n styles,\n });\n const tokens = marked.lexer(value.trim());\n\n return parser.parse(tokens);\n }, [value, styles]);\n\n const renderItem = useCallback(({ item }: { item: ReactNode }) => {\n return <>{item}</>;\n }, []);\n\n const keyExtractor = useCallback((_, index) => index.toString(), []);\n\n return (\n <FlatList\n keyExtractor={keyExtractor}\n maxToRenderPerBatch={8}\n initialNumToRender={8}\n removeClippedSubviews\n style={styles.container}\n {...flatListProps}\n data={rnElements}\n renderItem={renderItem}\n />\n );\n};\n\nexport default memo(Markdown);\n"],"mappings":";;AAAA,OAAOA,KAAP,IAAgBC,IAAhB,EAAiCC,WAAjC,EAA8CC,OAA9C,QAA6D,OAA7D;AACA,SAASC,QAAT,EAAkCC,cAAlC,QAAwD,cAAxD;AACA,SAASC,MAAT,QAAuB,QAAvB;AACA,OAAOC,MAAP,MAAmB,UAAnB;AACA,OAAOC,SAAP,MAAsB,iBAAtB;;AAYA,MAAMC,QAAQ,GAAG,QAII;EAAA,IAJH;IAChBC,KADgB;IAEhBC,aAFgB;IAGhBC,MAAM,EAAEC;EAHQ,CAIG;EACnB,MAAMC,WAAW,GAAGT,cAAc,EAAlC;EACA,MAAMO,MAAM,GAAGT,OAAO,CACpB,MAAMK,SAAS,CAACK,UAAD,EAAaC,WAAb,CADK,EAEpB,CAACD,UAAD,EAAaC,WAAb,CAFoB,CAAtB;EAKA,MAAMC,UAAU,GAAGZ,OAAO,CAAC,MAAM;IAC/B,MAAMa,MAAM,GAAG,IAAIT,MAAJ,CAAW;MACxBK;IADwB,CAAX,CAAf;IAGA,MAAMK,MAAM,GAAGX,MAAM,CAACY,KAAP,CAAaR,KAAK,CAACS,IAAN,EAAb,CAAf;IAEA,OAAOH,MAAM,CAACI,KAAP,CAAaH,MAAb,CAAP;EACD,CAPyB,EAOvB,CAACP,KAAD,EAAQE,MAAR,CAPuB,CAA1B;EASA,MAAMS,UAAU,GAAGnB,WAAW,CAAC,SAAmC;IAAA,IAAlC;MAAEoB;IAAF,CAAkC;IAChE,oBAAO,0CAAGA,IAAH,CAAP;EACD,CAF6B,EAE3B,EAF2B,CAA9B;EAIA,MAAMC,YAAY,GAAGrB,WAAW,CAAC,CAACsB,CAAD,EAAIC,KAAJ,KAAcA,KAAK,CAACC,QAAN,EAAf,EAAiC,EAAjC,CAAhC;EAEA,oBACE,oBAAC,QAAD;IACE,YAAY,EAAEH,YADhB;IAEE,mBAAmB,EAAE,CAFvB;IAGE,kBAAkB,EAAE,CAHtB;IAIE,qBAAqB,MAJvB;IAKE,KAAK,EAAEX,MAAM,CAACe;EALhB,GAMMhB,aANN;IAOE,IAAI,EAAEI,UAPR;IAQE,UAAU,EAAEM;EARd,GADF;AAYD,CAtCD;;AAwCA,4BAAepB,IAAI,CAACQ,QAAD,CAAnB"}
1
+ {"version":3,"names":["React","memo","useCallback","useMemo","FlatList","useColorScheme","marked","Parser","getStyles","Markdown","value","flatListProps","styles","userStyles","systemTheme","rnElements","parser","tokens","lexer","trim","parse","renderItem","item","keyExtractor","_","index","toString","container"],"sources":["Markdown.tsx"],"sourcesContent":["import React, { memo, ReactNode, useCallback, useMemo } from 'react';\nimport { FlatList, useColorScheme } from 'react-native';\nimport { marked } from 'marked';\nimport Parser from './Parser';\nimport getStyles from '../theme/styles';\nimport type { MarkdownProps } from './types';\n\nconst Markdown = ({\n value,\n flatListProps,\n styles: userStyles,\n}: MarkdownProps) => {\n const systemTheme = useColorScheme();\n const styles = useMemo(\n () => getStyles(userStyles, systemTheme),\n [userStyles, systemTheme]\n );\n\n const rnElements = useMemo(() => {\n const parser = new Parser({\n styles,\n });\n const tokens = marked.lexer(value.trim());\n\n return parser.parse(tokens);\n }, [value, styles]);\n\n const renderItem = useCallback(({ item }: { item: ReactNode }) => {\n return <>{item}</>;\n }, []);\n\n const keyExtractor = useCallback((_, index) => index.toString(), []);\n\n return (\n <FlatList\n keyExtractor={keyExtractor}\n maxToRenderPerBatch={8}\n initialNumToRender={8}\n removeClippedSubviews\n style={styles.container}\n {...flatListProps}\n data={rnElements}\n renderItem={renderItem}\n />\n );\n};\n\nexport default memo(Markdown);\n"],"mappings":";;AAAA,OAAOA,KAAP,IAAgBC,IAAhB,EAAiCC,WAAjC,EAA8CC,OAA9C,QAA6D,OAA7D;AACA,SAASC,QAAT,EAAmBC,cAAnB,QAAyC,cAAzC;AACA,SAASC,MAAT,QAAuB,QAAvB;AACA,OAAOC,MAAP,MAAmB,UAAnB;AACA,OAAOC,SAAP,MAAsB,iBAAtB;;AAGA,MAAMC,QAAQ,GAAG,QAII;EAAA,IAJH;IAChBC,KADgB;IAEhBC,aAFgB;IAGhBC,MAAM,EAAEC;EAHQ,CAIG;EACnB,MAAMC,WAAW,GAAGT,cAAc,EAAlC;EACA,MAAMO,MAAM,GAAGT,OAAO,CACpB,MAAMK,SAAS,CAACK,UAAD,EAAaC,WAAb,CADK,EAEpB,CAACD,UAAD,EAAaC,WAAb,CAFoB,CAAtB;EAKA,MAAMC,UAAU,GAAGZ,OAAO,CAAC,MAAM;IAC/B,MAAMa,MAAM,GAAG,IAAIT,MAAJ,CAAW;MACxBK;IADwB,CAAX,CAAf;IAGA,MAAMK,MAAM,GAAGX,MAAM,CAACY,KAAP,CAAaR,KAAK,CAACS,IAAN,EAAb,CAAf;IAEA,OAAOH,MAAM,CAACI,KAAP,CAAaH,MAAb,CAAP;EACD,CAPyB,EAOvB,CAACP,KAAD,EAAQE,MAAR,CAPuB,CAA1B;EASA,MAAMS,UAAU,GAAGnB,WAAW,CAAC,SAAmC;IAAA,IAAlC;MAAEoB;IAAF,CAAkC;IAChE,oBAAO,0CAAGA,IAAH,CAAP;EACD,CAF6B,EAE3B,EAF2B,CAA9B;EAIA,MAAMC,YAAY,GAAGrB,WAAW,CAAC,CAACsB,CAAD,EAAIC,KAAJ,KAAcA,KAAK,CAACC,QAAN,EAAf,EAAiC,EAAjC,CAAhC;EAEA,oBACE,oBAAC,QAAD;IACE,YAAY,EAAEH,YADhB;IAEE,mBAAmB,EAAE,CAFvB;IAGE,kBAAkB,EAAE,CAHtB;IAIE,qBAAqB,MAJvB;IAKE,KAAK,EAAEX,MAAM,CAACe;EALhB,GAMMhB,aANN;IAOE,IAAI,EAAEI,UAPR;IAQE,UAAU,EAAEM;EARd,GADF;AAYD,CAtCD;;AAwCA,4BAAepB,IAAI,CAACQ,QAAD,CAAnB"}
package/dist/module/lib/Parser.js CHANGED
@@ -36,6 +36,7 @@ class Parser {
36
36
  let tempTokens = [];
37
37
  const paragraphChildren = [];
38
38
  token.tokens.forEach(t => {
39
+ /* To avoid inlining of image */
39
40
  if (t.type === 'image') {
40
41
  paragraphChildren.push(this.renderer.getTextNode(this.parseInline(tempTokens), this.styles.text));
41
42
  paragraphChildren.push(this.parseInline([t]));
@@ -92,6 +93,11 @@ class Parser {
92
93
  return this.renderer.getListNode(token.ordered, li, this.styles.list, this.styles.li);
93
94
  }
94
95
 
96
+ case 'html':
97
+ {
98
+ return this.renderer.getTextNode(token.text.trim(), this.styles.text);
99
+ }
100
+
95
101
  default:
96
102
  console.warn(`Token with '${token.type}' type was not found.`);
97
103
  return null;
@@ -100,26 +106,23 @@ class Parser {
100
106
  return elements;
101
107
  }
102
108
 
103
- parseInline(tokens) {
104
- let styles = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
109
+ parseInline(tokens, styles) {
105
110
  const elements = tokens.map(token => {
106
111
  if (!token) return null;
107
112
 
108
113
  switch (token.type) {
109
114
  case 'escape':
110
115
  {
111
- return this.renderer.getTextNode(token.text, [styles, this.styles.text]);
112
- }
113
-
114
- case 'html':
115
- {
116
- console.log('html', token);
117
- return null;
116
+ return this.renderer.getTextNode(token.text, { ...styles,
117
+ ...this.styles.text
118
+ });
118
119
  }
119
120
 
120
121
  case 'link':
121
122
  {
122
- return this.renderer.getLinkNode(token.text, token.href, [styles, this.styles.link]);
123
+ return this.renderer.getLinkNode(token.text, token.href, { ...styles,
124
+ ...this.styles.link
125
+ });
123
126
  }
124
127
 
125
128
  case 'image':
@@ -129,12 +132,16 @@ class Parser {
129
132
 
130
133
  case 'strong':
131
134
  {
132
- return this.renderer.getTextNode(this.parseInline(token.tokens, this.styles.strong), [styles, this.styles.strong]);
135
+ return this.renderer.getTextNode(this.parseInline(token.tokens, this.styles.strong), { ...styles,
136
+ ...this.styles.strong
137
+ });
133
138
  }
134
139
 
135
140
  case 'em':
136
141
  {
137
- return this.renderer.getTextNode(this.parseInline(token.tokens, this.styles.em), [styles, this.styles.em]);
142
+ return this.renderer.getTextNode(this.parseInline(token.tokens, this.styles.em), { ...styles,
143
+ ...this.styles.em
144
+ });
138
145
  }
139
146
 
140
147
  case 'codespan':
@@ -154,7 +161,9 @@ class Parser {
154
161
 
155
162
  case 'text':
156
163
  {
157
- return this.renderer.getTextNode(token.raw, [styles, this.styles.text]);
164
+ return this.renderer.getTextNode(token.raw, { ...styles,
165
+ ...this.styles.text
166
+ });
158
167
  }
159
168
 
160
169
  default:
package/dist/module/lib/Parser.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["Renderer","Parser","constructor","options","styles","renderer","headingStylesMap","h1","h2","h3","h4","h5","h6","parse","tokens","elements","map","token","type","tempTokens","paragraphChildren","forEach","t","push","getTextNode","parseInline","text","length","getViewNode","paragraph","getBlockquoteNode","blockquote","depth","getCodeBlockNode","code","em","hr","li","items","item","Array","isArray","getListNode","ordered","list","console","warn","log","getLinkNode","href","link","getImageNode","strong","codespan","raw"],"sources":["Parser.tsx"],"sourcesContent":["import type { marked } from 'marked';\nimport type { ImageStyle, StyleProp, TextStyle, ViewStyle } from 'react-native';\nimport Renderer from './Renderer';\nimport type { MarkedStyles } from '../theme/types';\n\ninterface ParserOptions {\n styles?: MarkedStyles;\n}\n\nclass Parser {\n private renderer;\n private styles: MarkedStyles;\n private headingStylesMap: Record<number, TextStyle | undefined>;\n constructor(options: ParserOptions) {\n this.styles = { ...options.styles };\n this.renderer = new Renderer();\n this.headingStylesMap = {\n 1: this.styles.h1,\n 2: this.styles.h2,\n 3: this.styles.h3,\n 4: this.styles.h4,\n 5: this.styles.h5,\n 6: this.styles.h6,\n };\n }\n\n parse(tokens: marked.Token[]) {\n const elements: React.ReactNode[] = tokens.map((token) => {\n switch (token.type) {\n case 'space': {\n return null;\n }\n case 'paragraph': {\n let tempTokens: marked.Token[] = [];\n const paragraphChildren: React.ReactNode[] = [];\n token.tokens.forEach((t) => {\n if (t.type === 'image') {\n paragraphChildren.push(\n this.renderer.getTextNode(\n this.parseInline(tempTokens),\n this.styles.text\n )\n );\n paragraphChildren.push(this.parseInline([t]));\n tempTokens = [];\n return;\n }\n tempTokens = [...tempTokens, t];\n });\n\n if (tempTokens.length > 0) {\n paragraphChildren.push(\n this.renderer.getTextNode(this.parseInline(tempTokens), {})\n );\n }\n\n return this.renderer.getViewNode(\n paragraphChildren,\n this.styles.paragraph\n );\n }\n case 'blockquote': {\n return this.renderer.getBlockquoteNode(\n this.parse(token.tokens),\n this.styles.blockquote\n );\n }\n case 'heading': {\n const styles = this.headingStylesMap[token.depth] ?? this.styles.text;\n return this.renderer.getTextNode(token.text, styles);\n }\n case 'code': {\n return this.renderer.getCodeBlockNode(\n token.text,\n this.styles.code,\n this.styles.em\n );\n }\n case 'hr': {\n return this.renderer.getViewNode(null, this.styles.hr);\n }\n case 'list': {\n const li = token.items.map((item) => {\n if (\n item.tokens.length > 0 &&\n item.tokens[0]?.type === 'text' &&\n // @ts-ignore\n Array.isArray(item.tokens[0]?.tokens)\n ) {\n return this.renderer.getTextNode(\n // @ts-ignore\n this.parseInline(item.tokens[0]?.tokens),\n this.styles.li\n );\n }\n return this.renderer.getTextNode(item.text, this.styles.li);\n });\n return this.renderer.getListNode(\n token.ordered,\n li,\n this.styles.list,\n this.styles.li\n );\n }\n default:\n console.warn(`Token with '${token.type}' type was not found.`);\n return null;\n }\n });\n return elements;\n }\n\n parseInline(\n tokens: marked.Token[],\n styles: StyleProp<ViewStyle | TextStyle | ImageStyle> = {}\n ) {\n const elements: React.ReactNode[] = tokens.map((token) => {\n if (!token) return null;\n\n switch (token.type) {\n case 'escape': {\n return this.renderer.getTextNode(token.text, [\n styles,\n this.styles.text,\n ]);\n }\n case 'html': {\n console.log('html', token);\n return null;\n }\n case 'link': {\n return this.renderer.getLinkNode(token.text, token.href, [\n styles,\n this.styles.link,\n ]);\n }\n case 'image': {\n return this.renderer.getImageNode(token.href);\n }\n case 'strong': {\n return this.renderer.getTextNode(\n this.parseInline(token.tokens, this.styles.strong),\n [styles, this.styles.strong]\n );\n }\n case 'em': {\n return this.renderer.getTextNode(\n this.parseInline(token.tokens, this.styles.em),\n [styles, this.styles.em]\n );\n }\n case 'codespan': {\n return this.renderer.getTextNode(token.text, this.styles.codespan);\n }\n case 'br': {\n return this.renderer.getTextNode('\\n', {});\n }\n case 'del': {\n return null;\n }\n case 'text': {\n return this.renderer.getTextNode(token.raw, [\n styles,\n this.styles.text,\n ]);\n }\n default: {\n console.warn(`Token with '${token.type}' type was not found.`);\n return null;\n }\n }\n });\n return elements;\n }\n}\n\nexport default Parser;\n"],"mappings":"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"}
1
+ {"version":3,"names":["Renderer","Parser","constructor","options","styles","renderer","headingStylesMap","h1","h2","h3","h4","h5","h6","parse","tokens","elements","map","token","type","tempTokens","paragraphChildren","forEach","t","push","getTextNode","parseInline","text","length","getViewNode","paragraph","getBlockquoteNode","blockquote","depth","getCodeBlockNode","code","em","hr","li","items","item","Array","isArray","getListNode","ordered","list","trim","console","warn","getLinkNode","href","link","getImageNode","strong","codespan","raw"],"sources":["Parser.tsx"],"sourcesContent":["import type { marked } from 'marked';\nimport Renderer from './Renderer';\nimport type { MarkedStyles } from '../theme/types';\nimport type { CustomStyleProp, ParserOptions, TextStyleProp } from './types';\n\nclass Parser {\n private renderer;\n private styles: MarkedStyles;\n private headingStylesMap: Record<number, TextStyleProp>;\n constructor(options: ParserOptions) {\n this.styles = { ...options.styles };\n this.renderer = new Renderer();\n this.headingStylesMap = {\n 1: this.styles.h1,\n 2: this.styles.h2,\n 3: this.styles.h3,\n 4: this.styles.h4,\n 5: this.styles.h5,\n 6: this.styles.h6,\n };\n }\n\n parse(tokens: marked.Token[]) {\n const elements: React.ReactNode[] = tokens.map((token) => {\n switch (token.type) {\n case 'space': {\n return null;\n }\n case 'paragraph': {\n let tempTokens: marked.Token[] = [];\n const paragraphChildren: React.ReactNode[] = [];\n token.tokens.forEach((t) => {\n /* To avoid inlining of image */\n if (t.type === 'image') {\n paragraphChildren.push(\n this.renderer.getTextNode(\n this.parseInline(tempTokens),\n this.styles.text\n )\n );\n paragraphChildren.push(this.parseInline([t]));\n tempTokens = [];\n return;\n }\n tempTokens = [...tempTokens, t];\n });\n\n if (tempTokens.length > 0) {\n paragraphChildren.push(\n this.renderer.getTextNode(this.parseInline(tempTokens), {})\n );\n }\n\n return this.renderer.getViewNode(\n paragraphChildren,\n this.styles.paragraph\n );\n }\n case 'blockquote': {\n return this.renderer.getBlockquoteNode(\n this.parse(token.tokens),\n this.styles.blockquote\n );\n }\n case 'heading': {\n const styles = this.headingStylesMap[token.depth] ?? this.styles.text;\n return this.renderer.getTextNode(token.text, styles);\n }\n case 'code': {\n return this.renderer.getCodeBlockNode(\n token.text,\n this.styles.code,\n this.styles.em\n );\n }\n case 'hr': {\n return this.renderer.getViewNode(null, this.styles.hr);\n }\n case 'list': {\n const li = token.items.map((item) => {\n if (\n item.tokens.length > 0 &&\n item.tokens[0]?.type === 'text' &&\n // @ts-ignore\n Array.isArray(item.tokens[0]?.tokens)\n ) {\n return this.renderer.getTextNode(\n // @ts-ignore\n this.parseInline(item.tokens[0]?.tokens),\n this.styles.li\n );\n }\n return this.renderer.getTextNode(item.text, this.styles.li);\n });\n return this.renderer.getListNode(\n token.ordered,\n li,\n this.styles.list,\n this.styles.li\n );\n }\n case 'html': {\n return this.renderer.getTextNode(token.text.trim(), this.styles.text);\n }\n default:\n console.warn(`Token with '${token.type}' type was not found.`);\n return null;\n }\n });\n return elements;\n }\n\n parseInline(tokens: marked.Token[], styles?: CustomStyleProp) {\n const elements: React.ReactNode[] = tokens.map((token) => {\n if (!token) return null;\n\n switch (token.type) {\n case 'escape': {\n return this.renderer.getTextNode(token.text, {\n ...styles,\n ...this.styles.text,\n });\n }\n case 'link': {\n return this.renderer.getLinkNode(token.text, token.href, {\n ...styles,\n ...this.styles.link,\n });\n }\n case 'image': {\n return this.renderer.getImageNode(token.href);\n }\n case 'strong': {\n return this.renderer.getTextNode(\n this.parseInline(token.tokens, this.styles.strong),\n { ...styles, ...this.styles.strong }\n );\n }\n case 'em': {\n return this.renderer.getTextNode(\n this.parseInline(token.tokens, this.styles.em),\n { ...styles, ...this.styles.em }\n );\n }\n case 'codespan': {\n return this.renderer.getTextNode(token.text, this.styles.codespan);\n }\n case 'br': {\n return this.renderer.getTextNode('\\n', {});\n }\n case 'del': {\n return null;\n }\n case 'text': {\n return this.renderer.getTextNode(token.raw, {\n ...styles,\n ...this.styles.text,\n });\n }\n default: {\n console.warn(`Token with '${token.type}' type was not found.`);\n return null;\n }\n }\n });\n return elements;\n }\n}\n\nexport default Parser;\n"],"mappings":";;AACA,OAAOA,QAAP,MAAqB,YAArB;;AAIA,MAAMC,MAAN,CAAa;EAIXC,WAAW,CAACC,OAAD,EAAyB;IAAA;;IAAA;;IAAA;;IAClC,KAAKC,MAAL,GAAc,EAAE,GAAGD,OAAO,CAACC;IAAb,CAAd;IACA,KAAKC,QAAL,GAAgB,IAAIL,QAAJ,EAAhB;IACA,KAAKM,gBAAL,GAAwB;MACtB,GAAG,KAAKF,MAAL,CAAYG,EADO;MAEtB,GAAG,KAAKH,MAAL,CAAYI,EAFO;MAGtB,GAAG,KAAKJ,MAAL,CAAYK,EAHO;MAItB,GAAG,KAAKL,MAAL,CAAYM,EAJO;MAKtB,GAAG,KAAKN,MAAL,CAAYO,EALO;MAMtB,GAAG,KAAKP,MAAL,CAAYQ;IANO,CAAxB;EAQD;;EAEDC,KAAK,CAACC,MAAD,EAAyB;IAC5B,MAAMC,QAA2B,GAAGD,MAAM,CAACE,GAAP,CAAYC,KAAD,IAAW;MACxD,QAAQA,KAAK,CAACC,IAAd;QACE,KAAK,OAAL;UAAc;YACZ,OAAO,IAAP;UACD;;QACD,KAAK,WAAL;UAAkB;YAChB,IAAIC,UAA0B,GAAG,EAAjC;YACA,MAAMC,iBAAoC,GAAG,EAA7C;YACAH,KAAK,CAACH,MAAN,CAAaO,OAAb,CAAsBC,CAAD,IAAO;cAC1B;cACA,IAAIA,CAAC,CAACJ,IAAF,KAAW,OAAf,EAAwB;gBACtBE,iBAAiB,CAACG,IAAlB,CACE,KAAKlB,QAAL,CAAcmB,WAAd,CACE,KAAKC,WAAL,CAAiBN,UAAjB,CADF,EAEE,KAAKf,MAAL,CAAYsB,IAFd,CADF;gBAMAN,iBAAiB,CAACG,IAAlB,CAAuB,KAAKE,WAAL,CAAiB,CAACH,CAAD,CAAjB,CAAvB;gBACAH,UAAU,GAAG,EAAb;gBACA;cACD;;cACDA,UAAU,GAAG,CAAC,GAAGA,UAAJ,EAAgBG,CAAhB,CAAb;YACD,CAdD;;YAgBA,IAAIH,UAAU,CAACQ,MAAX,GAAoB,CAAxB,EAA2B;cACzBP,iBAAiB,CAACG,IAAlB,CACE,KAAKlB,QAAL,CAAcmB,WAAd,CAA0B,KAAKC,WAAL,CAAiBN,UAAjB,CAA1B,EAAwD,EAAxD,CADF;YAGD;;YAED,OAAO,KAAKd,QAAL,CAAcuB,WAAd,CACLR,iBADK,EAEL,KAAKhB,MAAL,CAAYyB,SAFP,CAAP;UAID;;QACD,KAAK,YAAL;UAAmB;YACjB,OAAO,KAAKxB,QAAL,CAAcyB,iBAAd,CACL,KAAKjB,KAAL,CAAWI,KAAK,CAACH,MAAjB,CADK,EAEL,KAAKV,MAAL,CAAY2B,UAFP,CAAP;UAID;;QACD,KAAK,SAAL;UAAgB;YACd,MAAM3B,MAAM,GAAG,KAAKE,gBAAL,CAAsBW,KAAK,CAACe,KAA5B,KAAsC,KAAK5B,MAAL,CAAYsB,IAAjE;YACA,OAAO,KAAKrB,QAAL,CAAcmB,WAAd,CAA0BP,KAAK,CAACS,IAAhC,EAAsCtB,MAAtC,CAAP;UACD;;QACD,KAAK,MAAL;UAAa;YACX,OAAO,KAAKC,QAAL,CAAc4B,gBAAd,CACLhB,KAAK,CAACS,IADD,EAEL,KAAKtB,MAAL,CAAY8B,IAFP,EAGL,KAAK9B,MAAL,CAAY+B,EAHP,CAAP;UAKD;;QACD,KAAK,IAAL;UAAW;YACT,OAAO,KAAK9B,QAAL,CAAcuB,WAAd,CAA0B,IAA1B,EAAgC,KAAKxB,MAAL,CAAYgC,EAA5C,CAAP;UACD;;QACD,KAAK,MAAL;UAAa;YACX,MAAMC,EAAE,GAAGpB,KAAK,CAACqB,KAAN,CAAYtB,GAAZ,CAAiBuB,IAAD,IAAU;cAAA;;cACnC,IACEA,IAAI,CAACzB,MAAL,CAAYa,MAAZ,GAAqB,CAArB,IACA,kBAAAY,IAAI,CAACzB,MAAL,CAAY,CAAZ,iEAAgBI,IAAhB,MAAyB,MADzB,IAEA;cACAsB,KAAK,CAACC,OAAN,mBAAcF,IAAI,CAACzB,MAAL,CAAY,CAAZ,CAAd,mDAAc,eAAgBA,MAA9B,CAJF,EAKE;gBAAA;;gBACA,OAAO,KAAKT,QAAL,CAAcmB,WAAd,EACL;gBACA,KAAKC,WAAL,mBAAiBc,IAAI,CAACzB,MAAL,CAAY,CAAZ,CAAjB,mDAAiB,eAAgBA,MAAjC,CAFK,EAGL,KAAKV,MAAL,CAAYiC,EAHP,CAAP;cAKD;;cACD,OAAO,KAAKhC,QAAL,CAAcmB,WAAd,CAA0Be,IAAI,CAACb,IAA/B,EAAqC,KAAKtB,MAAL,CAAYiC,EAAjD,CAAP;YACD,CAdU,CAAX;YAeA,OAAO,KAAKhC,QAAL,CAAcqC,WAAd,CACLzB,KAAK,CAAC0B,OADD,EAELN,EAFK,EAGL,KAAKjC,MAAL,CAAYwC,IAHP,EAIL,KAAKxC,MAAL,CAAYiC,EAJP,CAAP;UAMD;;QACD,KAAK,MAAL;UAAa;YACX,OAAO,KAAKhC,QAAL,CAAcmB,WAAd,CAA0BP,KAAK,CAACS,IAAN,CAAWmB,IAAX,EAA1B,EAA6C,KAAKzC,MAAL,CAAYsB,IAAzD,CAAP;UACD;;QACD;UACEoB,OAAO,CAACC,IAAR,CAAc,eAAc9B,KAAK,CAACC,IAAK,uBAAvC;UACA,OAAO,IAAP;MAlFJ;IAoFD,CArFmC,CAApC;IAsFA,OAAOH,QAAP;EACD;;EAEDU,WAAW,CAACX,MAAD,EAAyBV,MAAzB,EAAmD;IAC5D,MAAMW,QAA2B,GAAGD,MAAM,CAACE,GAAP,CAAYC,KAAD,IAAW;MACxD,IAAI,CAACA,KAAL,EAAY,OAAO,IAAP;;MAEZ,QAAQA,KAAK,CAACC,IAAd;QACE,KAAK,QAAL;UAAe;YACb,OAAO,KAAKb,QAAL,CAAcmB,WAAd,CAA0BP,KAAK,CAACS,IAAhC,EAAsC,EAC3C,GAAGtB,MADwC;cAE3C,GAAG,KAAKA,MAAL,CAAYsB;YAF4B,CAAtC,CAAP;UAID;;QACD,KAAK,MAAL;UAAa;YACX,OAAO,KAAKrB,QAAL,CAAc2C,WAAd,CAA0B/B,KAAK,CAACS,IAAhC,EAAsCT,KAAK,CAACgC,IAA5C,EAAkD,EACvD,GAAG7C,MADoD;cAEvD,GAAG,KAAKA,MAAL,CAAY8C;YAFwC,CAAlD,CAAP;UAID;;QACD,KAAK,OAAL;UAAc;YACZ,OAAO,KAAK7C,QAAL,CAAc8C,YAAd,CAA2BlC,KAAK,CAACgC,IAAjC,CAAP;UACD;;QACD,KAAK,QAAL;UAAe;YACb,OAAO,KAAK5C,QAAL,CAAcmB,WAAd,CACL,KAAKC,WAAL,CAAiBR,KAAK,CAACH,MAAvB,EAA+B,KAAKV,MAAL,CAAYgD,MAA3C,CADK,EAEL,EAAE,GAAGhD,MAAL;cAAa,GAAG,KAAKA,MAAL,CAAYgD;YAA5B,CAFK,CAAP;UAID;;QACD,KAAK,IAAL;UAAW;YACT,OAAO,KAAK/C,QAAL,CAAcmB,WAAd,CACL,KAAKC,WAAL,CAAiBR,KAAK,CAACH,MAAvB,EAA+B,KAAKV,MAAL,CAAY+B,EAA3C,CADK,EAEL,EAAE,GAAG/B,MAAL;cAAa,GAAG,KAAKA,MAAL,CAAY+B;YAA5B,CAFK,CAAP;UAID;;QACD,KAAK,UAAL;UAAiB;YACf,OAAO,KAAK9B,QAAL,CAAcmB,WAAd,CAA0BP,KAAK,CAACS,IAAhC,EAAsC,KAAKtB,MAAL,CAAYiD,QAAlD,CAAP;UACD;;QACD,KAAK,IAAL;UAAW;YACT,OAAO,KAAKhD,QAAL,CAAcmB,WAAd,CAA0B,IAA1B,EAAgC,EAAhC,CAAP;UACD;;QACD,KAAK,KAAL;UAAY;YACV,OAAO,IAAP;UACD;;QACD,KAAK,MAAL;UAAa;YACX,OAAO,KAAKnB,QAAL,CAAcmB,WAAd,CAA0BP,KAAK,CAACqC,GAAhC,EAAqC,EAC1C,GAAGlD,MADuC;cAE1C,GAAG,KAAKA,MAAL,CAAYsB;YAF2B,CAArC,CAAP;UAID;;QACD;UAAS;YACPoB,OAAO,CAACC,IAAR,CAAc,eAAc9B,KAAK,CAACC,IAAK,uBAAvC;YACA,OAAO,IAAP;UACD;MA9CH;IAgDD,CAnDmC,CAApC;IAoDA,OAAOH,QAAP;EACD;;AAjKU;;AAoKb,eAAed,MAAf"}
package/dist/module/lib/Renderer.js CHANGED
@@ -1,8 +1,7 @@
1
1
  function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
2
2
 
3
3
  import * as React from 'react';
4
- import { Linking, ScrollView, View } from 'react-native';
5
- import { Text } from 'react-native';
4
+ import { Linking, ScrollView, View, Text } from 'react-native';
6
5
  import MarkedList from '@jsamr/react-native-li';
7
6
  import Disc from '@jsamr/counter-style/presets/disc';
8
7
  import Decimal from '@jsamr/counter-style/presets/decimal';
package/dist/module/lib/Renderer.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["React","Linking","ScrollView","View","Text","MarkedList","Disc","Decimal","MDImage","generateRandomString","Renderer","href","openURL","children","styles","text","onLinkPress","getViewNode","getCodeBlockNode","containerStyle","textStyle","getBlockquoteNode","getImageNode","uri","getListNode","ordered","li","listStyle","map","node"],"sources":["Renderer.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Linking, ScrollView, View, ViewStyle } from 'react-native';\nimport { Text, StyleProp, TextStyle } from 'react-native';\nimport MarkedList from '@jsamr/react-native-li';\nimport Disc from '@jsamr/counter-style/presets/disc';\nimport Decimal from '@jsamr/counter-style/presets/decimal';\nimport MDImage from './../components/MDImage';\n\nimport { generateRandomString } from '../utils/string';\n\nclass Renderer {\n private onLinkPress = (href: string) => () => Linking.openURL(href);\n\n getTextNode = (\n children: string | React.ReactNode[],\n styles: StyleProp<TextStyle>\n ) => {\n return (\n <Text key={generateRandomString()} style={styles}>\n {children}\n </Text>\n );\n };\n\n getLinkNode = (text: string, href: string, styles: StyleProp<TextStyle>) => {\n return (\n <Text\n key={generateRandomString()}\n onPress={this.onLinkPress(href)}\n style={styles}\n >\n {text}\n </Text>\n );\n };\n\n getViewNode(\n children: React.ReactNode[] | null,\n styles: StyleProp<ViewStyle>\n ) {\n return (\n <View key={generateRandomString()} style={styles}>\n {children}\n </View>\n );\n }\n\n getCodeBlockNode(\n text: string,\n containerStyle: StyleProp<ViewStyle>,\n textStyle: StyleProp<TextStyle>\n ) {\n return (\n <ScrollView contentContainerStyle={containerStyle} horizontal>\n <Text style={textStyle}>{text}</Text>\n </ScrollView>\n );\n }\n\n getBlockquoteNode(children: React.ReactNode[], styles: StyleProp<ViewStyle>) {\n return (\n <View key={generateRandomString()} style={styles}>\n {children}\n </View>\n );\n }\n\n getImageNode(uri: string) {\n return <MDImage key={generateRandomString()} uri={uri} />;\n }\n\n getListNode(\n ordered: boolean,\n li: React.ReactNode[],\n listStyle: ViewStyle | undefined,\n textStyle: TextStyle | undefined\n ) {\n return (\n <MarkedList\n counterRenderer={ordered ? Decimal : Disc}\n markerTextStyle={textStyle}\n markerBoxStyle={listStyle}\n >\n {li.map((node) => node)}\n </MarkedList>\n );\n }\n}\n\nexport default Renderer;\n"],"mappings":";;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,OAAT,EAAkBC,UAAlB,EAA8BC,IAA9B,QAAqD,cAArD;AACA,SAASC,IAAT,QAA2C,cAA3C;AACA,OAAOC,UAAP,MAAuB,wBAAvB;AACA,OAAOC,IAAP,MAAiB,mCAAjB;AACA,OAAOC,OAAP,MAAoB,sCAApB;AACA,OAAOC,OAAP,MAAoB,yBAApB;AAEA,SAASC,oBAAT,QAAqC,iBAArC;;AAEA,MAAMC,QAAN,CAAe;EAAA;IAAA,qCACUC,IAAD,IAAkB,MAAMV,OAAO,CAACW,OAAR,CAAgBD,IAAhB,CADjC;;IAAA,qCAGC,CACZE,QADY,EAEZC,MAFY,KAGT;MACH,oBACE,oBAAC,IAAD;QAAM,GAAG,EAAEL,oBAAoB,EAA/B;QAAmC,KAAK,EAAEK;MAA1C,GACGD,QADH,CADF;IAKD,CAZY;;IAAA,qCAcC,CAACE,IAAD,EAAeJ,IAAf,EAA6BG,MAA7B,KAA8D;MAC1E,oBACE,oBAAC,IAAD;QACE,GAAG,EAAEL,oBAAoB,EAD3B;QAEE,OAAO,EAAE,KAAKO,WAAL,CAAiBL,IAAjB,CAFX;QAGE,KAAK,EAAEG;MAHT,GAKGC,IALH,CADF;IASD,CAxBY;EAAA;;EA0BbE,WAAW,CACTJ,QADS,EAETC,MAFS,EAGT;IACA,oBACE,oBAAC,IAAD;MAAM,GAAG,EAAEL,oBAAoB,EAA/B;MAAmC,KAAK,EAAEK;IAA1C,GACGD,QADH,CADF;EAKD;;EAEDK,gBAAgB,CACdH,IADc,EAEdI,cAFc,EAGdC,SAHc,EAId;IACA,oBACE,oBAAC,UAAD;MAAY,qBAAqB,EAAED,cAAnC;MAAmD,UAAU;IAA7D,gBACE,oBAAC,IAAD;MAAM,KAAK,EAAEC;IAAb,GAAyBL,IAAzB,CADF,CADF;EAKD;;EAEDM,iBAAiB,CAACR,QAAD,EAA8BC,MAA9B,EAA4D;IAC3E,oBACE,oBAAC,IAAD;MAAM,GAAG,EAAEL,oBAAoB,EAA/B;MAAmC,KAAK,EAAEK;IAA1C,GACGD,QADH,CADF;EAKD;;EAEDS,YAAY,CAACC,GAAD,EAAc;IACxB,oBAAO,oBAAC,OAAD;MAAS,GAAG,EAAEd,oBAAoB,EAAlC;MAAsC,GAAG,EAAEc;IAA3C,EAAP;EACD;;EAEDC,WAAW,CACTC,OADS,EAETC,EAFS,EAGTC,SAHS,EAITP,SAJS,EAKT;IACA,oBACE,oBAAC,UAAD;MACE,eAAe,EAAEK,OAAO,GAAGlB,OAAH,GAAaD,IADvC;MAEE,eAAe,EAAEc,SAFnB;MAGE,cAAc,EAAEO;IAHlB,GAKGD,EAAE,CAACE,GAAH,CAAQC,IAAD,IAAUA,IAAjB,CALH,CADF;EASD;;AA5EY;;AA+Ef,eAAenB,QAAf"}
1
+ {"version":3,"names":["React","Linking","ScrollView","View","Text","MarkedList","Disc","Decimal","MDImage","generateRandomString","Renderer","href","openURL","children","styles","text","onLinkPress","getViewNode","getCodeBlockNode","containerStyle","textStyle","getBlockquoteNode","getImageNode","uri","getListNode","ordered","li","listStyle","map","node"],"sources":["Renderer.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Linking, ScrollView, View, Text } from 'react-native';\nimport MarkedList from '@jsamr/react-native-li';\nimport Disc from '@jsamr/counter-style/presets/disc';\nimport Decimal from '@jsamr/counter-style/presets/decimal';\nimport MDImage from './../components/MDImage';\nimport { generateRandomString } from '../utils/string';\nimport type { TextStyleProp, ViewStyleProp } from './types';\n\nclass Renderer {\n private onLinkPress = (href: string) => () => Linking.openURL(href);\n\n getTextNode = (\n children: string | React.ReactNode[],\n styles: TextStyleProp\n ) => {\n return (\n <Text key={generateRandomString()} style={styles}>\n {children}\n </Text>\n );\n };\n\n getLinkNode = (text: string, href: string, styles: TextStyleProp) => {\n return (\n <Text\n key={generateRandomString()}\n onPress={this.onLinkPress(href)}\n style={styles}\n >\n {text}\n </Text>\n );\n };\n\n getViewNode(children: React.ReactNode[] | null, styles: ViewStyleProp) {\n return (\n <View key={generateRandomString()} style={styles}>\n {children}\n </View>\n );\n }\n\n getCodeBlockNode(\n text: string,\n containerStyle: ViewStyleProp,\n textStyle: TextStyleProp\n ) {\n return (\n <ScrollView contentContainerStyle={containerStyle} horizontal>\n <Text style={textStyle}>{text}</Text>\n </ScrollView>\n );\n }\n\n getBlockquoteNode(children: React.ReactNode[], styles: ViewStyleProp) {\n return (\n <View key={generateRandomString()} style={styles}>\n {children}\n </View>\n );\n }\n\n getImageNode(uri: string) {\n return <MDImage key={generateRandomString()} uri={uri} />;\n }\n\n getListNode(\n ordered: boolean,\n li: React.ReactNode[],\n listStyle: ViewStyleProp,\n textStyle: TextStyleProp\n ) {\n return (\n <MarkedList\n counterRenderer={ordered ? Decimal : Disc}\n markerTextStyle={textStyle}\n markerBoxStyle={listStyle}\n >\n {li.map((node) => node)}\n </MarkedList>\n );\n }\n}\n\nexport default Renderer;\n"],"mappings":";;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,OAAT,EAAkBC,UAAlB,EAA8BC,IAA9B,EAAoCC,IAApC,QAAgD,cAAhD;AACA,OAAOC,UAAP,MAAuB,wBAAvB;AACA,OAAOC,IAAP,MAAiB,mCAAjB;AACA,OAAOC,OAAP,MAAoB,sCAApB;AACA,OAAOC,OAAP,MAAoB,yBAApB;AACA,SAASC,oBAAT,QAAqC,iBAArC;;AAGA,MAAMC,QAAN,CAAe;EAAA;IAAA,qCACUC,IAAD,IAAkB,MAAMV,OAAO,CAACW,OAAR,CAAgBD,IAAhB,CADjC;;IAAA,qCAGC,CACZE,QADY,EAEZC,MAFY,KAGT;MACH,oBACE,oBAAC,IAAD;QAAM,GAAG,EAAEL,oBAAoB,EAA/B;QAAmC,KAAK,EAAEK;MAA1C,GACGD,QADH,CADF;IAKD,CAZY;;IAAA,qCAcC,CAACE,IAAD,EAAeJ,IAAf,EAA6BG,MAA7B,KAAuD;MACnE,oBACE,oBAAC,IAAD;QACE,GAAG,EAAEL,oBAAoB,EAD3B;QAEE,OAAO,EAAE,KAAKO,WAAL,CAAiBL,IAAjB,CAFX;QAGE,KAAK,EAAEG;MAHT,GAKGC,IALH,CADF;IASD,CAxBY;EAAA;;EA0BbE,WAAW,CAACJ,QAAD,EAAqCC,MAArC,EAA4D;IACrE,oBACE,oBAAC,IAAD;MAAM,GAAG,EAAEL,oBAAoB,EAA/B;MAAmC,KAAK,EAAEK;IAA1C,GACGD,QADH,CADF;EAKD;;EAEDK,gBAAgB,CACdH,IADc,EAEdI,cAFc,EAGdC,SAHc,EAId;IACA,oBACE,oBAAC,UAAD;MAAY,qBAAqB,EAAED,cAAnC;MAAmD,UAAU;IAA7D,gBACE,oBAAC,IAAD;MAAM,KAAK,EAAEC;IAAb,GAAyBL,IAAzB,CADF,CADF;EAKD;;EAEDM,iBAAiB,CAACR,QAAD,EAA8BC,MAA9B,EAAqD;IACpE,oBACE,oBAAC,IAAD;MAAM,GAAG,EAAEL,oBAAoB,EAA/B;MAAmC,KAAK,EAAEK;IAA1C,GACGD,QADH,CADF;EAKD;;EAEDS,YAAY,CAACC,GAAD,EAAc;IACxB,oBAAO,oBAAC,OAAD;MAAS,GAAG,EAAEd,oBAAoB,EAAlC;MAAsC,GAAG,EAAEc;IAA3C,EAAP;EACD;;EAEDC,WAAW,CACTC,OADS,EAETC,EAFS,EAGTC,SAHS,EAITP,SAJS,EAKT;IACA,oBACE,oBAAC,UAAD;MACE,eAAe,EAAEK,OAAO,GAAGlB,OAAH,GAAaD,IADvC;MAEE,eAAe,EAAEc,SAFnB;MAGE,cAAc,EAAEO;IAHlB,GAKGD,EAAE,CAACE,GAAH,CAAQC,IAAD,IAAUA,IAAjB,CALH,CADF;EASD;;AAzEY;;AA4Ef,eAAenB,QAAf"}
package/dist/module/lib/types.js ADDED
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=types.js.map
package/dist/module/lib/types.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type {\n ImageStyle,\n TextStyle,\n ViewStyle,\n FlatListProps,\n} from 'react-native';\nimport type { MarkedStyles } from './../theme/types';\n\nexport type TextStyleProp = TextStyle | undefined;\nexport type ViewStyleProp = ViewStyle | undefined;\nexport type CustomStyleProp = ViewStyle | TextStyle | ImageStyle | undefined;\n\nexport interface ParserOptions {\n styles?: MarkedStyles;\n}\n\nexport interface MarkdownProps {\n value: string;\n flatListProps?: Omit<\n FlatListProps<ReactNode>,\n 'data' | 'renderItem' | 'horizontal'\n >;\n styles?: MarkedStyles;\n}\n"],"mappings":""}
package/dist/typescript/lib/Markdown.d.ts CHANGED
@@ -1,10 +1,4 @@
1
- import React, { ReactNode } from 'react';
2
- import { FlatListProps } from 'react-native';
3
- import type { MarkedStyles } from '../theme/types';
4
- interface MarkdownProps {
5
- value: string;
6
- flatListProps?: Omit<FlatListProps<ReactNode>, 'data' | 'renderItem' | 'horizontal'>;
7
- styles?: MarkedStyles;
8
- }
1
+ import React from 'react';
2
+ import type { MarkdownProps } from './types';
9
3
  declare const _default: React.MemoExoticComponent<({ value, flatListProps, styles: userStyles, }: MarkdownProps) => JSX.Element>;
10
4
  export default _default;
package/dist/typescript/lib/Parser.d.ts CHANGED
@@ -1,16 +1,12 @@
1
1
  /// <reference types="react" />
2
2
  import type { marked } from 'marked';
3
- import type { ImageStyle, StyleProp, TextStyle, ViewStyle } from 'react-native';
4
- import type { MarkedStyles } from '../theme/types';
5
- interface ParserOptions {
6
- styles?: MarkedStyles;
7
- }
3
+ import type { CustomStyleProp, ParserOptions } from './types';
8
4
  declare class Parser {
9
5
  private renderer;
10
6
  private styles;
11
7
  private headingStylesMap;
12
8
  constructor(options: ParserOptions);
13
9
  parse(tokens: marked.Token[]): import("react").ReactNode[];
14
- parseInline(tokens: marked.Token[], styles?: StyleProp<ViewStyle | TextStyle | ImageStyle>): import("react").ReactNode[];
10
+ parseInline(tokens: marked.Token[], styles?: CustomStyleProp): import("react").ReactNode[];
15
11
  }
16
12
  export default Parser;
package/dist/typescript/lib/Renderer.d.ts CHANGED
@@ -1,14 +1,13 @@
1
1
  import * as React from 'react';
2
- import { ViewStyle } from 'react-native';
3
- import { StyleProp, TextStyle } from 'react-native';
2
+ import type { TextStyleProp, ViewStyleProp } from './types';
4
3
  declare class Renderer {
5
4
  private onLinkPress;
6
- getTextNode: (children: string | React.ReactNode[], styles: StyleProp<TextStyle>) => JSX.Element;
7
- getLinkNode: (text: string, href: string, styles: StyleProp<TextStyle>) => JSX.Element;
8
- getViewNode(children: React.ReactNode[] | null, styles: StyleProp<ViewStyle>): JSX.Element;
9
- getCodeBlockNode(text: string, containerStyle: StyleProp<ViewStyle>, textStyle: StyleProp<TextStyle>): JSX.Element;
10
- getBlockquoteNode(children: React.ReactNode[], styles: StyleProp<ViewStyle>): JSX.Element;
5
+ getTextNode: (children: string | React.ReactNode[], styles: TextStyleProp) => JSX.Element;
6
+ getLinkNode: (text: string, href: string, styles: TextStyleProp) => JSX.Element;
7
+ getViewNode(children: React.ReactNode[] | null, styles: ViewStyleProp): JSX.Element;
8
+ getCodeBlockNode(text: string, containerStyle: ViewStyleProp, textStyle: TextStyleProp): JSX.Element;
9
+ getBlockquoteNode(children: React.ReactNode[], styles: ViewStyleProp): JSX.Element;
11
10
  getImageNode(uri: string): JSX.Element;
12
- getListNode(ordered: boolean, li: React.ReactNode[], listStyle: ViewStyle | undefined, textStyle: TextStyle | undefined): JSX.Element;
11
+ getListNode(ordered: boolean, li: React.ReactNode[], listStyle: ViewStyleProp, textStyle: TextStyleProp): JSX.Element;
13
12
  }
14
13
  export default Renderer;
package/dist/typescript/lib/types.d.ts ADDED
@@ -0,0 +1,14 @@
1
+ import type { ReactNode } from 'react';
2
+ import type { ImageStyle, TextStyle, ViewStyle, FlatListProps } from 'react-native';
3
+ import type { MarkedStyles } from './../theme/types';
4
+ export declare type TextStyleProp = TextStyle | undefined;
5
+ export declare type ViewStyleProp = ViewStyle | undefined;
6
+ export declare type CustomStyleProp = ViewStyle | TextStyle | ImageStyle | undefined;
7
+ export interface ParserOptions {
8
+ styles?: MarkedStyles;
9
+ }
10
+ export interface MarkdownProps {
11
+ value: string;
12
+ flatListProps?: Omit<FlatListProps<ReactNode>, 'data' | 'renderItem' | 'horizontal'>;
13
+ styles?: MarkedStyles;
14
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-native-marked",
3
- "version": "1.0.2",
3
+ "version": "1.1.1",
4
4
  "description": "Markdown renderer for React Native powered by marked.js",
5
5
  "main": "dist/commonjs/index",
6
6
  "module": "dist/module/index",
@@ -26,8 +26,8 @@
26
26
  "typescript": "tsc --noEmit",
27
27
  "lint": "eslint \"**/*.{js,ts,tsx}\"",
28
28
  "build": "bob build",
29
- "prepare": "npm run build",
30
- "release": "release-it"
29
+ "prepare": "yarn build",
30
+ "release": "yarn build && release-it"
31
31
  },
32
32
  "keywords": [
33
33
  "react-native",
package/src/lib/Markdown.tsx CHANGED
@@ -1,18 +1,9 @@
1
1
  import React, { memo, ReactNode, useCallback, useMemo } from 'react';
2
- import { FlatList, FlatListProps, useColorScheme } from 'react-native';
2
+ import { FlatList, useColorScheme } from 'react-native';
3
3
  import { marked } from 'marked';
4
4
  import Parser from './Parser';
5
5
  import getStyles from '../theme/styles';
6
- import type { MarkedStyles } from '../theme/types';
7
-
8
- interface MarkdownProps {
9
- value: string;
10
- flatListProps?: Omit<
11
- FlatListProps<ReactNode>,
12
- 'data' | 'renderItem' | 'horizontal'
13
- >;
14
- styles?: MarkedStyles;
15
- }
6
+ import type { MarkdownProps } from './types';
16
7
 
17
8
  const Markdown = ({
18
9
  value,
package/src/lib/Parser.tsx CHANGED
@@ -1,16 +1,12 @@
1
1
  import type { marked } from 'marked';
2
- import type { ImageStyle, StyleProp, TextStyle, ViewStyle } from 'react-native';
3
2
  import Renderer from './Renderer';
4
3
  import type { MarkedStyles } from '../theme/types';
5
-
6
- interface ParserOptions {
7
- styles?: MarkedStyles;
8
- }
4
+ import type { CustomStyleProp, ParserOptions, TextStyleProp } from './types';
9
5
 
10
6
  class Parser {
11
7
  private renderer;
12
8
  private styles: MarkedStyles;
13
- private headingStylesMap: Record<number, TextStyle | undefined>;
9
+ private headingStylesMap: Record<number, TextStyleProp>;
14
10
  constructor(options: ParserOptions) {
15
11
  this.styles = { ...options.styles };
16
12
  this.renderer = new Renderer();
@@ -34,6 +30,7 @@ class Parser {
34
30
  let tempTokens: marked.Token[] = [];
35
31
  const paragraphChildren: React.ReactNode[] = [];
36
32
  token.tokens.forEach((t) => {
33
+ /* To avoid inlining of image */
37
34
  if (t.type === 'image') {
38
35
  paragraphChildren.push(
39
36
  this.renderer.getTextNode(
@@ -102,6 +99,9 @@ class Parser {
102
99
  this.styles.li
103
100
  );
104
101
  }
102
+ case 'html': {
103
+ return this.renderer.getTextNode(token.text.trim(), this.styles.text);
104
+ }
105
105
  default:
106
106
  console.warn(`Token with '${token.type}' type was not found.`);
107
107
  return null;
@@ -110,29 +110,22 @@ class Parser {
110
110
  return elements;
111
111
  }
112
112
 
113
- parseInline(
114
- tokens: marked.Token[],
115
- styles: StyleProp<ViewStyle | TextStyle | ImageStyle> = {}
116
- ) {
113
+ parseInline(tokens: marked.Token[], styles?: CustomStyleProp) {
117
114
  const elements: React.ReactNode[] = tokens.map((token) => {
118
115
  if (!token) return null;
119
116
 
120
117
  switch (token.type) {
121
118
  case 'escape': {
122
- return this.renderer.getTextNode(token.text, [
123
- styles,
124
- this.styles.text,
125
- ]);
126
- }
127
- case 'html': {
128
- console.log('html', token);
129
- return null;
119
+ return this.renderer.getTextNode(token.text, {
120
+ ...styles,
121
+ ...this.styles.text,
122
+ });
130
123
  }
131
124
  case 'link': {
132
- return this.renderer.getLinkNode(token.text, token.href, [
133
- styles,
134
- this.styles.link,
135
- ]);
125
+ return this.renderer.getLinkNode(token.text, token.href, {
126
+ ...styles,
127
+ ...this.styles.link,
128
+ });
136
129
  }
137
130
  case 'image': {
138
131
  return this.renderer.getImageNode(token.href);
@@ -140,13 +133,13 @@ class Parser {
140
133
  case 'strong': {
141
134
  return this.renderer.getTextNode(
142
135
  this.parseInline(token.tokens, this.styles.strong),
143
- [styles, this.styles.strong]
136
+ { ...styles, ...this.styles.strong }
144
137
  );
145
138
  }
146
139
  case 'em': {
147
140
  return this.renderer.getTextNode(
148
141
  this.parseInline(token.tokens, this.styles.em),
149
- [styles, this.styles.em]
142
+ { ...styles, ...this.styles.em }
150
143
  );
151
144
  }
152
145
  case 'codespan': {
@@ -159,10 +152,10 @@ class Parser {
159
152
  return null;
160
153
  }
161
154
  case 'text': {
162
- return this.renderer.getTextNode(token.raw, [
163
- styles,
164
- this.styles.text,
165
- ]);
155
+ return this.renderer.getTextNode(token.raw, {
156
+ ...styles,
157
+ ...this.styles.text,
158
+ });
166
159
  }
167
160
  default: {
168
161
  console.warn(`Token with '${token.type}' type was not found.`);
package/src/lib/Renderer.tsx CHANGED
@@ -1,19 +1,18 @@
1
1
  import * as React from 'react';
2
- import { Linking, ScrollView, View, ViewStyle } from 'react-native';
3
- import { Text, StyleProp, TextStyle } from 'react-native';
2
+ import { Linking, ScrollView, View, Text } from 'react-native';
4
3
  import MarkedList from '@jsamr/react-native-li';
5
4
  import Disc from '@jsamr/counter-style/presets/disc';
6
5
  import Decimal from '@jsamr/counter-style/presets/decimal';
7
6
  import MDImage from './../components/MDImage';
8
-
9
7
  import { generateRandomString } from '../utils/string';
8
+ import type { TextStyleProp, ViewStyleProp } from './types';
10
9
 
11
10
  class Renderer {
12
11
  private onLinkPress = (href: string) => () => Linking.openURL(href);
13
12
 
14
13
  getTextNode = (
15
14
  children: string | React.ReactNode[],
16
- styles: StyleProp<TextStyle>
15
+ styles: TextStyleProp
17
16
  ) => {
18
17
  return (
19
18
  <Text key={generateRandomString()} style={styles}>
@@ -22,7 +21,7 @@ class Renderer {
22
21
  );
23
22
  };
24
23
 
25
- getLinkNode = (text: string, href: string, styles: StyleProp<TextStyle>) => {
24
+ getLinkNode = (text: string, href: string, styles: TextStyleProp) => {
26
25
  return (
27
26
  <Text
28
27
  key={generateRandomString()}
@@ -34,10 +33,7 @@ class Renderer {
34
33
  );
35
34
  };
36
35
 
37
- getViewNode(
38
- children: React.ReactNode[] | null,
39
- styles: StyleProp<ViewStyle>
40
- ) {
36
+ getViewNode(children: React.ReactNode[] | null, styles: ViewStyleProp) {
41
37
  return (
42
38
  <View key={generateRandomString()} style={styles}>
43
39
  {children}
@@ -47,8 +43,8 @@ class Renderer {
47
43
 
48
44
  getCodeBlockNode(
49
45
  text: string,
50
- containerStyle: StyleProp<ViewStyle>,
51
- textStyle: StyleProp<TextStyle>
46
+ containerStyle: ViewStyleProp,
47
+ textStyle: TextStyleProp
52
48
  ) {
53
49
  return (
54
50
  <ScrollView contentContainerStyle={containerStyle} horizontal>
@@ -57,7 +53,7 @@ class Renderer {
57
53
  );
58
54
  }
59
55
 
60
- getBlockquoteNode(children: React.ReactNode[], styles: StyleProp<ViewStyle>) {
56
+ getBlockquoteNode(children: React.ReactNode[], styles: ViewStyleProp) {
61
57
  return (
62
58
  <View key={generateRandomString()} style={styles}>
63
59
  {children}
@@ -72,8 +68,8 @@ class Renderer {
72
68
  getListNode(
73
69
  ordered: boolean,
74
70
  li: React.ReactNode[],
75
- listStyle: ViewStyle | undefined,
76
- textStyle: TextStyle | undefined
71
+ listStyle: ViewStyleProp,
72
+ textStyle: TextStyleProp
77
73
  ) {
78
74
  return (
79
75
  <MarkedList
package/src/lib/types.ts ADDED
@@ -0,0 +1,25 @@
1
+ import type { ReactNode } from 'react';
2
+ import type {
3
+ ImageStyle,
4
+ TextStyle,
5
+ ViewStyle,
6
+ FlatListProps,
7
+ } from 'react-native';
8
+ import type { MarkedStyles } from './../theme/types';
9
+
10
+ export type TextStyleProp = TextStyle | undefined;
11
+ export type ViewStyleProp = ViewStyle | undefined;
12
+ export type CustomStyleProp = ViewStyle | TextStyle | ImageStyle | undefined;
13
+
14
+ export interface ParserOptions {
15
+ styles?: MarkedStyles;
16
+ }
17
+
18
+ export interface MarkdownProps {
19
+ value: string;
20
+ flatListProps?: Omit<
21
+ FlatListProps<ReactNode>,
22
+ 'data' | 'renderItem' | 'horizontal'
23
+ >;
24
+ styles?: MarkedStyles;
25
+ }