Refactor to use @imports

Author: wooorm

lib/handlers/comment.js

@@ -1,12 +1,11 @@
 /**
- * @typedef {import('estree').Comment} Comment
- *
- * @typedef {import('estree-jsx').JSXEmptyExpression} JsxEmptyExpression
- * @typedef {import('estree-jsx').JSXExpressionContainer} JsxExpressionContainer
- *
- * @typedef {import('hast').Comment} HastComment
- *
- * @typedef {import('../state.js').State} State
+ * @import {
+ *   JSXEmptyExpression as JsxEmptyExpression,
+ *   JSXExpressionContainer as JsxExpressionContainer,
+ * } from 'estree-jsx'
+ * @import {Comment} from 'estree'
+ * @import {State} from 'hast-util-to-estree'
+ * @import {Comment as HastComment} from 'hast'
  */
 
 // Make VS Code show references to the above types.

lib/handlers/element.js

@@ -1,17 +1,12 @@
 /**
- * @typedef {import('estree').Property} Property
- *
- * @typedef {import('estree-jsx').JSXAttribute} JsxAttribute
- * @typedef {import('estree-jsx').JSXElement} JsxElement
- * @typedef {import('estree-jsx').JSXSpreadAttribute} JsxSpreadAttribute
- *
- * @typedef {import('hast').Element} HastElement
- *
- * @typedef {import('../state.js').State} State
- */
-
-/**
- * @typedef {Record<string, string>} Style
+ * @import {
+ *   JSXAttribute as JsxAttribute,
+ *   JSXElement as JsxElement,
+ *   JSXSpreadAttribute as JsxSpreadAttribute,
+ * } from 'estree-jsx'
+ * @import {Property} from 'estree'
+ * @import {State} from 'hast-util-to-estree'
+ * @import {Element as HastElement} from 'hast'
  */
 
 import {stringify as commas} from 'comma-separated-tokens'
