Skip to content

Commit 35ac59d

Browse files
committed
Refactor some docs regarding recma plugins
Related-to: GH-2584.
1 parent b9ec244 commit 35ac59d

File tree

3 files changed

+20
-19
lines changed

3 files changed

+20
-19
lines changed

packages/mdx/lib/core.js

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -98,19 +98,17 @@
9898
* without arguments to get an object of components (`MDXComponents` from
9999
* `mdx/types.js`).
100100
* @property {PluggableList | null | undefined} [recmaPlugins]
101-
* List of recma plugins (optional);
102-
* this is a new ecosystem, currently in beta, to transform esast trees
103-
* (JavaScript)
101+
* List of recma plugins (optional).
104102
* @property {PluggableList | null | undefined} [remarkPlugins]
105103
* List of remark plugins (optional).
106104
* @property {PluggableList | null | undefined} [rehypePlugins]
107105
* List of rehype plugins (optional).
108106
* @property {Readonly<RemarkRehypeOptions> | null | undefined} [remarkRehypeOptions]
109-
* Options to pass through to `remark-rehype` (optional);
107+
* Options to pass to `remark-rehype` (optional);
108+
* in particular, you might want to pass configuration for footnotes if your
109+
* content is not in English;
110110
* the option `allowDangerousHtml` will always be set to `true` and the MDX
111-
* nodes (see `nodeTypes`) are passed through;
112-
* In particular, you might want to pass configuration for footnotes if your
113-
* content is not in English.
111+
* nodes (see `nodeTypes`) are passed through.
114112
* @property {RehypeRecmaOptions['stylePropertyNameCase']} [stylePropertyNameCase='dom']
115113
* Casing to use for property names in `style` objects (default: `'dom'`);
116114
* CSS casing is for example `background-color` and `-webkit-line-clamp`;

packages/mdx/lib/types.d.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ declare module 'estree' {
3434

3535
interface Comment {
3636
/**
37-
* Extra unist data passed added by `recma-document`.
37+
* Extra unist data added by `recma-document`.
3838
*
3939
* Registered by `@mdx-js/mdx/lib/types.d.ts`.
4040
*/

packages/mdx/readme.md

Lines changed: 14 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -905,9 +905,7 @@ Configuration for `createProcessor` (TypeScript type).
905905

906906
* `recmaPlugins` ([`PluggableList` from `unified`][unified-pluggable-list],
907907
optional)
908-
— list of recma plugins;
909-
this is a new ecosystem, currently in beta, to transform [esast][] trees
910-
(JavaScript)
908+
— list of [recma plugins][recma-plugins]
911909

912910
<details><summary>Expand example</summary>
913911

@@ -961,10 +959,10 @@ Configuration for `createProcessor` (TypeScript type).
961959
* `remarkRehypeOptions` ([`Options` from
962960
`remark-rehype`][remark-rehype-options], optional)
963961
— options to pass through to `remark-rehype`;
962+
in particular, you might want to pass configuration for footnotes if your
963+
content is not in English;
964964
the option `allowDangerousHtml` will always be set to `true` and the MDX
965-
nodes (see [`nodeTypes`][api-node-types]) are passed through;
966-
In particular, you might want to pass configuration for footnotes if your
967-
content is not in English
965+
nodes (see [`nodeTypes`][api-node-types]) are passed through.
968966

969967
<details><summary>Expand example</summary>
970968

@@ -1096,8 +1094,10 @@ The processor goes through these steps:
10961094
7. transform through recma (JS ecosystem)
10971095
8. serialize esast as JavaScript
10981096

1099-
The *input* is MDX (serialized markdown with embedded JSX, ESM, and
1100-
expressions).
1097+
The *input* is MDX.
1098+
That’s serialized markdown with embedded JSX, ESM, and expressions.
1099+
In the case of JSX,
1100+
the tags are *intertwined* with markdown.
11011101
The markdown is parsed with [`micromark/micromark`][micromark] and the embedded
11021102
JS with one of its extensions
11031103
[`micromark/micromark-extension-mdxjs`][micromark-extension-mdxjs] (which in
@@ -1116,7 +1116,7 @@ respectively.
11161116
After markdown, we go to [hast][] (HTML).
11171117
This transformation is done by
11181118
[`syntax-tree/mdast-util-to-hast`][mdast-util-to-hast].
1119-
Wait, why, what is HTML needed?
1119+
Wait, what, why is HTML needed?
11201120
Part of the reason is that we care about HTML semantics: we want to know that
11211121
something is an `<a>`, not whether it’s a link with a resource (`[text](url)`)
11221122
or a reference to a defined link definition (`[text][id]\n\n[id]: url`).
@@ -1135,8 +1135,9 @@ Then we go to JavaScript: [esast][] (JS; an
11351135
AST which is compatible with estree but looks a bit more like other unist ASTs).
11361136
This transformation is done by
11371137
[`rehype-recma`][rehype-recma].
1138-
This is a new ecosystem that does not have utilities or plugins yet.
1139-
But it’s where `@mdx-js/mdx` does its thing: where it adds imports/exports,
1138+
This is a newer ecosystem.
1139+
There are some [recma plugins][recma-plugins] already.
1140+
It’s where `@mdx-js/mdx` does its thing: where it adds imports/exports,
11401141
where it compiles JSX away into `_jsx()` calls, and where it does the other cool
11411142
things that it provides.
11421143

@@ -1263,6 +1264,8 @@ abide by its terms.
12631264

12641265
[npm]: https://docs.npmjs.com/cli/install
12651266

1267+
[recma-plugins]: https://github.com/mdx-js/recma/blob/main/doc/plugins.md#list-of-plugins
1268+
12661269
[rehype-highlight]: https://github.com/rehypejs/rehype-highlight
12671270

12681271
[rehype-katex]: https://github.com/remarkjs/remark-math/tree/main/packages/rehype-katex

0 commit comments

Comments
 (0)