bug: docs-json output target does not always expand values for a prop type correctly

[brandongregoryscott]

Prerequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

Stencil Version

4.25.3

Current Behavior

There are certain conditions that can cause the values array for a component prop to be generated incorrectly, i.e. not expanding types and a mangled string split of values.

For example, I am getting an array of values like this:

"values": [
  {
    "type": "ColorName"
  },
  {
    "type": "AllowedColors<\"Lavender-100\""
  },
  {
    "value": "Lavender-200",
    "type": "string"
  },
  {
    "value": "Lavender-300",
    "type": "string"
  },
  {
    "value": "Lavender-400",
    "type": "string"
  },
  {
    "value": "Lavender-500",
    "type": "string"
  },
  {
    "value": "Lavender-600",
    "type": "string"
  },
  {
    "value": "Ivy-100",
    "type": "string"
  },
  {
    "value": "Ivy-200",
    "type": "string"
  },
  {
    "value": "Ivy-300",
    "type": "string"
  },
  {
    "value": "Ivy-400",
    "type": "string"
  },
  {
    "value": "Ivy-500",
    "type": "string"
  },
  {
    "value": "Ivy-600",
    "type": "string"
  },
  {
    "value": "Rose-100",
    "type": "string"
  },
  {
    "value": "Rose-200",
    "type": "string"
  },
  {
    "value": "Rose-300",
    "type": "string"
  },
  {
    "value": "Rose-400",
    "type": "string"
  },
  {
    "value": "Rose-500",
    "type": "string"
  },
  {
    "type": "\"Rose-600\">"
  }
],

"type": "AllowedColors<\"Lavender-100\"" and "type": "\"Rose-600\">" are obviously not intended, and ColorName is not expanded.

Expected Behavior

I would expect the underlying values for the type to be expanded, i.e.

"values": [
  {
    "value": "Lavender",
    "type": "string"
  },
  {
    "value": "Ivy",
    "type": "string"
  },
  {
    "value": "Rose",
    "type": "string"
  },
  {
    "value": "Lavender-100",
    "type": "string"
  },
  {
    "value": "Lavender-200",
    "type": "string"
  },
  {
    "value": "Lavender-300",
    "type": "string"
  },
  {
    "value": "Lavender-400",
    "type": "string"
  },
  {
    "value": "Lavender-500",
    "type": "string"
  },
  {
    "value": "Lavender-600",
    "type": "string"
  },
  {
    "value": "Ivy-100",
    "type": "string"
  },
  {
    "value": "Ivy-200",
    "type": "string"
  },
  {
    "value": "Ivy-300",
    "type": "string"
  },
  {
    "value": "Ivy-400",
    "type": "string"
  },
  {
    "value": "Ivy-500",
    "type": "string"
  },
  {
    "value": "Ivy-600",
    "type": "string"
  },
  {
    "value": "Rose-100",
    "type": "string"
  },
  {
    "value": "Rose-200",
    "type": "string"
  },
  {
    "value": "Rose-300",
    "type": "string"
  },
  {
    "value": "Rose-400",
    "type": "string"
  },
  {
    "value": "Rose-500",
    "type": "string"
  },
  {
    "value": "Rose-600",
    "type": "string"
  }
],

System Info

System: node 22.7.0
    Platform: darwin (24.1.0)
   CPU Model: Apple M1 Pro (8 cpus)
    Compiler: /Users/Brandon/stencil-generic-prop-values-issue/node_modules/@stencil/core/compiler/stencil.js
       Build: 1738713818
     Stencil: 4.25.3 🚁
  TypeScript: 5.5.4
      Rollup: 2.56.3
      Parse5: 7.1.2
      jQuery: 4.0.0-pre
      Terser: 5.31.1

Steps to Reproduce

Check the reproduction repo I linked.

1. Clone the repo
2. Run npm install
3. Run npm run build
4. Inspect the generated docs.json file. Notice the incorrect values array for the color prop.

Play around uncommenting the other variations of types that do not result in the same behavior (you'll need to re-run a build each time)

Code Reproduction URL

https://github.com/brandongregoryscott/stencil-generic-prop-values-issue

Additional Information

No response