safe-mdx 0.0.1 → 0.0.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/index.js +1 -17
- package/dist/index.js.map +1 -1
- package/dist/safe-mdx.d.ts +3 -1
- package/dist/safe-mdx.d.ts.map +1 -1
- package/dist/safe-mdx.js +106 -124
- package/dist/safe-mdx.js.map +1 -1
- package/dist/safe-mdx.test.js +305 -211
- package/dist/safe-mdx.test.js.map +1 -1
- package/package.json +11 -3
- package/src/safe-mdx.test.tsx +287 -184
- package/src/safe-mdx.tsx +83 -64
package/dist/safe-mdx.test.js
CHANGED
|
@@ -1,27 +1,22 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
};
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
const react_1 = __importDefault(require("react"));
|
|
8
|
-
const dedent_1 = __importDefault(require("dedent"));
|
|
9
|
-
const vitest_1 = require("vitest");
|
|
10
|
-
const safe_mdx_1 = require("./safe-mdx");
|
|
11
|
-
void react_1.default;
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import dedent from 'dedent';
|
|
4
|
+
import { test, expect } from 'vitest';
|
|
5
|
+
import { MdastToJsx } from './safe-mdx';
|
|
6
|
+
void React;
|
|
12
7
|
const components = {
|
|
13
8
|
Heading({ level, children }) {
|
|
14
|
-
return (
|
|
9
|
+
return _jsx("h1", { children: children });
|
|
15
10
|
},
|
|
16
11
|
};
|
|
17
12
|
function render(code) {
|
|
18
|
-
const visitor = new
|
|
13
|
+
const visitor = new MdastToJsx({ code, components });
|
|
19
14
|
const result = visitor.run();
|
|
20
15
|
// console.log(JSON.stringify(result, null, 2))
|
|
21
16
|
return { result, errors: visitor.errors || [] };
|
|
22
17
|
}
|
|
23
|
-
|
|
24
|
-
|
|
18
|
+
test('basic', () => {
|
|
19
|
+
expect(render(dedent `
|
|
25
20
|
# Hello
|
|
26
21
|
|
|
27
22
|
i am a paragraph
|
|
@@ -39,8 +34,131 @@ function render(code) {
|
|
|
39
34
|
}
|
|
40
35
|
`);
|
|
41
36
|
});
|
|
42
|
-
|
|
43
|
-
|
|
37
|
+
test('table', () => {
|
|
38
|
+
expect(render(dedent `
|
|
39
|
+
# Hello
|
|
40
|
+
|
|
41
|
+
| Tables | Are | Cool |
|
|
42
|
+
| ------------- |:-------------:| -----:|
|
|
43
|
+
| col 3 is | right-aligned | $1600 |
|
|
44
|
+
| col 2 is | centered | $12 |
|
|
45
|
+
`)).toMatchInlineSnapshot(`
|
|
46
|
+
{
|
|
47
|
+
"errors": [],
|
|
48
|
+
"result": <React.Fragment>
|
|
49
|
+
<h1>
|
|
50
|
+
Hello
|
|
51
|
+
</h1>
|
|
52
|
+
<table>
|
|
53
|
+
<thead>
|
|
54
|
+
<tr
|
|
55
|
+
className=""
|
|
56
|
+
>
|
|
57
|
+
<td
|
|
58
|
+
className=""
|
|
59
|
+
>
|
|
60
|
+
Tables
|
|
61
|
+
</td>
|
|
62
|
+
<td
|
|
63
|
+
className=""
|
|
64
|
+
>
|
|
65
|
+
Are
|
|
66
|
+
</td>
|
|
67
|
+
<td
|
|
68
|
+
className=""
|
|
69
|
+
>
|
|
70
|
+
Cool
|
|
71
|
+
</td>
|
|
72
|
+
</tr>
|
|
73
|
+
</thead>
|
|
74
|
+
<tbody>
|
|
75
|
+
<tr
|
|
76
|
+
className=""
|
|
77
|
+
>
|
|
78
|
+
<td
|
|
79
|
+
className=""
|
|
80
|
+
>
|
|
81
|
+
col 3 is
|
|
82
|
+
</td>
|
|
83
|
+
<td
|
|
84
|
+
className=""
|
|
85
|
+
>
|
|
86
|
+
right-aligned
|
|
87
|
+
</td>
|
|
88
|
+
<td
|
|
89
|
+
className=""
|
|
90
|
+
>
|
|
91
|
+
$1600
|
|
92
|
+
</td>
|
|
93
|
+
</tr>
|
|
94
|
+
<tr
|
|
95
|
+
className=""
|
|
96
|
+
>
|
|
97
|
+
<td
|
|
98
|
+
className=""
|
|
99
|
+
>
|
|
100
|
+
col 2 is
|
|
101
|
+
</td>
|
|
102
|
+
<td
|
|
103
|
+
className=""
|
|
104
|
+
>
|
|
105
|
+
centered
|
|
106
|
+
</td>
|
|
107
|
+
<td
|
|
108
|
+
className=""
|
|
109
|
+
>
|
|
110
|
+
$12
|
|
111
|
+
</td>
|
|
112
|
+
</tr>
|
|
113
|
+
</tbody>
|
|
114
|
+
</table>
|
|
115
|
+
</React.Fragment>,
|
|
116
|
+
}
|
|
117
|
+
`);
|
|
118
|
+
});
|
|
119
|
+
test('table, only head', () => {
|
|
120
|
+
expect(render(dedent `
|
|
121
|
+
# Hello
|
|
122
|
+
|
|
123
|
+
| Tables | Are | Cool |
|
|
124
|
+
| ------------- |:-------------:| -----:|
|
|
125
|
+
|
|
126
|
+
`)).toMatchInlineSnapshot(`
|
|
127
|
+
{
|
|
128
|
+
"errors": [],
|
|
129
|
+
"result": <React.Fragment>
|
|
130
|
+
<h1>
|
|
131
|
+
Hello
|
|
132
|
+
</h1>
|
|
133
|
+
<table>
|
|
134
|
+
<thead>
|
|
135
|
+
<tr
|
|
136
|
+
className=""
|
|
137
|
+
>
|
|
138
|
+
<td
|
|
139
|
+
className=""
|
|
140
|
+
>
|
|
141
|
+
Tables
|
|
142
|
+
</td>
|
|
143
|
+
<td
|
|
144
|
+
className=""
|
|
145
|
+
>
|
|
146
|
+
Are
|
|
147
|
+
</td>
|
|
148
|
+
<td
|
|
149
|
+
className=""
|
|
150
|
+
>
|
|
151
|
+
Cool
|
|
152
|
+
</td>
|
|
153
|
+
</tr>
|
|
154
|
+
</thead>
|
|
155
|
+
</table>
|
|
156
|
+
</React.Fragment>,
|
|
157
|
+
}
|
|
158
|
+
`);
|
|
159
|
+
});
|
|
160
|
+
test('inline jsx', () => {
|
|
161
|
+
expect(render(dedent `
|
|
44
162
|
<Heading level={2}>hello</Heading>
|
|
45
163
|
`)).toMatchInlineSnapshot(`
|
|
46
164
|
{
|
|
@@ -57,8 +175,8 @@ function render(code) {
|
|
|
57
175
|
}
|
|
58
176
|
`);
|
|
59
177
|
});
|
|
60
|
-
|
|
61
|
-
|
|
178
|
+
test('block jsx', () => {
|
|
179
|
+
expect(render(dedent `
|
|
62
180
|
<Heading level={2}>
|
|
63
181
|
> hello
|
|
64
182
|
</Heading>
|
|
@@ -79,8 +197,8 @@ function render(code) {
|
|
|
79
197
|
}
|
|
80
198
|
`);
|
|
81
199
|
});
|
|
82
|
-
|
|
83
|
-
|
|
200
|
+
test('missing components are ignored', () => {
|
|
201
|
+
expect(render(dedent `
|
|
84
202
|
<MissingComponent level={2} />
|
|
85
203
|
`)).toMatchInlineSnapshot(`
|
|
86
204
|
{
|
|
@@ -93,8 +211,8 @@ function render(code) {
|
|
|
93
211
|
}
|
|
94
212
|
`);
|
|
95
213
|
});
|
|
96
|
-
|
|
97
|
-
|
|
214
|
+
test('props parsing', () => {
|
|
215
|
+
expect(render(dedent `
|
|
98
216
|
<Heading
|
|
99
217
|
num={2}
|
|
100
218
|
doublequote={"a \" string"}
|
|
@@ -106,6 +224,7 @@ function render(code) {
|
|
|
106
224
|
jsx={<SomeComponent />}
|
|
107
225
|
undef={undefined}
|
|
108
226
|
null={null}
|
|
227
|
+
someJson={{"a": 1}}
|
|
109
228
|
{...{
|
|
110
229
|
spread: true
|
|
111
230
|
}}
|
|
@@ -133,10 +252,15 @@ function render(code) {
|
|
|
133
252
|
<Heading
|
|
134
253
|
backTick="some \${expr} value"
|
|
135
254
|
boolean={false}
|
|
136
|
-
doublequote="a
|
|
255
|
+
doublequote="a " string"
|
|
137
256
|
null={null}
|
|
138
257
|
num={2}
|
|
139
|
-
quote="a
|
|
258
|
+
quote="a " string"
|
|
259
|
+
someJson={
|
|
260
|
+
{
|
|
261
|
+
"a": 1,
|
|
262
|
+
}
|
|
263
|
+
}
|
|
140
264
|
>
|
|
141
265
|
<p>
|
|
142
266
|
hi
|
|
@@ -146,8 +270,8 @@ function render(code) {
|
|
|
146
270
|
}
|
|
147
271
|
`);
|
|
148
272
|
});
|
|
149
|
-
|
|
150
|
-
|
|
273
|
+
test('breaks', () => {
|
|
274
|
+
expect(render(dedent `
|
|
151
275
|
To have a line break without a paragraph, you will need to use two trailing spaces.
|
|
152
276
|
Note that this line is separate, but within the same paragraph.
|
|
153
277
|
(This is contrary to the typical GFM line break behaviour, where trailing spaces are not required.)
|
|
@@ -167,8 +291,8 @@ function render(code) {
|
|
|
167
291
|
`);
|
|
168
292
|
});
|
|
169
293
|
// https://github.com/obedm503/markdown-kitchen-sink/blob/master/README.md?plain=1
|
|
170
|
-
|
|
171
|
-
|
|
294
|
+
test('kitchen sink', () => {
|
|
295
|
+
expect(render(dedent `
|
|
172
296
|
# Markdown Kitchen Sink
|
|
173
297
|
This file is https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet plus a few fixes and additions. Used by [obedm503/bootmark](https://github.com/obedm503/bootmark) to [demonstrate](https://obedm503.github.io/bootmark/docs/markdown-cheatsheet.html) it's styling features.
|
|
174
298
|
|
|
@@ -743,9 +867,7 @@ function render(code) {
|
|
|
743
867
|
Headers
|
|
744
868
|
</h2>
|
|
745
869
|
<pre>
|
|
746
|
-
<code
|
|
747
|
-
className="language-no-highlight"
|
|
748
|
-
>
|
|
870
|
+
<code>
|
|
749
871
|
# H1
|
|
750
872
|
## H2
|
|
751
873
|
### H3
|
|
@@ -796,9 +918,7 @@ function render(code) {
|
|
|
796
918
|
Emphasis
|
|
797
919
|
</h2>
|
|
798
920
|
<pre>
|
|
799
|
-
<code
|
|
800
|
-
className="language-no-highlight"
|
|
801
|
-
>
|
|
921
|
+
<code>
|
|
802
922
|
Emphasis, aka italics, with *asterisks* or _underscores_.
|
|
803
923
|
|
|
804
924
|
Strong emphasis, aka bold, with **asterisks** or __underscores__.
|
|
@@ -856,9 +976,7 @@ function render(code) {
|
|
|
856
976
|
(In this example, leading and trailing spaces are shown with with dots: ⋅)
|
|
857
977
|
</p>
|
|
858
978
|
<pre>
|
|
859
|
-
<code
|
|
860
|
-
className="language-no-highlight"
|
|
861
|
-
>
|
|
979
|
+
<code>
|
|
862
980
|
1. First ordered list item
|
|
863
981
|
2. Another item
|
|
864
982
|
⋅⋅* Unordered sub-list.
|
|
@@ -958,9 +1076,7 @@ function render(code) {
|
|
|
958
1076
|
There are two ways to create links.
|
|
959
1077
|
</p>
|
|
960
1078
|
<pre>
|
|
961
|
-
<code
|
|
962
|
-
className="language-no-highlight"
|
|
963
|
-
>
|
|
1079
|
+
<code>
|
|
964
1080
|
[I'm an inline-style link](https://www.google.com)
|
|
965
1081
|
|
|
966
1082
|
[I'm an inline-style link with title](https://www.google.com "Google's Homepage")
|
|
@@ -1053,9 +1169,7 @@ function render(code) {
|
|
|
1053
1169
|
Images
|
|
1054
1170
|
</h2>
|
|
1055
1171
|
<pre>
|
|
1056
|
-
<code
|
|
1057
|
-
className="language-no-highlight"
|
|
1058
|
-
>
|
|
1172
|
+
<code>
|
|
1059
1173
|
Here's our logo (hover to see the title text):
|
|
1060
1174
|
|
|
1061
1175
|
Inline-style:
|
|
@@ -1108,9 +1222,7 @@ function render(code) {
|
|
|
1108
1222
|
.
|
|
1109
1223
|
</p>
|
|
1110
1224
|
<pre>
|
|
1111
|
-
<code
|
|
1112
|
-
className="language-no-highlight"
|
|
1113
|
-
>
|
|
1225
|
+
<code>
|
|
1114
1226
|
Inline \`code\` has \`back-ticks around\` it.
|
|
1115
1227
|
</code>
|
|
1116
1228
|
</pre>
|
|
@@ -1133,49 +1245,37 @@ function render(code) {
|
|
|
1133
1245
|
, or are indented with four spaces. I recommend only using the fenced code blocks -- they're easier and only they support syntax highlighting.
|
|
1134
1246
|
</p>
|
|
1135
1247
|
<pre>
|
|
1136
|
-
<code
|
|
1137
|
-
className="language-javascript"
|
|
1138
|
-
>
|
|
1248
|
+
<code>
|
|
1139
1249
|
var s = "JavaScript syntax highlighting";
|
|
1140
1250
|
alert(s);
|
|
1141
1251
|
</code>
|
|
1142
1252
|
</pre>
|
|
1143
1253
|
<pre>
|
|
1144
|
-
<code
|
|
1145
|
-
className="language-python"
|
|
1146
|
-
>
|
|
1254
|
+
<code>
|
|
1147
1255
|
s = "Python syntax highlighting"
|
|
1148
1256
|
print s
|
|
1149
1257
|
</code>
|
|
1150
1258
|
</pre>
|
|
1151
1259
|
<pre>
|
|
1152
|
-
<code
|
|
1153
|
-
className="language-"
|
|
1154
|
-
>
|
|
1260
|
+
<code>
|
|
1155
1261
|
No language indicated, so no syntax highlighting.
|
|
1156
1262
|
But let's throw in a <b>tag</b>.
|
|
1157
1263
|
</code>
|
|
1158
1264
|
</pre>
|
|
1159
1265
|
<pre>
|
|
1160
|
-
<code
|
|
1161
|
-
className="language-javascript"
|
|
1162
|
-
>
|
|
1266
|
+
<code>
|
|
1163
1267
|
var s = "JavaScript syntax highlighting";
|
|
1164
1268
|
alert(s);
|
|
1165
1269
|
</code>
|
|
1166
1270
|
</pre>
|
|
1167
1271
|
<pre>
|
|
1168
|
-
<code
|
|
1169
|
-
className="language-python"
|
|
1170
|
-
>
|
|
1272
|
+
<code>
|
|
1171
1273
|
s = "Python syntax highlighting"
|
|
1172
1274
|
print s
|
|
1173
1275
|
</code>
|
|
1174
1276
|
</pre>
|
|
1175
1277
|
<pre>
|
|
1176
|
-
<code
|
|
1177
|
-
className="language-"
|
|
1178
|
-
>
|
|
1278
|
+
<code>
|
|
1179
1279
|
No language indicated, so no syntax highlighting in Markdown Here (varies on Github).
|
|
1180
1280
|
But let's throw in a <b>tag</b>.
|
|
1181
1281
|
</code>
|
|
@@ -1194,9 +1294,7 @@ function render(code) {
|
|
|
1194
1294
|
supports them. They are an easy way of adding tables to your email -- a task that would otherwise require copy-pasting from another application.
|
|
1195
1295
|
</p>
|
|
1196
1296
|
<pre>
|
|
1197
|
-
<code
|
|
1198
|
-
className="language-no-highlight"
|
|
1199
|
-
>
|
|
1297
|
+
<code>
|
|
1200
1298
|
Colons can be used to align columns.
|
|
1201
1299
|
|
|
1202
1300
|
| Tables | Are | Cool |
|
|
@@ -1219,150 +1317,158 @@ function render(code) {
|
|
|
1219
1317
|
Colons can be used to align columns.
|
|
1220
1318
|
</p>
|
|
1221
1319
|
<table>
|
|
1222
|
-
<
|
|
1223
|
-
|
|
1224
|
-
>
|
|
1225
|
-
<td
|
|
1226
|
-
className=""
|
|
1227
|
-
>
|
|
1228
|
-
Tables
|
|
1229
|
-
</td>
|
|
1230
|
-
<td
|
|
1231
|
-
className=""
|
|
1232
|
-
>
|
|
1233
|
-
Are
|
|
1234
|
-
</td>
|
|
1235
|
-
<td
|
|
1236
|
-
className=""
|
|
1237
|
-
>
|
|
1238
|
-
Cool
|
|
1239
|
-
</td>
|
|
1240
|
-
</tr>
|
|
1241
|
-
<tr
|
|
1242
|
-
className=""
|
|
1243
|
-
>
|
|
1244
|
-
<td
|
|
1245
|
-
className=""
|
|
1246
|
-
>
|
|
1247
|
-
col 3 is
|
|
1248
|
-
</td>
|
|
1249
|
-
<td
|
|
1250
|
-
className=""
|
|
1251
|
-
>
|
|
1252
|
-
right-aligned
|
|
1253
|
-
</td>
|
|
1254
|
-
<td
|
|
1255
|
-
className=""
|
|
1256
|
-
>
|
|
1257
|
-
$1600
|
|
1258
|
-
</td>
|
|
1259
|
-
</tr>
|
|
1260
|
-
<tr
|
|
1261
|
-
className=""
|
|
1262
|
-
>
|
|
1263
|
-
<td
|
|
1264
|
-
className=""
|
|
1265
|
-
>
|
|
1266
|
-
col 2 is
|
|
1267
|
-
</td>
|
|
1268
|
-
<td
|
|
1269
|
-
className=""
|
|
1270
|
-
>
|
|
1271
|
-
centered
|
|
1272
|
-
</td>
|
|
1273
|
-
<td
|
|
1320
|
+
<thead>
|
|
1321
|
+
<tr
|
|
1274
1322
|
className=""
|
|
1275
1323
|
>
|
|
1276
|
-
|
|
1277
|
-
|
|
1278
|
-
|
|
1279
|
-
|
|
1280
|
-
|
|
1281
|
-
|
|
1282
|
-
|
|
1324
|
+
<td
|
|
1325
|
+
className=""
|
|
1326
|
+
>
|
|
1327
|
+
Tables
|
|
1328
|
+
</td>
|
|
1329
|
+
<td
|
|
1330
|
+
className=""
|
|
1331
|
+
>
|
|
1332
|
+
Are
|
|
1333
|
+
</td>
|
|
1334
|
+
<td
|
|
1335
|
+
className=""
|
|
1336
|
+
>
|
|
1337
|
+
Cool
|
|
1338
|
+
</td>
|
|
1339
|
+
</tr>
|
|
1340
|
+
</thead>
|
|
1341
|
+
<tbody>
|
|
1342
|
+
<tr
|
|
1283
1343
|
className=""
|
|
1284
1344
|
>
|
|
1285
|
-
|
|
1286
|
-
|
|
1287
|
-
|
|
1345
|
+
<td
|
|
1346
|
+
className=""
|
|
1347
|
+
>
|
|
1348
|
+
col 3 is
|
|
1349
|
+
</td>
|
|
1350
|
+
<td
|
|
1351
|
+
className=""
|
|
1352
|
+
>
|
|
1353
|
+
right-aligned
|
|
1354
|
+
</td>
|
|
1355
|
+
<td
|
|
1356
|
+
className=""
|
|
1357
|
+
>
|
|
1358
|
+
$1600
|
|
1359
|
+
</td>
|
|
1360
|
+
</tr>
|
|
1361
|
+
<tr
|
|
1288
1362
|
className=""
|
|
1289
1363
|
>
|
|
1290
|
-
|
|
1291
|
-
|
|
1292
|
-
|
|
1364
|
+
<td
|
|
1365
|
+
className=""
|
|
1366
|
+
>
|
|
1367
|
+
col 2 is
|
|
1368
|
+
</td>
|
|
1369
|
+
<td
|
|
1370
|
+
className=""
|
|
1371
|
+
>
|
|
1372
|
+
centered
|
|
1373
|
+
</td>
|
|
1374
|
+
<td
|
|
1375
|
+
className=""
|
|
1376
|
+
>
|
|
1377
|
+
$12
|
|
1378
|
+
</td>
|
|
1379
|
+
</tr>
|
|
1380
|
+
<tr
|
|
1293
1381
|
className=""
|
|
1294
1382
|
>
|
|
1295
|
-
|
|
1296
|
-
|
|
1297
|
-
|
|
1383
|
+
<td
|
|
1384
|
+
className=""
|
|
1385
|
+
>
|
|
1386
|
+
zebra stripes
|
|
1387
|
+
</td>
|
|
1388
|
+
<td
|
|
1389
|
+
className=""
|
|
1390
|
+
>
|
|
1391
|
+
are neat
|
|
1392
|
+
</td>
|
|
1393
|
+
<td
|
|
1394
|
+
className=""
|
|
1395
|
+
>
|
|
1396
|
+
$1
|
|
1397
|
+
</td>
|
|
1398
|
+
</tr>
|
|
1399
|
+
</tbody>
|
|
1298
1400
|
</table>
|
|
1299
1401
|
<p>
|
|
1300
1402
|
There must be at least 3 dashes separating each header cell. The outer pipes (|) are optional, and you don't need to make the raw Markdown line up prettily. You can also use inline Markdown.
|
|
1301
1403
|
</p>
|
|
1302
1404
|
<table>
|
|
1303
|
-
<
|
|
1304
|
-
|
|
1305
|
-
>
|
|
1306
|
-
<td
|
|
1307
|
-
className=""
|
|
1308
|
-
>
|
|
1309
|
-
Markdown
|
|
1310
|
-
</td>
|
|
1311
|
-
<td
|
|
1312
|
-
className=""
|
|
1313
|
-
>
|
|
1314
|
-
Less
|
|
1315
|
-
</td>
|
|
1316
|
-
<td
|
|
1317
|
-
className=""
|
|
1318
|
-
>
|
|
1319
|
-
Pretty
|
|
1320
|
-
</td>
|
|
1321
|
-
</tr>
|
|
1322
|
-
<tr
|
|
1323
|
-
className=""
|
|
1324
|
-
>
|
|
1325
|
-
<td
|
|
1326
|
-
className=""
|
|
1327
|
-
>
|
|
1328
|
-
<em>
|
|
1329
|
-
Still
|
|
1330
|
-
</em>
|
|
1331
|
-
</td>
|
|
1332
|
-
<td
|
|
1333
|
-
className=""
|
|
1334
|
-
>
|
|
1335
|
-
<code>
|
|
1336
|
-
renders
|
|
1337
|
-
</code>
|
|
1338
|
-
</td>
|
|
1339
|
-
<td
|
|
1405
|
+
<thead>
|
|
1406
|
+
<tr
|
|
1340
1407
|
className=""
|
|
1341
1408
|
>
|
|
1342
|
-
<
|
|
1343
|
-
|
|
1344
|
-
|
|
1345
|
-
|
|
1346
|
-
|
|
1347
|
-
|
|
1348
|
-
|
|
1349
|
-
|
|
1350
|
-
|
|
1351
|
-
|
|
1352
|
-
|
|
1353
|
-
|
|
1354
|
-
|
|
1355
|
-
|
|
1409
|
+
<td
|
|
1410
|
+
className=""
|
|
1411
|
+
>
|
|
1412
|
+
Markdown
|
|
1413
|
+
</td>
|
|
1414
|
+
<td
|
|
1415
|
+
className=""
|
|
1416
|
+
>
|
|
1417
|
+
Less
|
|
1418
|
+
</td>
|
|
1419
|
+
<td
|
|
1420
|
+
className=""
|
|
1421
|
+
>
|
|
1422
|
+
Pretty
|
|
1423
|
+
</td>
|
|
1424
|
+
</tr>
|
|
1425
|
+
</thead>
|
|
1426
|
+
<tbody>
|
|
1427
|
+
<tr
|
|
1356
1428
|
className=""
|
|
1357
1429
|
>
|
|
1358
|
-
|
|
1359
|
-
|
|
1360
|
-
|
|
1430
|
+
<td
|
|
1431
|
+
className=""
|
|
1432
|
+
>
|
|
1433
|
+
<em>
|
|
1434
|
+
Still
|
|
1435
|
+
</em>
|
|
1436
|
+
</td>
|
|
1437
|
+
<td
|
|
1438
|
+
className=""
|
|
1439
|
+
>
|
|
1440
|
+
<code>
|
|
1441
|
+
renders
|
|
1442
|
+
</code>
|
|
1443
|
+
</td>
|
|
1444
|
+
<td
|
|
1445
|
+
className=""
|
|
1446
|
+
>
|
|
1447
|
+
<strong>
|
|
1448
|
+
nicely
|
|
1449
|
+
</strong>
|
|
1450
|
+
</td>
|
|
1451
|
+
</tr>
|
|
1452
|
+
<tr
|
|
1361
1453
|
className=""
|
|
1362
1454
|
>
|
|
1363
|
-
|
|
1364
|
-
|
|
1365
|
-
|
|
1455
|
+
<td
|
|
1456
|
+
className=""
|
|
1457
|
+
>
|
|
1458
|
+
1
|
|
1459
|
+
</td>
|
|
1460
|
+
<td
|
|
1461
|
+
className=""
|
|
1462
|
+
>
|
|
1463
|
+
2
|
|
1464
|
+
</td>
|
|
1465
|
+
<td
|
|
1466
|
+
className=""
|
|
1467
|
+
>
|
|
1468
|
+
3
|
|
1469
|
+
</td>
|
|
1470
|
+
</tr>
|
|
1471
|
+
</tbody>
|
|
1366
1472
|
</table>
|
|
1367
1473
|
<a
|
|
1368
1474
|
name="blockquotes"
|
|
@@ -1371,9 +1477,7 @@ function render(code) {
|
|
|
1371
1477
|
Blockquotes
|
|
1372
1478
|
</h2>
|
|
1373
1479
|
<pre>
|
|
1374
|
-
<code
|
|
1375
|
-
className="language-no-highlight"
|
|
1376
|
-
>
|
|
1480
|
+
<code>
|
|
1377
1481
|
> Blockquotes are very handy in email to emulate reply text.
|
|
1378
1482
|
> This line is part of the same quote.
|
|
1379
1483
|
|
|
@@ -1414,9 +1518,7 @@ function render(code) {
|
|
|
1414
1518
|
You can also use raw HTML in your Markdown, and it'll mostly work pretty well.
|
|
1415
1519
|
</p>
|
|
1416
1520
|
<pre>
|
|
1417
|
-
<code
|
|
1418
|
-
className="language-no-highlight"
|
|
1419
|
-
>
|
|
1521
|
+
<code>
|
|
1420
1522
|
<dl>
|
|
1421
1523
|
<dt>Definition list</dt>
|
|
1422
1524
|
<dd>Is something people use sometimes.</dd>
|
|
@@ -1433,9 +1535,7 @@ function render(code) {
|
|
|
1433
1535
|
Horizontal Rule
|
|
1434
1536
|
</h2>
|
|
1435
1537
|
<pre>
|
|
1436
|
-
<code
|
|
1437
|
-
className="language-"
|
|
1438
|
-
>
|
|
1538
|
+
<code>
|
|
1439
1539
|
Three or more...
|
|
1440
1540
|
|
|
1441
1541
|
---
|
|
@@ -1479,9 +1579,7 @@ function render(code) {
|
|
|
1479
1579
|
Here are some things to try out:
|
|
1480
1580
|
</p>
|
|
1481
1581
|
<pre>
|
|
1482
|
-
<code
|
|
1483
|
-
className="language-"
|
|
1484
|
-
>
|
|
1582
|
+
<code>
|
|
1485
1583
|
Here's a line for us to start with.
|
|
1486
1584
|
|
|
1487
1585
|
This line is separated from the one above by two newlines, so it will be a *separate paragraph*.
|
|
@@ -1526,9 +1624,7 @@ function render(code) {
|
|
|
1526
1624
|
They can't be added directly but you can add an image with a link to the video like this:
|
|
1527
1625
|
</p>
|
|
1528
1626
|
<pre>
|
|
1529
|
-
<code
|
|
1530
|
-
className="language-no-highlight"
|
|
1531
|
-
>
|
|
1627
|
+
<code>
|
|
1532
1628
|
<a href="http://www.youtube.com/watch?feature=player_embedded&v=YOUTUBE_VIDEO_ID_HERE
|
|
1533
1629
|
" target="_blank"><img src="http://img.youtube.com/vi/YOUTUBE_VIDEO_ID_HERE/0.jpg"
|
|
1534
1630
|
alt="IMAGE ALT TEXT HERE" width="240" height="180" border="10" /></a>
|
|
@@ -1538,9 +1634,7 @@ function render(code) {
|
|
|
1538
1634
|
Or, in pure Markdown, but losing the image sizing and border:
|
|
1539
1635
|
</p>
|
|
1540
1636
|
<pre>
|
|
1541
|
-
<code
|
|
1542
|
-
className="language-no-highlight"
|
|
1543
|
-
>
|
|
1637
|
+
<code>
|
|
1544
1638
|
[](http://www.youtube.com/watch?v=YOUTUBE_VIDEO_ID_HERE)
|
|
1545
1639
|
</code>
|
|
1546
1640
|
</pre>
|