reactjs / reactjs/react-docgen

Missing support for `Pick<>` and `Omit<>`

Offen
#925 3 Kommentare 10 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

Whenever an interface is using the typescript features Pick or Omit, then we don't get any props from these interfaces/types.

In the case of an interface like this:

import { type LinkProps } from "next/link";

interface MyComponentProps
  extends Pick<LinkProps, "prefetch" | "replace" | "scroll" | "shallow"> {
  children?: React.ReactNode;
}

export const MyComponent: FunctionComponent<MyComponentProps> = () => {
  return <>My Component</>;
};

-> in this case it will only find "children" as prop.

import { type LinkProps } from "next/link";

interface MyComponentProps
  extends Pick<LinkProps, "prefetch" | "replace" | "scroll" | "shallow"> {
  children?: React.ReactNode;
}

export const MyComponent: FunctionComponent<MyComponentProps> = () => {
  return <>My Component</>;
};

The same with Omit<>:

import { type LinkProps } from "next/link";

interface MyComponentProps
  extends Omit<LinkProps, "prefetch" | "replace" | "scroll" | "shallow"> {
  children?: React.ReactNode;
}

export const MyComponent: FunctionComponent<MyComponentProps> = () => {
  return <>My Component</>;
};

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 damit, die gemeldeten TypeScript-Beispiele mit Pick und Omit zu reproduzieren und die extrahierten Props für jedes Interface zu überprüfen. Die Arbeit ist abgeschlossen, wenn Props, die über beide Utility-Typen geerbt werden, zusammen mit explizit deklarierten Props enthalten sind.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
next.js, react, typescript
Bereich
developer-experience, devtools
Issue-Typ
Bug
Schwierigkeit
4/5
Geschätzter Aufwand
3-5 Tage
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
35/100

Neue Issues direkt in Ihr Postfach

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