react-native-marked 1.1.2 → 1.1.3
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.
- package/dist/commonjs/lib/Parser.js +74 -53
- package/dist/commonjs/lib/Parser.js.map +1 -1
- package/dist/commonjs/lib/Renderer.js +17 -19
- package/dist/commonjs/lib/Renderer.js.map +1 -1
- package/dist/commonjs/theme/styles.js.map +1 -1
- package/dist/commonjs/utils/handlers.js +19 -0
- package/dist/commonjs/utils/handlers.js.map +1 -0
- package/dist/module/lib/Parser.js +74 -53
- package/dist/module/lib/Parser.js.map +1 -1
- package/dist/module/lib/Renderer.js +9 -8
- package/dist/module/lib/Renderer.js.map +1 -1
- package/dist/module/theme/styles.js.map +1 -1
- package/dist/module/utils/handlers.js +9 -0
- package/dist/module/utils/handlers.js.map +1 -0
- package/dist/typescript/lib/Parser.d.ts +4 -3
- package/dist/typescript/lib/Renderer.d.ts +6 -7
- package/dist/typescript/utils/handlers.d.ts +1 -0
- package/package.json +1 -1
- package/src/lib/Parser.tsx +96 -56
- package/src/lib/Renderer.tsx +20 -15
- package/src/theme/styles.ts +3 -1
- package/src/utils/handlers.ts +9 -0
|
@@ -19,6 +19,37 @@ class Parser {
|
|
|
19
19
|
|
|
20
20
|
_defineProperty(this, "headingStylesMap", void 0);
|
|
21
21
|
|
|
22
|
+
_defineProperty(this, "getNormalizedSiblingNodesForBlockAndInlineTokens", (tokens, textStyle) => {
|
|
23
|
+
let tempTokens = [];
|
|
24
|
+
const siblingNodes = [];
|
|
25
|
+
tokens.forEach(t => {
|
|
26
|
+
/**
|
|
27
|
+
* To avoid inlining images
|
|
28
|
+
* Note: to be extend for other token types
|
|
29
|
+
*/
|
|
30
|
+
if (t.type === 'image') {
|
|
31
|
+
const parsed = this.parseInline(tempTokens);
|
|
32
|
+
|
|
33
|
+
if (parsed.length > 0) {
|
|
34
|
+
siblingNodes.push(this.renderer.getTextNode(this.parseInline(tempTokens), textStyle));
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
siblingNodes.push(this.parseInline([t]));
|
|
38
|
+
tempTokens = [];
|
|
39
|
+
return;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
tempTokens = [...tempTokens, t];
|
|
43
|
+
});
|
|
44
|
+
/* Remaining temp tokens if any */
|
|
45
|
+
|
|
46
|
+
if (tempTokens.length > 0) {
|
|
47
|
+
siblingNodes.push(this.renderer.getTextNode(this.parseInline(tempTokens), {}));
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
return siblingNodes;
|
|
51
|
+
});
|
|
52
|
+
|
|
22
53
|
this.styles = { ...options.styles
|
|
23
54
|
};
|
|
24
55
|
this.renderer = new _Renderer.default();
|
|
@@ -42,24 +73,7 @@ class Parser {
|
|
|
42
73
|
|
|
43
74
|
case 'paragraph':
|
|
44
75
|
{
|
|
45
|
-
|
|
46
|
-
const paragraphChildren = [];
|
|
47
|
-
token.tokens.forEach(t => {
|
|
48
|
-
/* To avoid inlining of image */
|
|
49
|
-
if (t.type === 'image') {
|
|
50
|
-
paragraphChildren.push(this.renderer.getTextNode(this.parseInline(tempTokens), this.styles.text));
|
|
51
|
-
paragraphChildren.push(this.parseInline([t]));
|
|
52
|
-
tempTokens = [];
|
|
53
|
-
return;
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
tempTokens = [...tempTokens, t];
|
|
57
|
-
});
|
|
58
|
-
|
|
59
|
-
if (tempTokens.length > 0) {
|
|
60
|
-
paragraphChildren.push(this.renderer.getTextNode(this.parseInline(tempTokens), {}));
|
|
61
|
-
}
|
|
62
|
-
|
|
76
|
+
const paragraphChildren = this.getNormalizedSiblingNodesForBlockAndInlineTokens(token.tokens, this.styles.text);
|
|
63
77
|
return this.renderer.getViewNode(paragraphChildren, this.styles.paragraph);
|
|
64
78
|
}
|
|
65
79
|
|
|
@@ -71,7 +85,7 @@ class Parser {
|
|
|
71
85
|
case 'heading':
|
|
72
86
|
{
|
|
73
87
|
const styles = this.headingStylesMap[token.depth] ?? this.styles.text;
|
|
74
|
-
return this.renderer.getTextNode(token.
|
|
88
|
+
return this.renderer.getTextNode(this.parseInline(token.tokens, styles), styles);
|
|
75
89
|
}
|
|
76
90
|
|
|
77
91
|
case 'code':
|
|
@@ -87,32 +101,28 @@ class Parser {
|
|
|
87
101
|
case 'list':
|
|
88
102
|
{
|
|
89
103
|
const li = token.items.map(item => {
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
104
|
+
const children = item.tokens.map(cItem => {
|
|
105
|
+
if (cItem.type === 'text') {
|
|
106
|
+
/* getViewNode since tokens could contain a block like elements (i.e. img) */
|
|
107
|
+
const listChildren = this.getNormalizedSiblingNodesForBlockAndInlineTokens( // @ts-ignore
|
|
108
|
+
cItem.tokens, this.styles.li);
|
|
109
|
+
return this.renderer.getViewNode(listChildren, this.styles.li);
|
|
110
|
+
}
|
|
111
|
+
/* Parse the nested token */
|
|
112
|
+
|
|
113
|
+
|
|
114
|
+
return this.parse([cItem]);
|
|
115
|
+
});
|
|
116
|
+
return this.renderer.getViewNode(children, this.styles.li);
|
|
101
117
|
});
|
|
102
118
|
return this.renderer.getListNode(token.ordered, li, this.styles.list, this.styles.li);
|
|
103
119
|
}
|
|
104
120
|
|
|
105
|
-
case 'html':
|
|
106
|
-
{
|
|
107
|
-
return this.renderer.getTextNode(token.text.trim(), this.styles.text);
|
|
108
|
-
}
|
|
109
|
-
|
|
110
121
|
default:
|
|
111
|
-
|
|
112
|
-
return null;
|
|
122
|
+
return this.parseInline([token]);
|
|
113
123
|
}
|
|
114
124
|
});
|
|
115
|
-
return elements;
|
|
125
|
+
return elements.filter(element => element !== null);
|
|
116
126
|
}
|
|
117
127
|
|
|
118
128
|
parseInline(tokens, styles) {
|
|
@@ -122,16 +132,18 @@ class Parser {
|
|
|
122
132
|
switch (token.type) {
|
|
123
133
|
case 'escape':
|
|
124
134
|
{
|
|
125
|
-
return this.renderer.getTextNode(token.text, { ...styles,
|
|
126
|
-
...
|
|
135
|
+
return this.renderer.getTextNode(token.text, { ...this.styles.text,
|
|
136
|
+
...styles
|
|
127
137
|
});
|
|
128
138
|
}
|
|
129
139
|
|
|
130
140
|
case 'link':
|
|
131
141
|
{
|
|
132
|
-
|
|
133
|
-
...this.styles.link
|
|
134
|
-
|
|
142
|
+
const linkStyle = { ...styles,
|
|
143
|
+
...this.styles.link // To override color property
|
|
144
|
+
|
|
145
|
+
};
|
|
146
|
+
return this.renderer.getLinkNode(this.parseInline(token.tokens, linkStyle), token.href, linkStyle);
|
|
135
147
|
}
|
|
136
148
|
|
|
137
149
|
case 'image':
|
|
@@ -141,21 +153,25 @@ class Parser {
|
|
|
141
153
|
|
|
142
154
|
case 'strong':
|
|
143
155
|
{
|
|
144
|
-
|
|
145
|
-
...
|
|
146
|
-
}
|
|
156
|
+
const boldStyle = { ...this.styles.strong,
|
|
157
|
+
...styles
|
|
158
|
+
};
|
|
159
|
+
return this.renderer.getTextNode(this.parseInline(token.tokens, boldStyle), boldStyle);
|
|
147
160
|
}
|
|
148
161
|
|
|
149
162
|
case 'em':
|
|
150
163
|
{
|
|
151
|
-
|
|
152
|
-
...
|
|
153
|
-
}
|
|
164
|
+
const italicStyle = { ...this.styles.em,
|
|
165
|
+
...styles
|
|
166
|
+
};
|
|
167
|
+
return this.renderer.getTextNode(this.parseInline(token.tokens, italicStyle), italicStyle);
|
|
154
168
|
}
|
|
155
169
|
|
|
156
170
|
case 'codespan':
|
|
157
171
|
{
|
|
158
|
-
return this.renderer.getTextNode(token.text, this.styles.codespan
|
|
172
|
+
return this.renderer.getTextNode(token.text, { ...this.styles.codespan,
|
|
173
|
+
...styles
|
|
174
|
+
});
|
|
159
175
|
}
|
|
160
176
|
|
|
161
177
|
case 'br':
|
|
@@ -169,9 +185,14 @@ class Parser {
|
|
|
169
185
|
}
|
|
170
186
|
|
|
171
187
|
case 'text':
|
|
188
|
+
case 'html':
|
|
172
189
|
{
|
|
173
|
-
|
|
174
|
-
|
|
190
|
+
if (token.raw.trim().length < 1) {
|
|
191
|
+
return null;
|
|
192
|
+
}
|
|
193
|
+
|
|
194
|
+
return this.renderer.getTextNode(token.raw, { ...this.styles.text,
|
|
195
|
+
...styles
|
|
175
196
|
});
|
|
176
197
|
}
|
|
177
198
|
|
|
@@ -182,7 +203,7 @@ class Parser {
|
|
|
182
203
|
}
|
|
183
204
|
}
|
|
184
205
|
});
|
|
185
|
-
return elements;
|
|
206
|
+
return elements.filter(element => element !== null);
|
|
186
207
|
}
|
|
187
208
|
|
|
188
209
|
}
|
|
@@ -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","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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"}
|
|
1
|
+
{"version":3,"names":["Parser","constructor","options","tokens","textStyle","tempTokens","siblingNodes","forEach","t","type","parsed","parseInline","length","push","renderer","getTextNode","styles","Renderer","headingStylesMap","h1","h2","h3","h4","h5","h6","parse","elements","map","token","paragraphChildren","getNormalizedSiblingNodesForBlockAndInlineTokens","text","getViewNode","paragraph","getBlockquoteNode","blockquote","depth","getCodeBlockNode","code","em","hr","li","items","item","children","cItem","listChildren","getListNode","ordered","list","filter","element","linkStyle","link","getLinkNode","href","getImageNode","boldStyle","strong","italicStyle","codespan","raw","trim","console","warn"],"sources":["Parser.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport 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: ReactNode[] = tokens.map((token) => {\n switch (token.type) {\n case 'space': {\n return null;\n }\n case 'paragraph': {\n const paragraphChildren =\n this.getNormalizedSiblingNodesForBlockAndInlineTokens(\n token.tokens,\n this.styles.text\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(\n this.parseInline(token.tokens, styles),\n styles\n );\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 const children = item.tokens.map((cItem) => {\n if (cItem.type === 'text') {\n /* getViewNode since tokens could contain a block like elements (i.e. img) */\n const listChildren =\n this.getNormalizedSiblingNodesForBlockAndInlineTokens(\n // @ts-ignore\n cItem.tokens,\n this.styles.li\n );\n return this.renderer.getViewNode(listChildren, this.styles.li);\n }\n\n /* Parse the nested token */\n return this.parse([cItem]);\n });\n return this.renderer.getViewNode(children, 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 return this.parseInline([token]);\n }\n });\n return elements.filter((element) => element !== null);\n }\n\n parseInline(tokens: marked.Token[], styles?: CustomStyleProp) {\n const elements: 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 ...this.styles.text,\n ...styles,\n });\n }\n case 'link': {\n const linkStyle = {\n ...styles,\n ...this.styles.link, // To override color property\n };\n return this.renderer.getLinkNode(\n this.parseInline(token.tokens, linkStyle),\n token.href,\n linkStyle\n );\n }\n case 'image': {\n return this.renderer.getImageNode(token.href);\n }\n case 'strong': {\n const boldStyle = {\n ...this.styles.strong,\n ...styles,\n };\n return this.renderer.getTextNode(\n this.parseInline(token.tokens, boldStyle),\n boldStyle\n );\n }\n case 'em': {\n const italicStyle = {\n ...this.styles.em,\n ...styles,\n };\n return this.renderer.getTextNode(\n this.parseInline(token.tokens, italicStyle),\n italicStyle\n );\n }\n case 'codespan': {\n return this.renderer.getTextNode(token.text, {\n ...this.styles.codespan,\n ...styles,\n });\n }\n case 'br': {\n return this.renderer.getTextNode('\\n', {});\n }\n case 'del': {\n return null;\n }\n case 'text':\n case 'html': {\n if (token.raw.trim().length < 1) {\n return null;\n }\n\n return this.renderer.getTextNode(token.raw, {\n ...this.styles.text,\n ...styles,\n });\n }\n default: {\n console.warn(`Token with '${token.type}' type was not found.`);\n return null;\n }\n }\n });\n return elements.filter((element) => element !== null);\n }\n\n private getNormalizedSiblingNodesForBlockAndInlineTokens = (\n tokens: marked.Token[],\n textStyle: TextStyleProp\n ): ReactNode[] => {\n let tempTokens: marked.Token[] = [];\n const siblingNodes: ReactNode[] = [];\n tokens.forEach((t) => {\n /**\n * To avoid inlining images\n * Note: to be extend for other token types\n */\n if (t.type === 'image') {\n const parsed = this.parseInline(tempTokens);\n if (parsed.length > 0) {\n siblingNodes.push(\n this.renderer.getTextNode(this.parseInline(tempTokens), textStyle)\n );\n }\n siblingNodes.push(this.parseInline([t]));\n tempTokens = [];\n return;\n }\n tempTokens = [...tempTokens, t];\n });\n\n /* Remaining temp tokens if any */\n if (tempTokens.length > 0) {\n siblingNodes.push(\n this.renderer.getTextNode(this.parseInline(tempTokens), {})\n );\n }\n return siblingNodes;\n };\n}\n\nexport default Parser;\n"],"mappings":"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"}
|
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
7
|
|
|
8
|
-
var
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
|
|
10
10
|
var _reactNative = require("react-native");
|
|
11
11
|
|
|
@@ -19,69 +19,67 @@ var _MDImage = _interopRequireDefault(require("./../components/MDImage"));
|
|
|
19
19
|
|
|
20
20
|
var _string = require("../utils/string");
|
|
21
21
|
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
22
|
+
var _handlers = require("../utils/handlers");
|
|
25
23
|
|
|
26
|
-
function
|
|
24
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
27
25
|
|
|
28
26
|
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; }
|
|
29
27
|
|
|
30
28
|
class Renderer {
|
|
31
29
|
constructor() {
|
|
32
|
-
_defineProperty(this, "onLinkPress", href => () => _reactNative.Linking.openURL(href));
|
|
33
|
-
|
|
34
30
|
_defineProperty(this, "getTextNode", (children, styles) => {
|
|
35
|
-
return /*#__PURE__*/
|
|
31
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
|
|
36
32
|
key: (0, _string.generateRandomString)(),
|
|
37
33
|
style: styles
|
|
38
34
|
}, children);
|
|
39
35
|
});
|
|
40
36
|
|
|
41
|
-
_defineProperty(this, "getLinkNode", (
|
|
42
|
-
return /*#__PURE__*/
|
|
37
|
+
_defineProperty(this, "getLinkNode", (children, href, styles) => {
|
|
38
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
|
|
43
39
|
key: (0, _string.generateRandomString)(),
|
|
44
|
-
onPress:
|
|
40
|
+
onPress: (0, _handlers.onLinkPress)(href),
|
|
45
41
|
style: styles
|
|
46
|
-
},
|
|
42
|
+
}, children);
|
|
47
43
|
});
|
|
48
44
|
}
|
|
49
45
|
|
|
50
46
|
getViewNode(children, styles) {
|
|
51
|
-
return /*#__PURE__*/
|
|
47
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
52
48
|
key: (0, _string.generateRandomString)(),
|
|
53
49
|
style: styles
|
|
54
50
|
}, children);
|
|
55
51
|
}
|
|
56
52
|
|
|
57
53
|
getCodeBlockNode(text, containerStyle, textStyle) {
|
|
58
|
-
return /*#__PURE__*/
|
|
54
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.ScrollView, {
|
|
55
|
+
key: (0, _string.generateRandomString)(),
|
|
59
56
|
contentContainerStyle: containerStyle,
|
|
60
57
|
horizontal: true
|
|
61
|
-
}, /*#__PURE__*/
|
|
58
|
+
}, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
|
|
62
59
|
style: textStyle
|
|
63
60
|
}, text));
|
|
64
61
|
}
|
|
65
62
|
|
|
66
63
|
getBlockquoteNode(children, styles) {
|
|
67
|
-
return /*#__PURE__*/
|
|
64
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
68
65
|
key: (0, _string.generateRandomString)(),
|
|
69
66
|
style: styles
|
|
70
67
|
}, children);
|
|
71
68
|
}
|
|
72
69
|
|
|
73
70
|
getImageNode(uri) {
|
|
74
|
-
return /*#__PURE__*/
|
|
71
|
+
return /*#__PURE__*/_react.default.createElement(_MDImage.default, {
|
|
75
72
|
key: (0, _string.generateRandomString)(),
|
|
76
73
|
uri: uri
|
|
77
74
|
});
|
|
78
75
|
}
|
|
79
76
|
|
|
80
77
|
getListNode(ordered, li, listStyle, textStyle) {
|
|
81
|
-
return /*#__PURE__*/
|
|
78
|
+
return /*#__PURE__*/_react.default.createElement(_reactNativeLi.default, {
|
|
82
79
|
counterRenderer: ordered ? _decimal.default : _disc.default,
|
|
83
80
|
markerTextStyle: textStyle,
|
|
84
|
-
markerBoxStyle: listStyle
|
|
81
|
+
markerBoxStyle: listStyle,
|
|
82
|
+
key: (0, _string.generateRandomString)()
|
|
85
83
|
}, li.map(node => node));
|
|
86
84
|
}
|
|
87
85
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Renderer","
|
|
1
|
+
{"version":3,"names":["Renderer","children","styles","generateRandomString","href","onLinkPress","getViewNode","getCodeBlockNode","text","containerStyle","textStyle","getBlockquoteNode","getImageNode","uri","getListNode","ordered","li","listStyle","Decimal","Disc","map","node"],"sources":["Renderer.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { 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';\nimport { onLinkPress } from '../utils/handlers';\n\nclass Renderer {\n getTextNode = (children: string | ReactNode[], styles: TextStyleProp) => {\n return (\n <Text key={generateRandomString()} style={styles}>\n {children}\n </Text>\n );\n };\n\n getLinkNode = (\n children: string | ReactNode[],\n href: string,\n styles: TextStyleProp\n ) => {\n return (\n <Text\n key={generateRandomString()}\n onPress={onLinkPress(href)}\n style={styles}\n >\n {children}\n </Text>\n );\n };\n\n getViewNode(children: 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\n key={generateRandomString()}\n contentContainerStyle={containerStyle}\n horizontal\n >\n <Text style={textStyle}>{text}</Text>\n </ScrollView>\n );\n }\n\n getBlockquoteNode(children: 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: ReactNode[],\n listStyle: ViewStyleProp,\n textStyle: TextStyleProp\n ) {\n return (\n <MarkedList\n counterRenderer={ordered ? Decimal : Disc}\n markerTextStyle={textStyle}\n markerBoxStyle={listStyle}\n key={generateRandomString()}\n >\n {li.map((node) => node)}\n </MarkedList>\n );\n }\n}\n\nexport default Renderer;\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAEA;;;;;;AAEA,MAAMA,QAAN,CAAe;EAAA;IAAA,qCACC,CAACC,QAAD,EAAiCC,MAAjC,KAA2D;MACvE,oBACE,6BAAC,iBAAD;QAAM,GAAG,EAAE,IAAAC,4BAAA,GAAX;QAAmC,KAAK,EAAED;MAA1C,GACGD,QADH,CADF;IAKD,CAPY;;IAAA,qCASC,CACZA,QADY,EAEZG,IAFY,EAGZF,MAHY,KAIT;MACH,oBACE,6BAAC,iBAAD;QACE,GAAG,EAAE,IAAAC,4BAAA,GADP;QAEE,OAAO,EAAE,IAAAE,qBAAA,EAAYD,IAAZ,CAFX;QAGE,KAAK,EAAEF;MAHT,GAKGD,QALH,CADF;IASD,CAvBY;EAAA;;EAyBbK,WAAW,CAACL,QAAD,EAA+BC,MAA/B,EAAsD;IAC/D,oBACE,6BAAC,iBAAD;MAAM,GAAG,EAAE,IAAAC,4BAAA,GAAX;MAAmC,KAAK,EAAED;IAA1C,GACGD,QADH,CADF;EAKD;;EAEDM,gBAAgB,CACdC,IADc,EAEdC,cAFc,EAGdC,SAHc,EAId;IACA,oBACE,6BAAC,uBAAD;MACE,GAAG,EAAE,IAAAP,4BAAA,GADP;MAEE,qBAAqB,EAAEM,cAFzB;MAGE,UAAU;IAHZ,gBAKE,6BAAC,iBAAD;MAAM,KAAK,EAAEC;IAAb,GAAyBF,IAAzB,CALF,CADF;EASD;;EAEDG,iBAAiB,CAACV,QAAD,EAAwBC,MAAxB,EAA+C;IAC9D,oBACE,6BAAC,iBAAD;MAAM,GAAG,EAAE,IAAAC,4BAAA,GAAX;MAAmC,KAAK,EAAED;IAA1C,GACGD,QADH,CADF;EAKD;;EAEDW,YAAY,CAACC,GAAD,EAAc;IACxB,oBAAO,6BAAC,gBAAD;MAAS,GAAG,EAAE,IAAAV,4BAAA,GAAd;MAAsC,GAAG,EAAEU;IAA3C,EAAP;EACD;;EAEDC,WAAW,CACTC,OADS,EAETC,EAFS,EAGTC,SAHS,EAITP,SAJS,EAKT;IACA,oBACE,6BAAC,sBAAD;MACE,eAAe,EAAEK,OAAO,GAAGG,gBAAH,GAAaC,aADvC;MAEE,eAAe,EAAET,SAFnB;MAGE,cAAc,EAAEO,SAHlB;MAIE,GAAG,EAAE,IAAAd,4BAAA;IAJP,GAMGa,EAAE,CAACI,GAAH,CAAQC,IAAD,IAAUA,IAAjB,CANH,CADF;EAUD;;AA7EY;;eAgFArB,Q"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["getFontStyles","theme","StyleSheet","create","regular","fontSize","lineHeight","color","colors","text","heading","fontWeight","getStyles","userStyles","colorScheme","getTheme","fontStyle","defaultStyles","container","backgroundColor","background","em","strong","paragraph","paddingVertical","link","blockquote","borderLeftColor","border","paddingLeft","borderLeftWidth","opacity","h1","marginVertical","letterSpacing","h2","h3","h4","h5","h6","codespan","code","padding","minWidth","hr","borderBottomWidth","borderBottomColor","li","flexShrink"],"sources":["styles.ts"],"sourcesContent":["import { ColorSchemeName, StyleSheet } from 'react-native';\nimport { getTheme } from './theme';\nimport type { MarkedStyles, Theme } from './types';\n\nconst getFontStyles = (theme: Theme) => {\n return StyleSheet.create({\n regular: {\n fontSize: 16,\n lineHeight: 24,\n color: theme.colors.text,\n },\n heading: {\n fontWeight: '500',\n color: theme.colors.text,\n },\n });\n};\n\nconst getStyles = (\n userStyles?: MarkedStyles,\n colorScheme?: ColorSchemeName\n): MarkedStyles => {\n const theme = getTheme(colorScheme || 'light');\n const fontStyle = getFontStyles(theme);\n const defaultStyles = StyleSheet.create<MarkedStyles>({\n container: {\n backgroundColor: theme.colors.background,\n },\n em: {\n ...fontStyle.regular,\n fontStyle: 'italic',\n },\n strong: {\n ...fontStyle.regular,\n fontWeight: 'bold',\n },\n text: {
|
|
1
|
+
{"version":3,"names":["getFontStyles","theme","StyleSheet","create","regular","fontSize","lineHeight","color","colors","text","heading","fontWeight","getStyles","userStyles","colorScheme","getTheme","fontStyle","defaultStyles","container","backgroundColor","background","em","strong","paragraph","paddingVertical","link","blockquote","borderLeftColor","border","paddingLeft","borderLeftWidth","opacity","h1","marginVertical","letterSpacing","h2","h3","h4","h5","h6","codespan","code","padding","minWidth","hr","borderBottomWidth","borderBottomColor","li","flexShrink"],"sources":["styles.ts"],"sourcesContent":["import { ColorSchemeName, StyleSheet } from 'react-native';\nimport { getTheme } from './theme';\nimport type { MarkedStyles, Theme } from './types';\n\nconst getFontStyles = (theme: Theme) => {\n return StyleSheet.create({\n regular: {\n fontSize: 16,\n lineHeight: 24,\n color: theme.colors.text,\n },\n heading: {\n fontWeight: '500',\n color: theme.colors.text,\n },\n });\n};\n\nconst getStyles = (\n userStyles?: MarkedStyles,\n colorScheme?: ColorSchemeName\n): MarkedStyles => {\n const theme = getTheme(colorScheme || 'light');\n const fontStyle = getFontStyles(theme);\n const defaultStyles = StyleSheet.create<MarkedStyles>({\n container: {\n backgroundColor: theme.colors.background,\n },\n em: {\n ...fontStyle.regular,\n fontStyle: 'italic',\n },\n strong: {\n ...fontStyle.regular,\n fontWeight: 'bold',\n },\n text: {\n ...fontStyle.regular,\n },\n paragraph: {\n ...fontStyle.regular,\n paddingVertical: 8,\n },\n link: {\n ...fontStyle.regular,\n fontStyle: 'italic',\n color: theme.colors.link,\n },\n blockquote: {\n borderLeftColor: theme.colors.border,\n paddingLeft: 16,\n borderLeftWidth: 5,\n opacity: 0.8,\n },\n h1: {\n fontSize: 32,\n lineHeight: 40,\n fontWeight: 'bold',\n marginVertical: 8,\n letterSpacing: 0,\n },\n h2: {\n ...fontStyle.heading,\n fontSize: 28,\n lineHeight: 36,\n marginVertical: 8,\n },\n h3: {\n ...fontStyle.heading,\n fontSize: 24,\n lineHeight: 32,\n marginVertical: 4,\n },\n h4: {\n ...fontStyle.heading,\n fontSize: 22,\n lineHeight: 28,\n marginVertical: 4,\n },\n h5: {\n ...fontStyle.regular,\n ...fontStyle.heading,\n marginVertical: 2,\n },\n h6: {\n ...fontStyle.heading,\n fontSize: 14,\n lineHeight: 20,\n marginVertical: 2,\n },\n codespan: {\n ...fontStyle.regular,\n fontStyle: 'italic',\n backgroundColor: theme.colors.code,\n fontWeight: '300',\n },\n code: {\n padding: 16,\n backgroundColor: theme.colors.code,\n minWidth: '100%',\n },\n hr: {\n borderBottomWidth: 1,\n borderBottomColor: theme.colors.border,\n marginVertical: 4,\n },\n li: {\n ...fontStyle.regular,\n flexShrink: 1,\n },\n });\n\n return {\n ...defaultStyles,\n ...userStyles,\n };\n};\n\nexport default getStyles;\n"],"mappings":"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"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.onLinkPress = void 0;
|
|
7
|
+
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
|
|
10
|
+
const onLinkPress = url => () => {
|
|
11
|
+
try {
|
|
12
|
+
_reactNative.Linking.openURL(url);
|
|
13
|
+
} catch (e) {
|
|
14
|
+
console.warn("URL can't be opened", e);
|
|
15
|
+
}
|
|
16
|
+
};
|
|
17
|
+
|
|
18
|
+
exports.onLinkPress = onLinkPress;
|
|
19
|
+
//# sourceMappingURL=handlers.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["onLinkPress","url","Linking","openURL","e","console","warn"],"sources":["handlers.ts"],"sourcesContent":["import { Linking } from 'react-native';\n\nexport const onLinkPress = (url: string) => () => {\n try {\n Linking.openURL(url);\n } catch (e) {\n console.warn(\"URL can't be opened\", e);\n }\n};\n"],"mappings":";;;;;;;AAAA;;AAEO,MAAMA,WAAW,GAAIC,GAAD,IAAiB,MAAM;EAChD,IAAI;IACFC,oBAAA,CAAQC,OAAR,CAAgBF,GAAhB;EACD,CAFD,CAEE,OAAOG,CAAP,EAAU;IACVC,OAAO,CAACC,IAAR,CAAa,qBAAb,EAAoCF,CAApC;EACD;AACF,CANM"}
|
|
@@ -10,6 +10,37 @@ class Parser {
|
|
|
10
10
|
|
|
11
11
|
_defineProperty(this, "headingStylesMap", void 0);
|
|
12
12
|
|
|
13
|
+
_defineProperty(this, "getNormalizedSiblingNodesForBlockAndInlineTokens", (tokens, textStyle) => {
|
|
14
|
+
let tempTokens = [];
|
|
15
|
+
const siblingNodes = [];
|
|
16
|
+
tokens.forEach(t => {
|
|
17
|
+
/**
|
|
18
|
+
* To avoid inlining images
|
|
19
|
+
* Note: to be extend for other token types
|
|
20
|
+
*/
|
|
21
|
+
if (t.type === 'image') {
|
|
22
|
+
const parsed = this.parseInline(tempTokens);
|
|
23
|
+
|
|
24
|
+
if (parsed.length > 0) {
|
|
25
|
+
siblingNodes.push(this.renderer.getTextNode(this.parseInline(tempTokens), textStyle));
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
siblingNodes.push(this.parseInline([t]));
|
|
29
|
+
tempTokens = [];
|
|
30
|
+
return;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
tempTokens = [...tempTokens, t];
|
|
34
|
+
});
|
|
35
|
+
/* Remaining temp tokens if any */
|
|
36
|
+
|
|
37
|
+
if (tempTokens.length > 0) {
|
|
38
|
+
siblingNodes.push(this.renderer.getTextNode(this.parseInline(tempTokens), {}));
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
return siblingNodes;
|
|
42
|
+
});
|
|
43
|
+
|
|
13
44
|
this.styles = { ...options.styles
|
|
14
45
|
};
|
|
15
46
|
this.renderer = new Renderer();
|
|
@@ -33,24 +64,7 @@ class Parser {
|
|
|
33
64
|
|
|
34
65
|
case 'paragraph':
|
|
35
66
|
{
|
|
36
|
-
|
|
37
|
-
const paragraphChildren = [];
|
|
38
|
-
token.tokens.forEach(t => {
|
|
39
|
-
/* To avoid inlining of image */
|
|
40
|
-
if (t.type === 'image') {
|
|
41
|
-
paragraphChildren.push(this.renderer.getTextNode(this.parseInline(tempTokens), this.styles.text));
|
|
42
|
-
paragraphChildren.push(this.parseInline([t]));
|
|
43
|
-
tempTokens = [];
|
|
44
|
-
return;
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
tempTokens = [...tempTokens, t];
|
|
48
|
-
});
|
|
49
|
-
|
|
50
|
-
if (tempTokens.length > 0) {
|
|
51
|
-
paragraphChildren.push(this.renderer.getTextNode(this.parseInline(tempTokens), {}));
|
|
52
|
-
}
|
|
53
|
-
|
|
67
|
+
const paragraphChildren = this.getNormalizedSiblingNodesForBlockAndInlineTokens(token.tokens, this.styles.text);
|
|
54
68
|
return this.renderer.getViewNode(paragraphChildren, this.styles.paragraph);
|
|
55
69
|
}
|
|
56
70
|
|
|
@@ -62,7 +76,7 @@ class Parser {
|
|
|
62
76
|
case 'heading':
|
|
63
77
|
{
|
|
64
78
|
const styles = this.headingStylesMap[token.depth] ?? this.styles.text;
|
|
65
|
-
return this.renderer.getTextNode(token.
|
|
79
|
+
return this.renderer.getTextNode(this.parseInline(token.tokens, styles), styles);
|
|
66
80
|
}
|
|
67
81
|
|
|
68
82
|
case 'code':
|
|
@@ -78,32 +92,28 @@ class Parser {
|
|
|
78
92
|
case 'list':
|
|
79
93
|
{
|
|
80
94
|
const li = token.items.map(item => {
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
95
|
+
const children = item.tokens.map(cItem => {
|
|
96
|
+
if (cItem.type === 'text') {
|
|
97
|
+
/* getViewNode since tokens could contain a block like elements (i.e. img) */
|
|
98
|
+
const listChildren = this.getNormalizedSiblingNodesForBlockAndInlineTokens( // @ts-ignore
|
|
99
|
+
cItem.tokens, this.styles.li);
|
|
100
|
+
return this.renderer.getViewNode(listChildren, this.styles.li);
|
|
101
|
+
}
|
|
102
|
+
/* Parse the nested token */
|
|
103
|
+
|
|
104
|
+
|
|
105
|
+
return this.parse([cItem]);
|
|
106
|
+
});
|
|
107
|
+
return this.renderer.getViewNode(children, this.styles.li);
|
|
92
108
|
});
|
|
93
109
|
return this.renderer.getListNode(token.ordered, li, this.styles.list, this.styles.li);
|
|
94
110
|
}
|
|
95
111
|
|
|
96
|
-
case 'html':
|
|
97
|
-
{
|
|
98
|
-
return this.renderer.getTextNode(token.text.trim(), this.styles.text);
|
|
99
|
-
}
|
|
100
|
-
|
|
101
112
|
default:
|
|
102
|
-
|
|
103
|
-
return null;
|
|
113
|
+
return this.parseInline([token]);
|
|
104
114
|
}
|
|
105
115
|
});
|
|
106
|
-
return elements;
|
|
116
|
+
return elements.filter(element => element !== null);
|
|
107
117
|
}
|
|
108
118
|
|
|
109
119
|
parseInline(tokens, styles) {
|
|
@@ -113,16 +123,18 @@ class Parser {
|
|
|
113
123
|
switch (token.type) {
|
|
114
124
|
case 'escape':
|
|
115
125
|
{
|
|
116
|
-
return this.renderer.getTextNode(token.text, { ...styles,
|
|
117
|
-
...
|
|
126
|
+
return this.renderer.getTextNode(token.text, { ...this.styles.text,
|
|
127
|
+
...styles
|
|
118
128
|
});
|
|
119
129
|
}
|
|
120
130
|
|
|
121
131
|
case 'link':
|
|
122
132
|
{
|
|
123
|
-
|
|
124
|
-
...this.styles.link
|
|
125
|
-
|
|
133
|
+
const linkStyle = { ...styles,
|
|
134
|
+
...this.styles.link // To override color property
|
|
135
|
+
|
|
136
|
+
};
|
|
137
|
+
return this.renderer.getLinkNode(this.parseInline(token.tokens, linkStyle), token.href, linkStyle);
|
|
126
138
|
}
|
|
127
139
|
|
|
128
140
|
case 'image':
|
|
@@ -132,21 +144,25 @@ class Parser {
|
|
|
132
144
|
|
|
133
145
|
case 'strong':
|
|
134
146
|
{
|
|
135
|
-
|
|
136
|
-
...
|
|
137
|
-
}
|
|
147
|
+
const boldStyle = { ...this.styles.strong,
|
|
148
|
+
...styles
|
|
149
|
+
};
|
|
150
|
+
return this.renderer.getTextNode(this.parseInline(token.tokens, boldStyle), boldStyle);
|
|
138
151
|
}
|
|
139
152
|
|
|
140
153
|
case 'em':
|
|
141
154
|
{
|
|
142
|
-
|
|
143
|
-
...
|
|
144
|
-
}
|
|
155
|
+
const italicStyle = { ...this.styles.em,
|
|
156
|
+
...styles
|
|
157
|
+
};
|
|
158
|
+
return this.renderer.getTextNode(this.parseInline(token.tokens, italicStyle), italicStyle);
|
|
145
159
|
}
|
|
146
160
|
|
|
147
161
|
case 'codespan':
|
|
148
162
|
{
|
|
149
|
-
return this.renderer.getTextNode(token.text, this.styles.codespan
|
|
163
|
+
return this.renderer.getTextNode(token.text, { ...this.styles.codespan,
|
|
164
|
+
...styles
|
|
165
|
+
});
|
|
150
166
|
}
|
|
151
167
|
|
|
152
168
|
case 'br':
|
|
@@ -160,9 +176,14 @@ class Parser {
|
|
|
160
176
|
}
|
|
161
177
|
|
|
162
178
|
case 'text':
|
|
179
|
+
case 'html':
|
|
163
180
|
{
|
|
164
|
-
|
|
165
|
-
|
|
181
|
+
if (token.raw.trim().length < 1) {
|
|
182
|
+
return null;
|
|
183
|
+
}
|
|
184
|
+
|
|
185
|
+
return this.renderer.getTextNode(token.raw, { ...this.styles.text,
|
|
186
|
+
...styles
|
|
166
187
|
});
|
|
167
188
|
}
|
|
168
189
|
|
|
@@ -173,7 +194,7 @@ class Parser {
|
|
|
173
194
|
}
|
|
174
195
|
}
|
|
175
196
|
});
|
|
176
|
-
return elements;
|
|
197
|
+
return elements.filter(element => element !== null);
|
|
177
198
|
}
|
|
178
199
|
|
|
179
200
|
}
|
|
@@ -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","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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"}
|
|
1
|
+
{"version":3,"names":["Renderer","Parser","constructor","options","tokens","textStyle","tempTokens","siblingNodes","forEach","t","type","parsed","parseInline","length","push","renderer","getTextNode","styles","headingStylesMap","h1","h2","h3","h4","h5","h6","parse","elements","map","token","paragraphChildren","getNormalizedSiblingNodesForBlockAndInlineTokens","text","getViewNode","paragraph","getBlockquoteNode","blockquote","depth","getCodeBlockNode","code","em","hr","li","items","item","children","cItem","listChildren","getListNode","ordered","list","filter","element","linkStyle","link","getLinkNode","href","getImageNode","boldStyle","strong","italicStyle","codespan","raw","trim","console","warn"],"sources":["Parser.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport 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: ReactNode[] = tokens.map((token) => {\n switch (token.type) {\n case 'space': {\n return null;\n }\n case 'paragraph': {\n const paragraphChildren =\n this.getNormalizedSiblingNodesForBlockAndInlineTokens(\n token.tokens,\n this.styles.text\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(\n this.parseInline(token.tokens, styles),\n styles\n );\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 const children = item.tokens.map((cItem) => {\n if (cItem.type === 'text') {\n /* getViewNode since tokens could contain a block like elements (i.e. img) */\n const listChildren =\n this.getNormalizedSiblingNodesForBlockAndInlineTokens(\n // @ts-ignore\n cItem.tokens,\n this.styles.li\n );\n return this.renderer.getViewNode(listChildren, this.styles.li);\n }\n\n /* Parse the nested token */\n return this.parse([cItem]);\n });\n return this.renderer.getViewNode(children, 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 return this.parseInline([token]);\n }\n });\n return elements.filter((element) => element !== null);\n }\n\n parseInline(tokens: marked.Token[], styles?: CustomStyleProp) {\n const elements: 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 ...this.styles.text,\n ...styles,\n });\n }\n case 'link': {\n const linkStyle = {\n ...styles,\n ...this.styles.link, // To override color property\n };\n return this.renderer.getLinkNode(\n this.parseInline(token.tokens, linkStyle),\n token.href,\n linkStyle\n );\n }\n case 'image': {\n return this.renderer.getImageNode(token.href);\n }\n case 'strong': {\n const boldStyle = {\n ...this.styles.strong,\n ...styles,\n };\n return this.renderer.getTextNode(\n this.parseInline(token.tokens, boldStyle),\n boldStyle\n );\n }\n case 'em': {\n const italicStyle = {\n ...this.styles.em,\n ...styles,\n };\n return this.renderer.getTextNode(\n this.parseInline(token.tokens, italicStyle),\n italicStyle\n );\n }\n case 'codespan': {\n return this.renderer.getTextNode(token.text, {\n ...this.styles.codespan,\n ...styles,\n });\n }\n case 'br': {\n return this.renderer.getTextNode('\\n', {});\n }\n case 'del': {\n return null;\n }\n case 'text':\n case 'html': {\n if (token.raw.trim().length < 1) {\n return null;\n }\n\n return this.renderer.getTextNode(token.raw, {\n ...this.styles.text,\n ...styles,\n });\n }\n default: {\n console.warn(`Token with '${token.type}' type was not found.`);\n return null;\n }\n }\n });\n return elements.filter((element) => element !== null);\n }\n\n private getNormalizedSiblingNodesForBlockAndInlineTokens = (\n tokens: marked.Token[],\n textStyle: TextStyleProp\n ): ReactNode[] => {\n let tempTokens: marked.Token[] = [];\n const siblingNodes: ReactNode[] = [];\n tokens.forEach((t) => {\n /**\n * To avoid inlining images\n * Note: to be extend for other token types\n */\n if (t.type === 'image') {\n const parsed = this.parseInline(tempTokens);\n if (parsed.length > 0) {\n siblingNodes.push(\n this.renderer.getTextNode(this.parseInline(tempTokens), textStyle)\n );\n }\n siblingNodes.push(this.parseInline([t]));\n tempTokens = [];\n return;\n }\n tempTokens = [...tempTokens, t];\n });\n\n /* Remaining temp tokens if any */\n if (tempTokens.length > 0) {\n siblingNodes.push(\n this.renderer.getTextNode(this.parseInline(tempTokens), {})\n );\n }\n return siblingNodes;\n };\n}\n\nexport default Parser;\n"],"mappings":"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"}
|
|
@@ -1,17 +1,16 @@
|
|
|
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
|
-
import
|
|
4
|
-
import {
|
|
3
|
+
import React from 'react';
|
|
4
|
+
import { ScrollView, View, Text } from 'react-native';
|
|
5
5
|
import MarkedList from '@jsamr/react-native-li';
|
|
6
6
|
import Disc from '@jsamr/counter-style/presets/disc';
|
|
7
7
|
import Decimal from '@jsamr/counter-style/presets/decimal';
|
|
8
8
|
import MDImage from './../components/MDImage';
|
|
9
9
|
import { generateRandomString } from '../utils/string';
|
|
10
|
+
import { onLinkPress } from '../utils/handlers';
|
|
10
11
|
|
|
11
12
|
class Renderer {
|
|
12
13
|
constructor() {
|
|
13
|
-
_defineProperty(this, "onLinkPress", href => () => Linking.openURL(href));
|
|
14
|
-
|
|
15
14
|
_defineProperty(this, "getTextNode", (children, styles) => {
|
|
16
15
|
return /*#__PURE__*/React.createElement(Text, {
|
|
17
16
|
key: generateRandomString(),
|
|
@@ -19,12 +18,12 @@ class Renderer {
|
|
|
19
18
|
}, children);
|
|
20
19
|
});
|
|
21
20
|
|
|
22
|
-
_defineProperty(this, "getLinkNode", (
|
|
21
|
+
_defineProperty(this, "getLinkNode", (children, href, styles) => {
|
|
23
22
|
return /*#__PURE__*/React.createElement(Text, {
|
|
24
23
|
key: generateRandomString(),
|
|
25
|
-
onPress:
|
|
24
|
+
onPress: onLinkPress(href),
|
|
26
25
|
style: styles
|
|
27
|
-
},
|
|
26
|
+
}, children);
|
|
28
27
|
});
|
|
29
28
|
}
|
|
30
29
|
|
|
@@ -37,6 +36,7 @@ class Renderer {
|
|
|
37
36
|
|
|
38
37
|
getCodeBlockNode(text, containerStyle, textStyle) {
|
|
39
38
|
return /*#__PURE__*/React.createElement(ScrollView, {
|
|
39
|
+
key: generateRandomString(),
|
|
40
40
|
contentContainerStyle: containerStyle,
|
|
41
41
|
horizontal: true
|
|
42
42
|
}, /*#__PURE__*/React.createElement(Text, {
|
|
@@ -62,7 +62,8 @@ class Renderer {
|
|
|
62
62
|
return /*#__PURE__*/React.createElement(MarkedList, {
|
|
63
63
|
counterRenderer: ordered ? Decimal : Disc,
|
|
64
64
|
markerTextStyle: textStyle,
|
|
65
|
-
markerBoxStyle: listStyle
|
|
65
|
+
markerBoxStyle: listStyle,
|
|
66
|
+
key: generateRandomString()
|
|
66
67
|
}, li.map(node => node));
|
|
67
68
|
}
|
|
68
69
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","
|
|
1
|
+
{"version":3,"names":["React","ScrollView","View","Text","MarkedList","Disc","Decimal","MDImage","generateRandomString","onLinkPress","Renderer","children","styles","href","getViewNode","getCodeBlockNode","text","containerStyle","textStyle","getBlockquoteNode","getImageNode","uri","getListNode","ordered","li","listStyle","map","node"],"sources":["Renderer.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { 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';\nimport { onLinkPress } from '../utils/handlers';\n\nclass Renderer {\n getTextNode = (children: string | ReactNode[], styles: TextStyleProp) => {\n return (\n <Text key={generateRandomString()} style={styles}>\n {children}\n </Text>\n );\n };\n\n getLinkNode = (\n children: string | ReactNode[],\n href: string,\n styles: TextStyleProp\n ) => {\n return (\n <Text\n key={generateRandomString()}\n onPress={onLinkPress(href)}\n style={styles}\n >\n {children}\n </Text>\n );\n };\n\n getViewNode(children: 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\n key={generateRandomString()}\n contentContainerStyle={containerStyle}\n horizontal\n >\n <Text style={textStyle}>{text}</Text>\n </ScrollView>\n );\n }\n\n getBlockquoteNode(children: 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: ReactNode[],\n listStyle: ViewStyleProp,\n textStyle: TextStyleProp\n ) {\n return (\n <MarkedList\n counterRenderer={ordered ? Decimal : Disc}\n markerTextStyle={textStyle}\n markerBoxStyle={listStyle}\n key={generateRandomString()}\n >\n {li.map((node) => node)}\n </MarkedList>\n );\n }\n}\n\nexport default Renderer;\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAiC,OAAjC;AACA,SAASC,UAAT,EAAqBC,IAArB,EAA2BC,IAA3B,QAAuC,cAAvC;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;AAEA,SAASC,WAAT,QAA4B,mBAA5B;;AAEA,MAAMC,QAAN,CAAe;EAAA;IAAA,qCACC,CAACC,QAAD,EAAiCC,MAAjC,KAA2D;MACvE,oBACE,oBAAC,IAAD;QAAM,GAAG,EAAEJ,oBAAoB,EAA/B;QAAmC,KAAK,EAAEI;MAA1C,GACGD,QADH,CADF;IAKD,CAPY;;IAAA,qCASC,CACZA,QADY,EAEZE,IAFY,EAGZD,MAHY,KAIT;MACH,oBACE,oBAAC,IAAD;QACE,GAAG,EAAEJ,oBAAoB,EAD3B;QAEE,OAAO,EAAEC,WAAW,CAACI,IAAD,CAFtB;QAGE,KAAK,EAAED;MAHT,GAKGD,QALH,CADF;IASD,CAvBY;EAAA;;EAyBbG,WAAW,CAACH,QAAD,EAA+BC,MAA/B,EAAsD;IAC/D,oBACE,oBAAC,IAAD;MAAM,GAAG,EAAEJ,oBAAoB,EAA/B;MAAmC,KAAK,EAAEI;IAA1C,GACGD,QADH,CADF;EAKD;;EAEDI,gBAAgB,CACdC,IADc,EAEdC,cAFc,EAGdC,SAHc,EAId;IACA,oBACE,oBAAC,UAAD;MACE,GAAG,EAAEV,oBAAoB,EAD3B;MAEE,qBAAqB,EAAES,cAFzB;MAGE,UAAU;IAHZ,gBAKE,oBAAC,IAAD;MAAM,KAAK,EAAEC;IAAb,GAAyBF,IAAzB,CALF,CADF;EASD;;EAEDG,iBAAiB,CAACR,QAAD,EAAwBC,MAAxB,EAA+C;IAC9D,oBACE,oBAAC,IAAD;MAAM,GAAG,EAAEJ,oBAAoB,EAA/B;MAAmC,KAAK,EAAEI;IAA1C,GACGD,QADH,CADF;EAKD;;EAEDS,YAAY,CAACC,GAAD,EAAc;IACxB,oBAAO,oBAAC,OAAD;MAAS,GAAG,EAAEb,oBAAoB,EAAlC;MAAsC,GAAG,EAAEa;IAA3C,EAAP;EACD;;EAEDC,WAAW,CACTC,OADS,EAETC,EAFS,EAGTC,SAHS,EAITP,SAJS,EAKT;IACA,oBACE,oBAAC,UAAD;MACE,eAAe,EAAEK,OAAO,GAAGjB,OAAH,GAAaD,IADvC;MAEE,eAAe,EAAEa,SAFnB;MAGE,cAAc,EAAEO,SAHlB;MAIE,GAAG,EAAEjB,oBAAoB;IAJ3B,GAMGgB,EAAE,CAACE,GAAH,CAAQC,IAAD,IAAUA,IAAjB,CANH,CADF;EAUD;;AA7EY;;AAgFf,eAAejB,QAAf"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["StyleSheet","getTheme","getFontStyles","theme","create","regular","fontSize","lineHeight","color","colors","text","heading","fontWeight","getStyles","userStyles","colorScheme","fontStyle","defaultStyles","container","backgroundColor","background","em","strong","paragraph","paddingVertical","link","blockquote","borderLeftColor","border","paddingLeft","borderLeftWidth","opacity","h1","marginVertical","letterSpacing","h2","h3","h4","h5","h6","codespan","code","padding","minWidth","hr","borderBottomWidth","borderBottomColor","li","flexShrink"],"sources":["styles.ts"],"sourcesContent":["import { ColorSchemeName, StyleSheet } from 'react-native';\nimport { getTheme } from './theme';\nimport type { MarkedStyles, Theme } from './types';\n\nconst getFontStyles = (theme: Theme) => {\n return StyleSheet.create({\n regular: {\n fontSize: 16,\n lineHeight: 24,\n color: theme.colors.text,\n },\n heading: {\n fontWeight: '500',\n color: theme.colors.text,\n },\n });\n};\n\nconst getStyles = (\n userStyles?: MarkedStyles,\n colorScheme?: ColorSchemeName\n): MarkedStyles => {\n const theme = getTheme(colorScheme || 'light');\n const fontStyle = getFontStyles(theme);\n const defaultStyles = StyleSheet.create<MarkedStyles>({\n container: {\n backgroundColor: theme.colors.background,\n },\n em: {\n ...fontStyle.regular,\n fontStyle: 'italic',\n },\n strong: {\n ...fontStyle.regular,\n fontWeight: 'bold',\n },\n text: {
|
|
1
|
+
{"version":3,"names":["StyleSheet","getTheme","getFontStyles","theme","create","regular","fontSize","lineHeight","color","colors","text","heading","fontWeight","getStyles","userStyles","colorScheme","fontStyle","defaultStyles","container","backgroundColor","background","em","strong","paragraph","paddingVertical","link","blockquote","borderLeftColor","border","paddingLeft","borderLeftWidth","opacity","h1","marginVertical","letterSpacing","h2","h3","h4","h5","h6","codespan","code","padding","minWidth","hr","borderBottomWidth","borderBottomColor","li","flexShrink"],"sources":["styles.ts"],"sourcesContent":["import { ColorSchemeName, StyleSheet } from 'react-native';\nimport { getTheme } from './theme';\nimport type { MarkedStyles, Theme } from './types';\n\nconst getFontStyles = (theme: Theme) => {\n return StyleSheet.create({\n regular: {\n fontSize: 16,\n lineHeight: 24,\n color: theme.colors.text,\n },\n heading: {\n fontWeight: '500',\n color: theme.colors.text,\n },\n });\n};\n\nconst getStyles = (\n userStyles?: MarkedStyles,\n colorScheme?: ColorSchemeName\n): MarkedStyles => {\n const theme = getTheme(colorScheme || 'light');\n const fontStyle = getFontStyles(theme);\n const defaultStyles = StyleSheet.create<MarkedStyles>({\n container: {\n backgroundColor: theme.colors.background,\n },\n em: {\n ...fontStyle.regular,\n fontStyle: 'italic',\n },\n strong: {\n ...fontStyle.regular,\n fontWeight: 'bold',\n },\n text: {\n ...fontStyle.regular,\n },\n paragraph: {\n ...fontStyle.regular,\n paddingVertical: 8,\n },\n link: {\n ...fontStyle.regular,\n fontStyle: 'italic',\n color: theme.colors.link,\n },\n blockquote: {\n borderLeftColor: theme.colors.border,\n paddingLeft: 16,\n borderLeftWidth: 5,\n opacity: 0.8,\n },\n h1: {\n fontSize: 32,\n lineHeight: 40,\n fontWeight: 'bold',\n marginVertical: 8,\n letterSpacing: 0,\n },\n h2: {\n ...fontStyle.heading,\n fontSize: 28,\n lineHeight: 36,\n marginVertical: 8,\n },\n h3: {\n ...fontStyle.heading,\n fontSize: 24,\n lineHeight: 32,\n marginVertical: 4,\n },\n h4: {\n ...fontStyle.heading,\n fontSize: 22,\n lineHeight: 28,\n marginVertical: 4,\n },\n h5: {\n ...fontStyle.regular,\n ...fontStyle.heading,\n marginVertical: 2,\n },\n h6: {\n ...fontStyle.heading,\n fontSize: 14,\n lineHeight: 20,\n marginVertical: 2,\n },\n codespan: {\n ...fontStyle.regular,\n fontStyle: 'italic',\n backgroundColor: theme.colors.code,\n fontWeight: '300',\n },\n code: {\n padding: 16,\n backgroundColor: theme.colors.code,\n minWidth: '100%',\n },\n hr: {\n borderBottomWidth: 1,\n borderBottomColor: theme.colors.border,\n marginVertical: 4,\n },\n li: {\n ...fontStyle.regular,\n flexShrink: 1,\n },\n });\n\n return {\n ...defaultStyles,\n ...userStyles,\n };\n};\n\nexport default getStyles;\n"],"mappings":"AAAA,SAA0BA,UAA1B,QAA4C,cAA5C;AACA,SAASC,QAAT,QAAyB,SAAzB;;AAGA,MAAMC,aAAa,GAAIC,KAAD,IAAkB;EACtC,OAAOH,UAAU,CAACI,MAAX,CAAkB;IACvBC,OAAO,EAAE;MACPC,QAAQ,EAAE,EADH;MAEPC,UAAU,EAAE,EAFL;MAGPC,KAAK,EAAEL,KAAK,CAACM,MAAN,CAAaC;IAHb,CADc;IAMvBC,OAAO,EAAE;MACPC,UAAU,EAAE,KADL;MAEPJ,KAAK,EAAEL,KAAK,CAACM,MAAN,CAAaC;IAFb;EANc,CAAlB,CAAP;AAWD,CAZD;;AAcA,MAAMG,SAAS,GAAG,CAChBC,UADgB,EAEhBC,WAFgB,KAGC;EACjB,MAAMZ,KAAK,GAAGF,QAAQ,CAACc,WAAW,IAAI,OAAhB,CAAtB;EACA,MAAMC,SAAS,GAAGd,aAAa,CAACC,KAAD,CAA/B;EACA,MAAMc,aAAa,GAAGjB,UAAU,CAACI,MAAX,CAAgC;IACpDc,SAAS,EAAE;MACTC,eAAe,EAAEhB,KAAK,CAACM,MAAN,CAAaW;IADrB,CADyC;IAIpDC,EAAE,EAAE,EACF,GAAGL,SAAS,CAACX,OADX;MAEFW,SAAS,EAAE;IAFT,CAJgD;IAQpDM,MAAM,EAAE,EACN,GAAGN,SAAS,CAACX,OADP;MAENO,UAAU,EAAE;IAFN,CAR4C;IAYpDF,IAAI,EAAE,EACJ,GAAGM,SAAS,CAACX;IADT,CAZ8C;IAepDkB,SAAS,EAAE,EACT,GAAGP,SAAS,CAACX,OADJ;MAETmB,eAAe,EAAE;IAFR,CAfyC;IAmBpDC,IAAI,EAAE,EACJ,GAAGT,SAAS,CAACX,OADT;MAEJW,SAAS,EAAE,QAFP;MAGJR,KAAK,EAAEL,KAAK,CAACM,MAAN,CAAagB;IAHhB,CAnB8C;IAwBpDC,UAAU,EAAE;MACVC,eAAe,EAAExB,KAAK,CAACM,MAAN,CAAamB,MADpB;MAEVC,WAAW,EAAE,EAFH;MAGVC,eAAe,EAAE,CAHP;MAIVC,OAAO,EAAE;IAJC,CAxBwC;IA8BpDC,EAAE,EAAE;MACF1B,QAAQ,EAAE,EADR;MAEFC,UAAU,EAAE,EAFV;MAGFK,UAAU,EAAE,MAHV;MAIFqB,cAAc,EAAE,CAJd;MAKFC,aAAa,EAAE;IALb,CA9BgD;IAqCpDC,EAAE,EAAE,EACF,GAAGnB,SAAS,CAACL,OADX;MAEFL,QAAQ,EAAE,EAFR;MAGFC,UAAU,EAAE,EAHV;MAIF0B,cAAc,EAAE;IAJd,CArCgD;IA2CpDG,EAAE,EAAE,EACF,GAAGpB,SAAS,CAACL,OADX;MAEFL,QAAQ,EAAE,EAFR;MAGFC,UAAU,EAAE,EAHV;MAIF0B,cAAc,EAAE;IAJd,CA3CgD;IAiDpDI,EAAE,EAAE,EACF,GAAGrB,SAAS,CAACL,OADX;MAEFL,QAAQ,EAAE,EAFR;MAGFC,UAAU,EAAE,EAHV;MAIF0B,cAAc,EAAE;IAJd,CAjDgD;IAuDpDK,EAAE,EAAE,EACF,GAAGtB,SAAS,CAACX,OADX;MAEF,GAAGW,SAAS,CAACL,OAFX;MAGFsB,cAAc,EAAE;IAHd,CAvDgD;IA4DpDM,EAAE,EAAE,EACF,GAAGvB,SAAS,CAACL,OADX;MAEFL,QAAQ,EAAE,EAFR;MAGFC,UAAU,EAAE,EAHV;MAIF0B,cAAc,EAAE;IAJd,CA5DgD;IAkEpDO,QAAQ,EAAE,EACR,GAAGxB,SAAS,CAACX,OADL;MAERW,SAAS,EAAE,QAFH;MAGRG,eAAe,EAAEhB,KAAK,CAACM,MAAN,CAAagC,IAHtB;MAIR7B,UAAU,EAAE;IAJJ,CAlE0C;IAwEpD6B,IAAI,EAAE;MACJC,OAAO,EAAE,EADL;MAEJvB,eAAe,EAAEhB,KAAK,CAACM,MAAN,CAAagC,IAF1B;MAGJE,QAAQ,EAAE;IAHN,CAxE8C;IA6EpDC,EAAE,EAAE;MACFC,iBAAiB,EAAE,CADjB;MAEFC,iBAAiB,EAAE3C,KAAK,CAACM,MAAN,CAAamB,MAF9B;MAGFK,cAAc,EAAE;IAHd,CA7EgD;IAkFpDc,EAAE,EAAE,EACF,GAAG/B,SAAS,CAACX,OADX;MAEF2C,UAAU,EAAE;IAFV;EAlFgD,CAAhC,CAAtB;EAwFA,OAAO,EACL,GAAG/B,aADE;IAEL,GAAGH;EAFE,CAAP;AAID,CAlGD;;AAoGA,eAAeD,SAAf"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["Linking","onLinkPress","url","openURL","e","console","warn"],"sources":["handlers.ts"],"sourcesContent":["import { Linking } from 'react-native';\n\nexport const onLinkPress = (url: string) => () => {\n try {\n Linking.openURL(url);\n } catch (e) {\n console.warn(\"URL can't be opened\", e);\n }\n};\n"],"mappings":"AAAA,SAASA,OAAT,QAAwB,cAAxB;AAEA,OAAO,MAAMC,WAAW,GAAIC,GAAD,IAAiB,MAAM;EAChD,IAAI;IACFF,OAAO,CAACG,OAAR,CAAgBD,GAAhB;EACD,CAFD,CAEE,OAAOE,CAAP,EAAU;IACVC,OAAO,CAACC,IAAR,CAAa,qBAAb,EAAoCF,CAApC;EACD;AACF,CANM"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
import type { ReactNode } from 'react';
|
|
2
2
|
import type { marked } from 'marked';
|
|
3
3
|
import type { CustomStyleProp, ParserOptions } from './types';
|
|
4
4
|
declare class Parser {
|
|
@@ -6,7 +6,8 @@ declare class Parser {
|
|
|
6
6
|
private styles;
|
|
7
7
|
private headingStylesMap;
|
|
8
8
|
constructor(options: ParserOptions);
|
|
9
|
-
parse(tokens: marked.Token[]):
|
|
10
|
-
parseInline(tokens: marked.Token[], styles?: CustomStyleProp):
|
|
9
|
+
parse(tokens: marked.Token[]): ReactNode[];
|
|
10
|
+
parseInline(tokens: marked.Token[], styles?: CustomStyleProp): ReactNode[];
|
|
11
|
+
private getNormalizedSiblingNodesForBlockAndInlineTokens;
|
|
11
12
|
}
|
|
12
13
|
export default Parser;
|
|
@@ -1,13 +1,12 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
2
|
import type { TextStyleProp, ViewStyleProp } from './types';
|
|
3
3
|
declare class Renderer {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
getViewNode(children: React.ReactNode[] | null, styles: ViewStyleProp): JSX.Element;
|
|
4
|
+
getTextNode: (children: string | ReactNode[], styles: TextStyleProp) => JSX.Element;
|
|
5
|
+
getLinkNode: (children: string | ReactNode[], href: string, styles: TextStyleProp) => JSX.Element;
|
|
6
|
+
getViewNode(children: ReactNode[] | null, styles: ViewStyleProp): JSX.Element;
|
|
8
7
|
getCodeBlockNode(text: string, containerStyle: ViewStyleProp, textStyle: TextStyleProp): JSX.Element;
|
|
9
|
-
getBlockquoteNode(children:
|
|
8
|
+
getBlockquoteNode(children: ReactNode[], styles: ViewStyleProp): JSX.Element;
|
|
10
9
|
getImageNode(uri: string): JSX.Element;
|
|
11
|
-
getListNode(ordered: boolean, li:
|
|
10
|
+
getListNode(ordered: boolean, li: ReactNode[], listStyle: ViewStyleProp, textStyle: TextStyleProp): JSX.Element;
|
|
12
11
|
}
|
|
13
12
|
export default Renderer;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const onLinkPress: (url: string) => () => void;
|
package/package.json
CHANGED
package/src/lib/Parser.tsx
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import type { ReactNode } from 'react';
|
|
1
2
|
import type { marked } from 'marked';
|
|
2
3
|
import Renderer from './Renderer';
|
|
3
4
|
import type { MarkedStyles } from '../theme/types';
|
|
@@ -21,35 +22,17 @@ class Parser {
|
|
|
21
22
|
}
|
|
22
23
|
|
|
23
24
|
parse(tokens: marked.Token[]) {
|
|
24
|
-
const elements:
|
|
25
|
+
const elements: ReactNode[] = tokens.map((token) => {
|
|
25
26
|
switch (token.type) {
|
|
26
27
|
case 'space': {
|
|
27
28
|
return null;
|
|
28
29
|
}
|
|
29
30
|
case 'paragraph': {
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
if (t.type === 'image') {
|
|
35
|
-
paragraphChildren.push(
|
|
36
|
-
this.renderer.getTextNode(
|
|
37
|
-
this.parseInline(tempTokens),
|
|
38
|
-
this.styles.text
|
|
39
|
-
)
|
|
40
|
-
);
|
|
41
|
-
paragraphChildren.push(this.parseInline([t]));
|
|
42
|
-
tempTokens = [];
|
|
43
|
-
return;
|
|
44
|
-
}
|
|
45
|
-
tempTokens = [...tempTokens, t];
|
|
46
|
-
});
|
|
47
|
-
|
|
48
|
-
if (tempTokens.length > 0) {
|
|
49
|
-
paragraphChildren.push(
|
|
50
|
-
this.renderer.getTextNode(this.parseInline(tempTokens), {})
|
|
31
|
+
const paragraphChildren =
|
|
32
|
+
this.getNormalizedSiblingNodesForBlockAndInlineTokens(
|
|
33
|
+
token.tokens,
|
|
34
|
+
this.styles.text
|
|
51
35
|
);
|
|
52
|
-
}
|
|
53
36
|
|
|
54
37
|
return this.renderer.getViewNode(
|
|
55
38
|
paragraphChildren,
|
|
@@ -64,7 +47,10 @@ class Parser {
|
|
|
64
47
|
}
|
|
65
48
|
case 'heading': {
|
|
66
49
|
const styles = this.headingStylesMap[token.depth] ?? this.styles.text;
|
|
67
|
-
return this.renderer.getTextNode(
|
|
50
|
+
return this.renderer.getTextNode(
|
|
51
|
+
this.parseInline(token.tokens, styles),
|
|
52
|
+
styles
|
|
53
|
+
);
|
|
68
54
|
}
|
|
69
55
|
case 'code': {
|
|
70
56
|
return this.renderer.getCodeBlockNode(
|
|
@@ -78,19 +64,22 @@ class Parser {
|
|
|
78
64
|
}
|
|
79
65
|
case 'list': {
|
|
80
66
|
const li = token.items.map((item) => {
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
this.styles.li
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
67
|
+
const children = item.tokens.map((cItem) => {
|
|
68
|
+
if (cItem.type === 'text') {
|
|
69
|
+
/* getViewNode since tokens could contain a block like elements (i.e. img) */
|
|
70
|
+
const listChildren =
|
|
71
|
+
this.getNormalizedSiblingNodesForBlockAndInlineTokens(
|
|
72
|
+
// @ts-ignore
|
|
73
|
+
cItem.tokens,
|
|
74
|
+
this.styles.li
|
|
75
|
+
);
|
|
76
|
+
return this.renderer.getViewNode(listChildren, this.styles.li);
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
/* Parse the nested token */
|
|
80
|
+
return this.parse([cItem]);
|
|
81
|
+
});
|
|
82
|
+
return this.renderer.getViewNode(children, this.styles.li);
|
|
94
83
|
});
|
|
95
84
|
return this.renderer.getListNode(
|
|
96
85
|
token.ordered,
|
|
@@ -99,51 +88,63 @@ class Parser {
|
|
|
99
88
|
this.styles.li
|
|
100
89
|
);
|
|
101
90
|
}
|
|
102
|
-
case 'html': {
|
|
103
|
-
return this.renderer.getTextNode(token.text.trim(), this.styles.text);
|
|
104
|
-
}
|
|
105
91
|
default:
|
|
106
|
-
|
|
107
|
-
return null;
|
|
92
|
+
return this.parseInline([token]);
|
|
108
93
|
}
|
|
109
94
|
});
|
|
110
|
-
return elements;
|
|
95
|
+
return elements.filter((element) => element !== null);
|
|
111
96
|
}
|
|
112
97
|
|
|
113
98
|
parseInline(tokens: marked.Token[], styles?: CustomStyleProp) {
|
|
114
|
-
const elements:
|
|
99
|
+
const elements: ReactNode[] = tokens.map((token) => {
|
|
115
100
|
if (!token) return null;
|
|
116
101
|
|
|
117
102
|
switch (token.type) {
|
|
118
103
|
case 'escape': {
|
|
119
104
|
return this.renderer.getTextNode(token.text, {
|
|
120
|
-
...styles,
|
|
121
105
|
...this.styles.text,
|
|
106
|
+
...styles,
|
|
122
107
|
});
|
|
123
108
|
}
|
|
124
109
|
case 'link': {
|
|
125
|
-
|
|
110
|
+
const linkStyle = {
|
|
126
111
|
...styles,
|
|
127
|
-
...this.styles.link,
|
|
128
|
-
}
|
|
112
|
+
...this.styles.link, // To override color property
|
|
113
|
+
};
|
|
114
|
+
return this.renderer.getLinkNode(
|
|
115
|
+
this.parseInline(token.tokens, linkStyle),
|
|
116
|
+
token.href,
|
|
117
|
+
linkStyle
|
|
118
|
+
);
|
|
129
119
|
}
|
|
130
120
|
case 'image': {
|
|
131
121
|
return this.renderer.getImageNode(token.href);
|
|
132
122
|
}
|
|
133
123
|
case 'strong': {
|
|
124
|
+
const boldStyle = {
|
|
125
|
+
...this.styles.strong,
|
|
126
|
+
...styles,
|
|
127
|
+
};
|
|
134
128
|
return this.renderer.getTextNode(
|
|
135
|
-
this.parseInline(token.tokens,
|
|
136
|
-
|
|
129
|
+
this.parseInline(token.tokens, boldStyle),
|
|
130
|
+
boldStyle
|
|
137
131
|
);
|
|
138
132
|
}
|
|
139
133
|
case 'em': {
|
|
134
|
+
const italicStyle = {
|
|
135
|
+
...this.styles.em,
|
|
136
|
+
...styles,
|
|
137
|
+
};
|
|
140
138
|
return this.renderer.getTextNode(
|
|
141
|
-
this.parseInline(token.tokens,
|
|
142
|
-
|
|
139
|
+
this.parseInline(token.tokens, italicStyle),
|
|
140
|
+
italicStyle
|
|
143
141
|
);
|
|
144
142
|
}
|
|
145
143
|
case 'codespan': {
|
|
146
|
-
return this.renderer.getTextNode(token.text,
|
|
144
|
+
return this.renderer.getTextNode(token.text, {
|
|
145
|
+
...this.styles.codespan,
|
|
146
|
+
...styles,
|
|
147
|
+
});
|
|
147
148
|
}
|
|
148
149
|
case 'br': {
|
|
149
150
|
return this.renderer.getTextNode('\n', {});
|
|
@@ -151,10 +152,15 @@ class Parser {
|
|
|
151
152
|
case 'del': {
|
|
152
153
|
return null;
|
|
153
154
|
}
|
|
154
|
-
case 'text':
|
|
155
|
+
case 'text':
|
|
156
|
+
case 'html': {
|
|
157
|
+
if (token.raw.trim().length < 1) {
|
|
158
|
+
return null;
|
|
159
|
+
}
|
|
160
|
+
|
|
155
161
|
return this.renderer.getTextNode(token.raw, {
|
|
156
|
-
...styles,
|
|
157
162
|
...this.styles.text,
|
|
163
|
+
...styles,
|
|
158
164
|
});
|
|
159
165
|
}
|
|
160
166
|
default: {
|
|
@@ -163,8 +169,42 @@ class Parser {
|
|
|
163
169
|
}
|
|
164
170
|
}
|
|
165
171
|
});
|
|
166
|
-
return elements;
|
|
172
|
+
return elements.filter((element) => element !== null);
|
|
167
173
|
}
|
|
174
|
+
|
|
175
|
+
private getNormalizedSiblingNodesForBlockAndInlineTokens = (
|
|
176
|
+
tokens: marked.Token[],
|
|
177
|
+
textStyle: TextStyleProp
|
|
178
|
+
): ReactNode[] => {
|
|
179
|
+
let tempTokens: marked.Token[] = [];
|
|
180
|
+
const siblingNodes: ReactNode[] = [];
|
|
181
|
+
tokens.forEach((t) => {
|
|
182
|
+
/**
|
|
183
|
+
* To avoid inlining images
|
|
184
|
+
* Note: to be extend for other token types
|
|
185
|
+
*/
|
|
186
|
+
if (t.type === 'image') {
|
|
187
|
+
const parsed = this.parseInline(tempTokens);
|
|
188
|
+
if (parsed.length > 0) {
|
|
189
|
+
siblingNodes.push(
|
|
190
|
+
this.renderer.getTextNode(this.parseInline(tempTokens), textStyle)
|
|
191
|
+
);
|
|
192
|
+
}
|
|
193
|
+
siblingNodes.push(this.parseInline([t]));
|
|
194
|
+
tempTokens = [];
|
|
195
|
+
return;
|
|
196
|
+
}
|
|
197
|
+
tempTokens = [...tempTokens, t];
|
|
198
|
+
});
|
|
199
|
+
|
|
200
|
+
/* Remaining temp tokens if any */
|
|
201
|
+
if (tempTokens.length > 0) {
|
|
202
|
+
siblingNodes.push(
|
|
203
|
+
this.renderer.getTextNode(this.parseInline(tempTokens), {})
|
|
204
|
+
);
|
|
205
|
+
}
|
|
206
|
+
return siblingNodes;
|
|
207
|
+
};
|
|
168
208
|
}
|
|
169
209
|
|
|
170
210
|
export default Parser;
|
package/src/lib/Renderer.tsx
CHANGED
|
@@ -1,19 +1,15 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
1
|
+
import React, { ReactNode } from 'react';
|
|
2
|
+
import { ScrollView, View, Text } from 'react-native';
|
|
3
3
|
import MarkedList from '@jsamr/react-native-li';
|
|
4
4
|
import Disc from '@jsamr/counter-style/presets/disc';
|
|
5
5
|
import Decimal from '@jsamr/counter-style/presets/decimal';
|
|
6
6
|
import MDImage from './../components/MDImage';
|
|
7
7
|
import { generateRandomString } from '../utils/string';
|
|
8
8
|
import type { TextStyleProp, ViewStyleProp } from './types';
|
|
9
|
+
import { onLinkPress } from '../utils/handlers';
|
|
9
10
|
|
|
10
11
|
class Renderer {
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
getTextNode = (
|
|
14
|
-
children: string | React.ReactNode[],
|
|
15
|
-
styles: TextStyleProp
|
|
16
|
-
) => {
|
|
12
|
+
getTextNode = (children: string | ReactNode[], styles: TextStyleProp) => {
|
|
17
13
|
return (
|
|
18
14
|
<Text key={generateRandomString()} style={styles}>
|
|
19
15
|
{children}
|
|
@@ -21,19 +17,23 @@ class Renderer {
|
|
|
21
17
|
);
|
|
22
18
|
};
|
|
23
19
|
|
|
24
|
-
getLinkNode = (
|
|
20
|
+
getLinkNode = (
|
|
21
|
+
children: string | ReactNode[],
|
|
22
|
+
href: string,
|
|
23
|
+
styles: TextStyleProp
|
|
24
|
+
) => {
|
|
25
25
|
return (
|
|
26
26
|
<Text
|
|
27
27
|
key={generateRandomString()}
|
|
28
|
-
onPress={
|
|
28
|
+
onPress={onLinkPress(href)}
|
|
29
29
|
style={styles}
|
|
30
30
|
>
|
|
31
|
-
{
|
|
31
|
+
{children}
|
|
32
32
|
</Text>
|
|
33
33
|
);
|
|
34
34
|
};
|
|
35
35
|
|
|
36
|
-
getViewNode(children:
|
|
36
|
+
getViewNode(children: ReactNode[] | null, styles: ViewStyleProp) {
|
|
37
37
|
return (
|
|
38
38
|
<View key={generateRandomString()} style={styles}>
|
|
39
39
|
{children}
|
|
@@ -47,13 +47,17 @@ class Renderer {
|
|
|
47
47
|
textStyle: TextStyleProp
|
|
48
48
|
) {
|
|
49
49
|
return (
|
|
50
|
-
<ScrollView
|
|
50
|
+
<ScrollView
|
|
51
|
+
key={generateRandomString()}
|
|
52
|
+
contentContainerStyle={containerStyle}
|
|
53
|
+
horizontal
|
|
54
|
+
>
|
|
51
55
|
<Text style={textStyle}>{text}</Text>
|
|
52
56
|
</ScrollView>
|
|
53
57
|
);
|
|
54
58
|
}
|
|
55
59
|
|
|
56
|
-
getBlockquoteNode(children:
|
|
60
|
+
getBlockquoteNode(children: ReactNode[], styles: ViewStyleProp) {
|
|
57
61
|
return (
|
|
58
62
|
<View key={generateRandomString()} style={styles}>
|
|
59
63
|
{children}
|
|
@@ -67,7 +71,7 @@ class Renderer {
|
|
|
67
71
|
|
|
68
72
|
getListNode(
|
|
69
73
|
ordered: boolean,
|
|
70
|
-
li:
|
|
74
|
+
li: ReactNode[],
|
|
71
75
|
listStyle: ViewStyleProp,
|
|
72
76
|
textStyle: TextStyleProp
|
|
73
77
|
) {
|
|
@@ -76,6 +80,7 @@ class Renderer {
|
|
|
76
80
|
counterRenderer={ordered ? Decimal : Disc}
|
|
77
81
|
markerTextStyle={textStyle}
|
|
78
82
|
markerBoxStyle={listStyle}
|
|
83
|
+
key={generateRandomString()}
|
|
79
84
|
>
|
|
80
85
|
{li.map((node) => node)}
|
|
81
86
|
</MarkedList>
|
package/src/theme/styles.ts
CHANGED