Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Appearance settings

Commit ce173f2

Browse filesBrowse files
wooormwooorm
committed
Refactor to add types for JSX runtimes
1 parent e9a307b commit ce173f2
Copy full SHA for ce173f2

5 files changed

+121-22Lines changed: 121 additions & 22 deletions

File tree

Expand file treeCollapse file tree
Open diff view settings
Filter options
Expand file treeCollapse file tree
Open diff view settings
Collapse file

‎package.json‎

Copy file name to clipboardExpand all lines: package.json
-5Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -169,11 +169,6 @@
169169
"atLeast": 100,
170170
"detail": true,
171171
"ignoreCatch": true,
172-
"#": "needed `any`s; to do: can they be typed, liked `hast-util-to-jsx-runtime`?",
173-
"ignoreFiles": [
174-
"packages/mdx/lib/util/resolve-evaluate-options.d.ts",
175-
"packages/mdx/lib/util/resolve-evaluate-options.js"
176-
],
177172
"strict": true
178173
},
179174
"xo": {
Collapse file

‎packages/mdx/lib/util/resolve-evaluate-options.js‎

Copy file name to clipboardExpand all lines: packages/mdx/lib/util/resolve-evaluate-options.js
+102-9Lines changed: 102 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,117 @@
11
/**
2+
* @typedef {import('mdx/types.js').MDXComponents} Components
23
* @typedef {import('../core.js').ProcessorOptions} ProcessorOptions
4+
*/
5+
6+
/**
7+
* @typedef {JSX.Element | string | null | undefined} Child
8+
* Child.
9+
*
10+
* @typedef {EvaluateProcessorOptions & RunnerOptions} EvaluateOptions
11+
* Configuration for evaluation.
12+
*
13+
* @typedef {Omit<ProcessorOptions, 'jsx' | 'jsxImportSource' | 'jsxRuntime' | 'pragma' | 'pragmaFrag' | 'pragmaImportSource' | 'providerImportSource' | 'outputFormat'> } EvaluateProcessorOptions
14+
* Compile configuration without JSX options for evaluation.
15+
*
16+
* @typedef {unknown} Fragment
17+
* Represent the children, typically a symbol.
18+
*
19+
* @callback Jsx
20+
* Create a production element.
21+
* @param {unknown} type
22+
* Element type: `Fragment` symbol, tag name (`string`), component.
23+
* @param {Props} props
24+
* Element props, `children`, and maybe `node`.
25+
* @param {string | undefined} [key]
26+
* Dynamicly generated key to use.
27+
* @returns {JSX.Element}
28+
* An element from your framework.
29+
*
30+
* @callback JsxDev
31+
* Create a development element.
32+
* @param {unknown} type
33+
* Element type: `Fragment` symbol, tag name (`string`), component.
34+
* @param {Props} props
35+
* Element props, `children`, and maybe `node`.
36+
* @param {string | undefined} key
37+
* Dynamicly generated key to use.
38+
* @param {boolean} isStaticChildren
39+
* Whether two or more children are passed (in an array), which is whether
40+
* `jsxs` or `jsx` would be used.
41+
* @param {Source} source
42+
* Info about source.
43+
* @param {undefined} self
44+
* Nothing (this is used by frameworks that have components, we don’t).
45+
* @returns {JSX.Element}
46+
* An element from your framework.
47+
*
48+
* @callback MergeComponents
49+
* Custom merge function.
50+
* @param {Components} currentComponents
51+
* Current components from the context.
52+
* @returns {Components}
53+
* Merged components.
54+
*
55+
* @typedef {{children?: Array<Child> | Child, node?: Element | undefined, [prop: string]: Array<Child> | Child | Element | Value | undefined}} Props
56+
* Properties and children.
357
*
458
* @typedef RunnerOptions
559
* Configuration with JSX runtime.
6-
* @property {any} Fragment
60+
* @property {Fragment} Fragment
761
* Symbol to use for fragments.
8-
* @property {any} [jsx]
62+
* @property {Jsx | null | undefined} [jsx]
963
* Function to generate an element with static children in production mode.
10-
* @property {any} [jsxs]
64+
* @property {Jsx | null | undefined} [jsxs]
1165
* Function to generate an element with dynamic children in production mode.
12-
* @property {any} [jsxDEV]
66+
* @property {JsxDev | null | undefined} [jsxDEV]
1367
* Function to generate an element in development mode.
14-
* @property {any} [useMDXComponents]
68+
* @property {UseMdxComponents | null | undefined} [useMDXComponents]
1569
* Function to get `MDXComponents` from context.
1670
*
17-
* @typedef {Omit<ProcessorOptions, 'jsx' | 'jsxImportSource' | 'jsxRuntime' | 'pragma' | 'pragmaFrag' | 'pragmaImportSource' | 'providerImportSource' | 'outputFormat'> } EvaluateProcessorOptions
18-
* Compile configuration without JSX options for evaluation.
71+
* @typedef RuntimeDevelopment
72+
* Runtime fields when development is on.
73+
* @property {Fragment} Fragment
74+
* Fragment.
75+
* @property {Jsx | null | undefined} [jsx]
76+
* Dynamic JSX (optional).
77+
* @property {JsxDev} jsxDEV
78+
* Development JSX.
79+
* @property {Jsx | null | undefined} [jsxs]
80+
* Static JSX (optional).
1981
*
20-
* @typedef {EvaluateProcessorOptions & RunnerOptions} EvaluateOptions
21-
* Configuration for evaluation.
82+
* @typedef RuntimeProduction
83+
* Runtime fields when development is off.
84+
* @property {Fragment} Fragment
85+
* Fragment.
86+
* @property {Jsx} jsx
87+
* Dynamic JSX.
88+
* @property {JsxDev | null | undefined} [jsxDEV]
89+
* Development JSX (optional).
90+
* @property {Jsx} jsxs
91+
* Static JSX.
92+
*
93+
* @typedef Source
94+
* Info about source.
95+
* @property {number | undefined} columnNumber
96+
* Column where thing starts (0-indexed).
97+
* @property {string | undefined} fileName
98+
* Name of source file.
99+
* @property {number | undefined} lineNumber
100+
* Line where thing starts (1-indexed).
101+
*
102+
* @typedef {Record<string, string>} Style
103+
* Style map.
104+
*
105+
* @callback UseMdxComponents
106+
* Get current components from the MDX Context.
107+
* @param {Components | MergeComponents | null | undefined} [components]
108+
* Additional components to use or a function that takes the current
109+
* components and filters/merges/changes them.
110+
* @returns {Components}
111+
* Current components.
112+
*
113+
* @typedef {Style | boolean | number | string} Value
114+
* Primitive property value and `Style` map.
22115
*/
23116

24117
/**
Collapse file

‎packages/mdx/test/evaluate.js‎

Copy file name to clipboardExpand all lines: packages/mdx/test/evaluate.js
+7-2Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,8 @@
1+
/**
2+
* @typedef {import('../lib/util/resolve-evaluate-options.js').RuntimeDevelopment} RuntimeDevelopment
3+
* @typedef {import('../lib/util/resolve-evaluate-options.js').RuntimeProduction} RuntimeProduction
4+
*/
5+
16
import assert from 'node:assert/strict'
27
import {test} from 'node:test'
38
import {renderToStaticMarkup} from 'react-dom/server'
@@ -7,10 +12,10 @@ import React from 'react'
712
import * as provider from '../../react/index.js'
813
import {evaluate, evaluateSync, compile} from '../index.js'
914

10-
/** @type {{Fragment: unknown, jsx: unknown, jsxs: unknown}} */
15+
/** @type {RuntimeProduction} */
1116
// @ts-expect-error: types are wrong.
1217
const runtime = runtime_
13-
/** @type {{Fragment: unknown, jsxDEV: unknown}} */
18+
/** @type {RuntimeDevelopment} */
1419
// @ts-expect-error: types are wrong.
1520
const devRuntime = devRuntime_
1621

Collapse file

‎packages/preact/test/index.jsx‎

Copy file name to clipboardExpand all lines: packages/preact/test/index.jsx
+7-1Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,18 @@
11
/* @jsxRuntime automatic @jsxImportSource preact */
22

3+
/**
4+
* @typedef {import('@mdx-js/mdx/lib/util/resolve-evaluate-options.js').RuntimeProduction} RuntimeProduction
5+
*/
6+
37
import assert from 'node:assert/strict'
48
import {test} from 'node:test'
5-
import * as runtime from 'preact/jsx-runtime'
9+
import * as runtime_ from 'preact/jsx-runtime'
610
import {render} from 'preact-render-to-string'
711
import {evaluate} from '@mdx-js/mdx'
812
import {MDXProvider, useMDXComponents, withMDXComponents} from '../index.js'
913

14+
const runtime = /** @type {RuntimeProduction} */ (runtime_)
15+
1016
test('should support `components` with `MDXProvider`', async () => {
1117
const {default: Content} = await evaluate('# hi', {
1218
...runtime,
Collapse file

‎packages/react/test/index.jsx‎

Copy file name to clipboardExpand all lines: packages/react/test/index.jsx
+5-5Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,18 @@
11
/**
2-
* @typedef {import('react').ReactNode} ReactNode
2+
* @typedef {import('@mdx-js/mdx/lib/util/resolve-evaluate-options.js').RuntimeProduction} RuntimeProduction
33
*/
44

55
import assert from 'node:assert/strict'
66
import {test} from 'node:test'
77
import {evaluate} from '@mdx-js/mdx'
88
import React from 'react'
9-
import * as runtimeRaw from 'react/jsx-runtime'
9+
import * as runtime_ from 'react/jsx-runtime'
1010
import {renderToString} from 'react-dom/server'
1111
import {MDXProvider, useMDXComponents, withMDXComponents} from '../index.js'
1212

13-
/** @type {{Fragment: unknown, jsx: unknown, jsxs: unknown}} */
14-
// @ts-expect-error: React types are wrong.
15-
const runtime = runtimeRaw
13+
const runtime = /** @type {RuntimeProduction} */ (
14+
/** @type {unknown} */ (runtime_)
15+
)
1616

1717
test('should support `components` with `MDXProvider`', async () => {
1818
const {default: Content} = await evaluate('# hi', {

0 commit comments

Comments
0 (0)
Morty Proxy This is a proxified and sanitized view of the page, visit original site.