Skip to content

Commit 4d28ff6

Browse files
jderochervlkjderochervlk
committed
back out table changes for now
1 parent 1217a60 commit 4d28ff6

File tree

5 files changed

+0
-113
lines changed

5 files changed

+0
-113
lines changed

‎app/routes/MdxRoute.res‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,6 @@ let components = {
4040
"UrlBox": Markdown.UrlBox.make,
4141
"Video": Markdown.Video.make,
4242
"Warn": Markdown.Warn.make,
43-
"MarkdownTable": Markdown.MarkdownTable.make,
4443
}
4544

4645
// The loadAllMdx function logs out all of the file contents as it reads them, which is noisy and not useful.

‎docs/manual/overview.mdx‎

Lines changed: 0 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -13,53 +13,39 @@ order: 1
1313

1414
### Semicolon
1515

16-
<MarkdownTable>
17-
{`
1816
| JavaScript | ReScript |
1917
| ---------------------------------- | -------------------- |
2018
| Rules enforced by linter/formatter | No semicolon needed! |
21-
`}</MarkdownTable>
2219

2320
### Comments
2421

25-
<MarkdownTable>
26-
{`
2722
| JavaScript | ReScript |
2823
| -------------------- | -------------------------------- |
2924
| `// Line comment` | Same |
3025
| `/* Comment */` | Same |
3126
| `/** Doc Comment */` | `/** Before Types/Values */` |
3227
| | `/*** Standalone Doc Comment */` |
33-
`}</MarkdownTable>
3428

3529
### Variable
3630

37-
<MarkdownTable>
38-
{`
3931
| JavaScript | ReScript |
4032
| ----------------------- | ------------------------------------- |
4133
| `const x = 5;` | `let x = 5` |
4234
| `var x = y;` | No equivalent (thankfully) |
4335
| `let x = 5; x = x + 1;` | `let x = ref(5); x := x.contents + 1` |
44-
`}</MarkdownTable>
4536

4637
### String & Character
4738

48-
<MarkdownTable>
49-
{`
5039
| JavaScript | ReScript |
5140
| ---------------------------- | --------------------- |
5241
| `"Hello world!"` | Same |
5342
| `'Hello world!'` | Strings must use `"` |
5443
| `"hello " + "world"` | `"hello " ++ "world"` |
5544
| `` `hello ${message}` `` | Same |
5645
| `` sql`select ${fnName};` `` | Same |
57-
`}</MarkdownTable>
5846

5947
### Boolean
6048

61-
<MarkdownTable>
62-
{`
6349
| JavaScript | ReScript |
6450
| ------------------------------------ | ---------------------------------------------- |
6551
| `true`, `false` | Same |
@@ -68,83 +54,64 @@ order: 1
6854
| `a === b`, `a !== b` | Same |
6955
| No deep equality (recursive compare) | `a == b`, `a != b` |
7056
| `a == b` | No equality with implicit casting (thankfully) |
71-
`}</MarkdownTable>
7257

7358
### Number
7459

75-
<MarkdownTable>
76-
{`
7760
| JavaScript | ReScript |
7861
| ----------- | ------------ |
7962
| `3` | Same \* |
8063
| `3.1415` | Same |
8164
| `3 + 4` | Same |
8265
| `3.0 + 4.5` | `3.0 +. 4.5` |
8366
| `5 % 3` | `mod(5, 3)` |
84-
`}</MarkdownTable>
8567

8668
\* JS has no distinction between integer and float.
8769

8870
### Object/Record
8971

90-
<MarkdownTable>
91-
{`
9272
| JavaScript | ReScript |
9373
| ------------------- | --------------------------------------- |
9474
| no types | `type point = {x: int, mutable y: int}` |
9575
| `{x: 30, y: 20}` | Same |
9676
| `point.x` | Same |
9777
| `point.y = 30;` | Same |
9878
| `{...point, x: 30}` | Same |
99-
`}</MarkdownTable>
10079

10180
### Array
10281

103-
<MarkdownTable>
104-
{`
10582
| JavaScript | ReScript |
10683
| ------------------ | --------------------- |
10784
| `[1, 2, 3]` | Same |
10885
| `myArray[1] = 10` | Same |
10986
| `[1, "Bob", true]` | `(1, "Bob", true)` \* |
11087

11188
\* ReScript does not have heterogenous arrays. Use tuples or [Untagged Variants](variant#untagged-variants) instead.
112-
`}</MarkdownTable>
11389

11490
### Null
11591

116-
<MarkdownTable>
117-
{`
11892
| JavaScript | ReScript |
11993
| ------------------- | --------- |
12094
| `null`, `undefined` | `None` \* |
121-
`}</MarkdownTable>
12295

12396
\* Again, only a spiritual equivalent; we don't have nulls, nor null bugs! But we do have an `option` type for when you actually need nullability.
12497

12598
### Function
12699

127-
<MarkdownTable>
128-
{`
129100
| JavaScript | ReScript |
130101
| ------------------------------- | ---------------------------- |
131102
| `arg => retVal` | Same |
132103
| `function named(arg) {...}` | `let named = (arg) => {...}` |
133104
| `const f = function(arg) {...}` | `let f = (arg) => {...}` |
134105
| `add(4, add(5, 6))` | Same |
135-
`}</MarkdownTable>
136106

137107
### Async Function / Await
138108

139-
<MarkdownTable>
140-
{`
141109
| JavaScript | ReScript |
142110
| --------------------------------------- | ----------------------------------------------------- |
143111
| `async (arg) => {...}` | Same |
144112
| `async function named(arg) {...}` | `let named = async (arg) => {...}` |
145113
| `await somePromise` | Same |
146114
| `async (arg): Promise<string> => {...}` | `async (arg): string => {...}` (note the return type) |
147-
`}</MarkdownTable>
148115

149116
### Blocks
150117

@@ -181,64 +148,49 @@ order: 1
181148

182149
### If-else
183150

184-
<MarkdownTable>
185-
{`
186151
| JavaScript | ReScript |
187152
| --------------------- | --------------------------------------------------------------------------------- |
188153
| `if (a) {b} else {c}` | `if a {b} else {c}` \* |
189154
| `a ? b : c` | Same |
190155
| `switch` | `switch` but [super-powered pattern matching!](pattern-matching-destructuring.md) |
191-
`}</MarkdownTable>
192156

193157
\* Our conditionals are always expressions! You can write `let result = if a {"hello"} else {"bye"}`
194158

195159
### Destructuring
196160

197-
<MarkdownTable>
198-
{`
199161
| JavaScript | ReScript |
200162
| ----------------------------- | --------------------------- |
201163
| `const {a, b} = data` | `let {a, b} = data` |
202164
| `const [a, b] = data` | `let [a, b] = data` \* |
203165
| `const {a: aa, b: bb} = data` | `let {a: aa, b: bb} = data` |
204-
`}</MarkdownTable>
205166

206167
\* Gives good compiler warning that `data` might not be of length 2.
207168

208169
### Loop
209170

210-
<MarkdownTable>
211-
{`
212171
| JavaScript | ReScript |
213172
| ------------------------------------- | ---------------------------- |
214173
| `for (let i = 0; i <= 10; i++) {...}` | `for i in 0 to 10 {...}` |
215174
| `for (let i = 10; i >= 0; i--) {...}` | `for i in 10 downto 0 {...}` |
216175
| `while (true) {...}` | `while true {...}` |
217-
`}</MarkdownTable>
218176

219177
### JSX
220178

221-
<MarkdownTable>
222-
{`
223179
| JavaScript | ReScript |
224180
| ----------------------------------------- | -------------------------- |
225181
| `<Comp message="hi" onClick={handler} />` | Same |
226182
| `<Comp message={message} />` | `<Comp message />` \* |
227183
| `<input checked />` | `<input checked=true />` |
228184
| No children spread | `<Comp>...children</Comp>` |
229-
`}</MarkdownTable>
230185

231186
\* Argument punning!
232187

233188
### Exception
234189

235-
<MarkdownTable>
236-
{`
237190
| JavaScript | ReScript |
238191
| ----------------------------------------- | ------------------------------------------------ |
239192
| `throw new SomeError(...)` | `throw(SomeException(...))` |
240193
| `try {a} catch (err) {...} finally {...}` | `try a catch { \| SomeException(err) => ...}` \* |
241-
`}</MarkdownTable>
242194

243195
\* No finally.
244196

@@ -279,8 +231,6 @@ The last expression of a block delimited by `{}` implicitly returns (including f
279231

280232
## Common Features' JS Output
281233

282-
<MarkdownTable>
283-
{`
284234
| Feature | Example | JavaScript Output |
285235
| ------------------------------- | ------------------------------------ | ------------------------------------------ |
286236
| String | `"Hello"` | `"Hello"` |
@@ -303,6 +253,5 @@ The last expression of a block delimited by `{}` implicitly returns (including f
303253
| Record | `type t = {b: int}; let a = {b: 10}` | `var a = {b: 10}` |
304254
| Multiline Comment | `/* Comment here */` | Not in output |
305255
| Single line Comment | `// Comment here` | Not in output |
306-
`}</MarkdownTable>
307256

308257
_Note that this is a cleaned-up comparison table; a few examples' JavaScript output are slightly different in reality._

‎src/components/Markdown.res‎

Lines changed: 0 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -561,43 +561,3 @@ module Video = {
561561
/* Sets our preferred branded styles
562562
We most likely will never need a different ~components
563563
option on our website. */
564-
565-
module MarkdownTable = {
566-
// react-router-mdx doesn't support gfm tables natively yet, so this is a simple table wrapper for us to do it manually
567-
// If it ever adds support, we can remove this component
568-
569-
type extension
570-
type htmlExtension
571-
572-
@module("micromark-extension-gfm")
573-
external gfmHtml: unit => htmlExtension = "gfmHtml"
574-
575-
@module("micromark-extension-gfm")
576-
external gfm: unit => extension = "gfm"
577-
578-
type micromarkOptions = {
579-
extensions: array<extension>,
580-
htmlExtensions: array<htmlExtension>,
581-
}
582-
583-
@module("micromark")
584-
external micromark: (string, micromarkOptions) => string = "micromark"
585-
586-
@react.component
587-
let make = (~children) => {
588-
let html = micromark(
589-
children,
590-
{
591-
extensions: [gfm()],
592-
htmlExtensions: [gfmHtml()],
593-
},
594-
)
595-
<div
596-
dangerouslySetInnerHTML={{
597-
"__html": html,
598-
}}
599-
className="markdown-table"
600-
>
601-
</div>
602-
}
603-
}

‎src/components/Markdown.resi‎

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -174,8 +174,3 @@ module Video: {
174174
/* Sets our preferred branded styles
175175
We most likely will never need a different ~components
176176
option on our website. */
177-
178-
module MarkdownTable: {
179-
@react.component
180-
let make: (~children: string) => React.element
181-
}

‎styles/_markdown.css‎

Lines changed: 0 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -72,20 +72,4 @@
7272
}
7373
}
7474
}
75-
}
76-
77-
.markdown-table {
78-
@apply overflow-x-auto mt-10 mb-16;
79-
80-
/* table {
81-
@apply
82-
} */
83-
84-
td {
85-
@apply border-b border-gray-20 py-3 pr-8;
86-
}
87-
88-
th {
89-
@apply py-2 pr-8 text-12 text-gray-60 uppercase font-medium tracking-wide text-left border-b-2 border-gray-20;
90-
}
9175
}

0 commit comments

Comments
 (0)