open-wc / custom-elements-manifest

Custom Elements Manifest is a file format that describes custom elements in your project.
https://custom-elements-manifest.open-wc.org/
225 stars 37 forks source link

Resolve `@typedef` imports from local and/or external files #213

Open lukethacoder opened 1 year ago

lukethacoder commented 1 year ago

Checklist

Playground Reproduction

Expected behavior

Attempting to resolve external @typedef definitions.

/**
 * A number, or a string containing a number.
 * @typedef {Object} NumberLike
 * @prop {number} Number to return 
 */

/**
 * A number, or a string containing a number.
 * @typedef {import('./NumberLikeTypes.js').NumberLike} NumberLikeExternal
 */

export default class MyElement {
    /**
     * Set the magic number (using a local @typedef annotation).
     * @param {(number|string)} x - The magic number.
     * @returns {NumberLike} - The magic number.
     */
    setMagicNumber(x) {
        return {
            number: x
        }
    }

    /**
     * Set the magic number (using an external @typedef annotation).
     * @param {(number|string)}
     * @returns {NumberLikeExternal} - The magic number.
     */
    setMagicNumberExternal(x) {
        return {
            number: x
        }
    }
}
// NumberLikeTypes.js
/**
 * A number, or a string containing a number.
 * @typedef {Object} NumberLike
 * @prop {number} Number to return 
 */

Output

{
  "schemaVersion": "1.0.0",
  "readme": "",
  "modules": [
    {
      "kind": "javascript-module",
      "path": "src/my-element.js",
      "declarations": [
        {
          "kind": "class",
          "description": "A number, or a string containing a number.",
          "name": "MyElement",
          "members": [
            {
              "kind": "method",
              "name": "setMagicNumber",
              "parameters": [
                {
                  "name": "x",
                  "description": "The magic number.",
                  "type": {
                    "text": "(number|string)"
                  }
                }
              ],
              "description": "Set the magic number (using a local @typedef annotation).",
              "return": {
                "type": {
                  "text": "NumberLike"
                }
              }
            },
            {
              "kind": "method",
              "name": "setMagicNumberExternal",
              "parameters": [
                {
                  "name": "x"
                },
                {
                  "name": "",
                  "type": {
                    "text": "(number|string)"
                  }
                }
              ],
              "description": "Set the magic number (using an external @typedef annotation).",
              "return": {
                "type": {
                  "text": "NumberLikeExternal"
                }
              }
            }
          ]
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "default",
          "declaration": {
            "name": "MyElement",
            "module": "src/my-element.js"
          }
        }
      ]
    }
  ]
}

Hoping that NumberLikeExternal and NumberLike could be resolved to show the actual types, not just the string text of them.

thepassle commented 1 year ago

Can yu clarify the issue? This CEM output looks correct to me.

kwickramasekara commented 5 months ago

I'm also curious if this is possible. In my case, Im expecting NumberLike to resolve to "'foo' | 'bar'" given its defined as export type NumberLike = 'foo' | 'bar';

See return type:

"declarations": [
  {
    "kind": "class",
    "description": "A number, or a string containing a number.",
    "name": "MyElement",
    "members": [
      {
        "kind": "method",
        "name": "setMagicNumber",
        "parameters": [
          {
            "name": "x",
            "description": "The magic number.",
            "type": {
              "text": "(number|string)"
            }
          }
        ],
        "description": "Set the magic number (using a local @typedef annotation).",
        "return": {
          "type": {
            "text": "'foo' | 'bar'"
          }
        }
      }
    ]
  }
]