break-stuff / cem-tools

Tooling for generating features based on the Custom Elements Manifest
MIT License
98 stars 13 forks source link

[expanded-types] Can't pick a type from an interface #106

Open nikita-rudenko opened 6 months ago

nikita-rudenko commented 6 months ago

Let's say in a file with Lit component I have an interface that describes props:

export interface ButtonProps {
  variant: 'primary' | 'secondary' | 'tertiary'
  size: 'sm' | 'md' | 'lg'
}

Then I reference it for a property:

export class Button extends LitElement {
  @property({ type: String })
  variant: ButtonProps["variant"] = "primary";
 ...

There is no expandedType generated in custom-elements.json. The result looks like this:

...
{
  "kind": "field",
  "name": "variant",
  "type": {
     "text": "ButtonProps[\"variant\"]"
   },
   "default": "\"primary\"",
   "attribute": "variant"
},
...

Expected result:

...
{
  "kind": "field",
  "name": "variant",
  "type": {
     "text": "ButtonProps[\"variant\"]"
   },
   "default": "\"primary\"",
   "attribute": "variant",
   "expandedType": {
     "text": "'primary' | 'secondary' | 'tertiary'"
    }
},
...
break-stuff commented 5 months ago

"computed types" like these, generics, and other TS functions are difficult for the analyzer to parse. I haven't found a good way to do that yet.

Out of curiosity if you set it to a new type, does it work?

type ButtonVariants = ButtonProps["variant"];

export class Button extends LitElement {
  @property({ type: String })
  variant: ButtonVariants = "primary";
 ...