@@ -231,11 +226,11 @@ export function element(node, state) {
  *   CSS text.
  * @param {string} tagName
  *   Element name.
- * @returns {Style}
+ * @returns {Record<string, string>}
  *   Properties.
  */
 function parseStyle(value, tagName) {
-  /** @type {Style} */
+  /** @type {Record<string, string>} */
   const result = {}
 
   try {
@@ -277,11 +272,11 @@ function parseStyle(value, tagName) {
 /**
  * Transform a DOM casing style object to a CSS casing style object.
  *
- * @param {Style} domCasing
- * @returns {Style}
+ * @param {Record<string, string>} domCasing
+ * @returns {Record<string, string>}
  */
 function transformStylesToCssCasing(domCasing) {
-  /** @type {Style} */
+  /** @type {Record<string, string>} */
   const cssCasing = {}
   /** @type {string} */
   let from

lib/handlers/mdx-expression.js

@@ -1,13 +1,14 @@
 /**
- * @typedef {import('estree').Expression} Expression
- *
- * @typedef {import('estree-jsx').JSXEmptyExpression} JsxEmptyExpression
- * @typedef {import('estree-jsx').JSXExpressionContainer} JsxExpressionContainer
- *
- * @typedef {import('mdast-util-mdx-expression').MdxFlowExpressionHast} MdxFlowExpression
- * @typedef {import('mdast-util-mdx-expression').MdxTextExpressionHast} MdxTextExpression
- *
- * @typedef {import('../state.js').State} State
+ * @import {
+ *   JSXEmptyExpression as JsxEmptyExpression,
+ *   JSXExpressionContainer as JsxExpressionContainer
+ * } from 'estree-jsx'
+ * @import {Expression} from 'estree'
+ * @import {
+ *   MdxFlowExpressionHast as MdxFlowExpression,
+ *   MdxTextExpressionHast as MdxTextExpression
+ * } from 'mdast-util-mdx-expression'
+ * @import {State} from 'hast-util-to-estree'
  */
 
 import {attachComments} from 'estree-util-attach-comments'

lib/handlers/mdx-jsx-element.js

@@ -1,15 +1,16 @@
 /**
- * @typedef {import('estree').Expression} Expression
- *
- * @typedef {import('estree-jsx').JSXAttribute} JsxAttribute
- * @typedef {import('estree-jsx').JSXElement} JsxElement
- * @typedef {import('estree-jsx').JSXFragment} JsxFragment
- * @typedef {import('estree-jsx').JSXSpreadAttribute} JsxSpreadAttribute
- *
- * @typedef {import('mdast-util-mdx-jsx').MdxJsxFlowElementHast} MdxJsxFlowElement
- * @typedef {import('mdast-util-mdx-jsx').MdxJsxTextElementHast} MdxJsxTextElement
- *
- * @typedef {import('../state.js').State} State
+ * @import {
+ *   JSXAttribute as JsxAttribute,
+ *   JSXElement as JsxElement,
+ *   JSXFragment as JsxFragment,
+ *   JSXSpreadAttribute as JsxSpreadAttribute
+ * } from 'estree-jsx'
+ * @import {Expression} from 'estree'
+ * @import {State} from 'hast-util-to-estree'
+ * @import {
+ *   MdxJsxFlowElementHast as MdxJsxFlowElement,
+ *   MdxJsxTextElementHast as MdxJsxTextElement
+ * } from 'mdast-util-mdx-jsx'
  */
 
 import {attachComments} from 'estree-util-attach-comments'

lib/handlers/mdxjs-esm.js

@@ -1,7 +1,6 @@
 /**
- * @typedef {import('mdast-util-mdxjs-esm').MdxjsEsmHast} MdxjsEsm
- *
- * @typedef {import('../state.js').State} State
+ * @import {MdxjsEsmHast as MdxjsEsm} from 'mdast-util-mdxjs-esm'
+ * @import {State} from 'hast-util-to-estree'
  */
 
 import {attachComments} from 'estree-util-attach-comments'

lib/handlers/root.js

@@ -1,13 +1,13 @@
 /**
- * @typedef {import('estree-jsx').JSXFragment} JsxFragment
- *
- * @typedef {import('hast').Root} HastRoot
- *
- * @typedef {import('../state.js').State} State
- */
-
-/**
- * @typedef {JsxFragment['children'][number]} JsxChild
+ * @import {
+ *   JSXElement as JsxElement,
+ *   JSXExpressionContainer as JsxExpressionContainer,
+ *   JSXFragment as JsxFragment,
+ *   JSXSpreadChild as JsxSpreadChild,
+ *   JSXText as JsxText,
+ * } from 'estree-jsx'
+ * @import {State} from 'hast-util-to-estree'
+ * @import {Root as HastRoot} from 'hast'
  */
 
 import {whitespace} from 'hast-util-whitespace'
@@ -24,10 +24,10 @@ import {whitespace} from 'hast-util-whitespace'
  */
 export function root(node, state) {
   const children = state.all(node)
-  /** @type {Array<JsxChild>} */
+  /** @type {Array<JsxElement | JsxExpressionContainer | JsxFragment | JsxSpreadChild | JsxText>} */
   const cleanChildren = []
   let index = -1
-  /** @type {Array<JsxChild> | undefined} */
+  /** @type {Array<JsxElement | JsxExpressionContainer | JsxFragment | JsxSpreadChild | JsxText> | undefined} */
   let queue
 
   // Remove surrounding whitespace nodes from the fragment.

lib/handlers/text.js

@@ -1,11 +1,8 @@
 /**
- * @typedef {import('estree').Literal} Literal
- *
- * @typedef {import('estree-jsx').JSXExpressionContainer} JsxExpressionContainer
- *
- * @typedef {import('hast').Text} HastText
- *
- * @typedef {import('../state.js').State} State
+ * @import {JSXExpressionContainer as JsxExpressionContainer} from 'estree-jsx'
+ * @import {Literal} from 'estree'
+ * @import {State} from 'hast-util-to-estree'
+ * @import {Text as HastText} from 'hast'
  */
 
 // Make VS Code show references to the above types.

lib/index.js

@@ -1,18 +1,10 @@
 /**
- * Register MDX nodes in tree:
- *
- * @typedef {import('mdast-util-mdx-expression')}
- * @typedef {import('mdast-util-mdx-jsx')}
- * @typedef {import('mdast-util-mdxjs-esm')}
- */
-
-/**
- * @typedef {import('estree').ExpressionStatement} ExpressionStatement
- * @typedef {import('estree').Program} Program
- *
- * @typedef {import('hast').Nodes} HastNodes
- *
- * @typedef {import('./state.js').Options} Options
+ * @import {} from 'mdast-util-mdx-expression'
+ * @import {} from 'mdast-util-mdx-jsx'
+ * @import {} from 'mdast-util-mdxjs-esm'
+ * @import {ExpressionStatement, Program} from 'estree'
+ * @import {Options} from 'hast-util-to-estree'
+ * @import {Nodes as HastNodes} from 'hast'
  */
 
 import {createState} from './state.js'

lib/state.js

@@ -1,30 +1,18 @@
 /**
- * @typedef {import('estree').Comment} Comment
- * @typedef {import('estree').Directive} Directive
- * @typedef {import('estree').ModuleDeclaration} ModuleDeclaration
- * @typedef {import('estree').Node} EstreeNode
- * @typedef {import('estree').Statement} Statement
- *
- * @typedef {import('estree-jsx').JSXAttribute} JsxAttribute
- * @typedef {import('estree-jsx').JSXElement} JsxElement
- * @typedef {import('estree-jsx').JSXIdentifier} JsxIdentifier
- * @typedef {import('estree-jsx').JSXMemberExpression} JsxMemberExpression
- * @typedef {import('estree-jsx').JSXNamespacedName} JsxNamespacedName
- *
- * @typedef {import('mdast-util-mdx-jsx').MdxJsxAttribute} MdxJsxAttribute
- * @typedef {import('mdast-util-mdx-jsx').MdxJsxAttributeValueExpression} MdxJsxAttributeValueExpression
- * @typedef {import('mdast-util-mdx-jsx').MdxJsxExpressionAttribute} MdxJsxExpressionAttribute
- *
- * @typedef {import('hast').Nodes} HastNodes
- * @typedef {import('hast').Parents} HastParents
- *
- * @typedef {import('property-information').Schema} Schema
- */
-
-/**
- * @typedef {JsxElement['openingElement']['name']} JsxElementName
- * @typedef {JsxAttribute['name']} JsxAttributeName
- * @typedef {JsxElement['children'][number]} JsxChild
+ * @import {
+ *   JSXElement as JsxElement,
+ *   JSXExpressionContainer as JsxExpressionContainer,
+ *   JSXFragment as JsxFragment,
+ *   JSXIdentifier as JsxIdentifier,
+ *   JSXMemberExpression as JsxMemberExpression,
+ *   JSXNamespacedName as JsxNamespacedName,
+ *   JSXSpreadChild as JsxSpreadChild,
+ *   JSXText as JsxText,
+ * } from 'estree-jsx'
+ * @import {Comment, Directive, ModuleDeclaration, Node as EstreeNode, Statement} from 'estree'
+ * @import {MdxJsxAttribute, MdxJsxAttributeValueExpression, MdxJsxExpressionAttribute} from 'mdast-util-mdx-jsx'
+ * @import {Nodes as HastNodes, Parents as HastParents} from 'hast'
+ * @import {Schema} from 'property-information'
  */
 
 /**
@@ -40,7 +28,7 @@
  *   Expected hast node.
  * @param {State} state
  *   Info passed around about the current state.
- * @returns {JsxChild | null | undefined}
+ * @returns {JsxElement | JsxExpressionContainer | JsxFragment | JsxSpreadChild | JsxText | null | undefined}
  *   estree node.
  *
  * @typedef Options
@@ -78,19 +66,19 @@
  *
  * @typedef State
  *   Info passed around about the current state.
- * @property {(parent: HastParents) => Array<JsxChild>} all
+ * @property {(parent: HastParents) => Array<JsxElement | JsxExpressionContainer | JsxFragment | JsxSpreadChild | JsxText>} all
  *   Transform children of a hast parent to estree.
  * @property {Array<Comment>} comments
  *   List of estree comments.
- * @property {(name: string) => JsxAttributeName} createJsxAttributeName
+ * @property {(name: string) => JsxIdentifier | JsxNamespacedName} createJsxAttributeName
  *   Create a JSX attribute name.
- * @property {(name: string) => JsxElementName} createJsxElementName
+ * @property {(name: string) => JsxIdentifier | JsxMemberExpression | JsxNamespacedName} createJsxElementName
  *   Create a JSX element name.
  * @property {ElementAttributeNameCase} elementAttributeNameCase
  *   Casing to use for attribute names.
  * @property {Array<Directive | ModuleDeclaration | Statement>} esm
  *   List of top-level estree nodes.
- * @property {(node: any) => JsxChild | null | undefined} handle
+ * @property {(node: any) => JsxElement | JsxExpressionContainer | JsxFragment | JsxSpreadChild | JsxText | null | undefined} handle
  *   Transform a hast node to estree.
  * @property {(from: HastNodes | MdxJsxAttribute | MdxJsxAttributeValueExpression | MdxJsxExpressionAttribute, to: Comment | EstreeNode) => undefined} inherit
  *   Take positional info and data from `from` (use `patch` if you don’t want data).
@@ -164,7 +152,7 @@ export function createState(options) {
   /**
    * @this {State}
    * @param {any} node
-   * @returns {JsxChild | null | undefined}
+   * @returns {JsxElement | JsxExpressionContainer | JsxFragment | JsxSpreadChild | JsxText | null | undefined}
    */
   function handle(node) {
     return one(node, this)
@@ -202,13 +190,13 @@ function unknown(node) {
  *   Info passed around about the current state.
  * @param {HastParents} parent
  *   hast node whose children to transform.
- * @returns {Array<JsxChild>}
+ * @returns {Array<JsxElement | JsxExpressionContainer | JsxFragment | JsxSpreadChild | JsxText>}
  *   estree nodes.
  */
 function all(parent) {
   const children = parent.children || []
   let index = -1
-  /** @type {Array<JsxChild>} */
+  /** @type {Array<JsxElement | JsxExpressionContainer | JsxFragment | JsxSpreadChild | JsxText>} */
   const results = []
   const ignoreLineBreak =
     this.schema.space === 'html' &&
@@ -302,7 +290,7 @@ function patch(from, to) {
  * Create a JSX attribute name.
  *
  * @param {string} name
- * @returns {JsxAttributeName}
+ * @returns {JsxIdentifier | JsxNamespacedName}
  */
 function createJsxAttributeName(name) {
   const node = createJsxNameFromString(name)
@@ -320,7 +308,7 @@ function createJsxAttributeName(name) {
  * Create a JSX element name.
  *
  * @param {string} name
- * @returns {JsxElementName}
+ * @returns {JsxIdentifier | JsxMemberExpression | JsxNamespacedName}
  */
 function createJsxElementName(name) {
   return createJsxNameFromString(name)

test.js

@@ -1,10 +1,7 @@
 /**
- * @typedef {import('estree').Program} Program
- * @typedef {import('estree').Node} Node
- * @typedef {import('hast').Nodes} HastNodes
- * @typedef {import('mdast-util-mdx-jsx').MdxJsxAttribute} MdxJsxAttribute
- * @typedef {import('mdast-util-mdx-jsx').MdxJsxAttributeValueExpression} MdxJsxAttributeValueExpression
- * @typedef {import('mdast-util-mdx-jsx').MdxJsxExpressionAttribute} MdxJsxExpressionAttribute
+ * @import {Node, Program} from 'estree'
+ * @import {Nodes as HastNodes} from 'hast'
+ * @import {MdxJsxAttributeValueExpression, MdxJsxAttribute, MdxJsxExpressionAttribute} from 'mdast-util-mdx-jsx'
  */
 
 import assert from 'node:assert/strict'