reactjs / reactjs/react-docgen

TypeScript: Missing Union Elements of Indexed Access Type

Offen
#906 0 Kommentare 4 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

typescript
Vorherrschende Sprache
TypeScript
Sterne
3.8k
Forks
316
Ø Merge
5 Std. 7 Min.
Gemergte PRs (30 T.)
4

Beschreibung

Hello there,
In the following code, the elements of the size props are not outputted.

type Base = {
  size: "small" | "medium" | "large";  
};

type Props = {
  size: Base["size"];
}

const MyComponent = ({size}: Props) => {
  return <div />;
}

Result

[
  {
    "description": "",
    "displayName": "MyComponent",
    "methods": [],
    "props": {
      "size": {
        "required": true,
        "tsType": {
          "name": "union",
          "raw": "Base[\"size\"]"
        },
        "description": ""
      }
    }
  }
]

Expected Behavior

[
  {
    "description": "",
    "displayName": "MyComponent",
    "methods": [],
    "props": {
      "size": {
        "required": true,
        "tsType": {
          "name": "union",
          "raw": "\"small\" | \"medium\" | \"large\"",
          "elements": [
            {
              "name": "literal",
              "value": "\"small\""
            },
            {
              "name": "literal",
              "value": "\"medium\""
            },
            {
              "name": "literal",
              "value": "\"large\""
            }
          ]
        },
        "description": ""
      }
    }
  }
]

I reproduced it here:
https://react-docgen.dev/playground

Thanks for regards.

Beitragsleitfaden

Beitragsleitfaden öffnen

Erste Schritte

  1. Lies das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreib ins Issue, dass du es übernimmst — das erspart doppelte Arbeit.
  3. Forke das Repository und arbeite in einem Branch.
  4. Öffne einen Pull Request, der die Issue-Nummer nennt.

Rechercherichtung

Beginne mit dem TypeScript-Beispiel im Issue und reproduziere es im react-docgen playground. Verfolge, wie der indexed-access type verarbeitet wird, füge dann eine Abdeckung für die erwarteten Union-Literal-Elemente hinzu und bestätige, dass das generierte JSON die drei gezeigten Literale enthält.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
react, typescript
Bereich
documentation, tooling
Issue-Typ
Bug
Schwierigkeit
3/5
Geschätzter Aufwand
1-2 Tage
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
45/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.