reactjs / reactjs/react-docgen

Missing support for Flow Unions

Offen
#259 5 Kommentare 6 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

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

Beschreibung

react-docgen doesn't recognize the props if it's an union type:

type BaseProps = {|
  label: string,
|};

type LinkButtonProps = {|
  ...BaseProps,
  href: string,
  target?: string,
  rel?: string,
|};

type ButtonProps = {|
  ...BaseProps,
  type?: 'button' | 'submit',
|};

type Props = ButtonProps | LinkButtonProps;

class MyButton extends React.Component<Props> {
  render() {
     // conditionally render `<a>` or `<button>` based on props...
  }
}

I don't want users to pass props that are specific to <a> at the same time as some props that are specific to <button> - I know this kind of pattern of having a single component render to <a> or <button> is "weird", but some of our legacy components use it...

For now I need to define a single type that includes all the props and mark them all as optional - which is "fine", I guess..

More info about unions here: https://flow.org/en/docs/types/unions/

tested on v3.0.0-beta10

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

Reproduziere das Beispiel aus dem Issue mit react-docgen v3.0.0-beta10 und vergleiche das Ergebnis mit den erwarteten Props für die Union. Lies die verlinkte Dokumentation zu Flow-Unions und verfolge den Parser-Einstiegspunkt, der Component-Props verarbeitet. Erledigt ist die Aufgabe, wenn Union-Mitglieder erkannt werden, ohne dass Benutzer alle Props in einen einzigen optionalen Typ abflachen müssen.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
javascript, react
Bereich
devtools, documentation
Issue-Typ
Feature
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.