reactjs / reactjs/react-docgen

TypeScript: Missing Union Elements of Indexed Access Type

Aperta
#906 0 commenti 4 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

typescript
Lingua principale
TypeScript
Stelle
3.8k
Fork
316
Merge medio
5h 7m
PR unite (30g)
4

Descrizione

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.

Guida per i contributori

Apri la guida per i contributori

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Direzione di ricerca

Inizia con l'esempio TypeScript nell'issue e riproducilo nel react-docgen playground. Traccia il modo in cui viene gestito l'indexed-access type, quindi aggiungi la coverage per gli elementi literal attesi dell'unione e verifica che il JSON generato includa i tre literal mostrati.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Valutazione

Stack tecnologico
react, typescript
Ambito
documentation, tooling
Tipo di issue
Bug
Difficoltà
3/5
Tempo stimato
1-2 giorni
Stato di attività
Ferma
Chiarezza
Abbastanza chiara
Idoneità per principianti
45/100

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.