reactjs / reactjs/react-docgen
Support for compound components
Dieses Issue hat noch niemand übernommen.
- Vorherrschende Sprache
- TypeScript
- Sterne
- 3.8k
- Forks
- 316
- Ø Merge
- 5 Std. 7 Min.
- Gemergte PRs (30 T.)
- 4
Beschreibung
I've been playing around with the latest beta, and while it works well for many cases, I could not get it to work with compound components.
A compound component generally looks like this:
<Compound foo>
<Compound.Child />
</Compound>
I'm defining it as follows:
import React from 'react';
import type { PolymorphicComponent } from '~/utils';
const ParentComponent = React.forwardRef((props, ref) => {
return (/* ... */)
}) as PolymorphicComponent<'div', ParentOwnProps>;
type ParentOwnProps = {
/** foo prop */
foo?: boolean;
};
const ChildComponent = React.forwardRef((props, ref) => {
return (/* ... */)
}) as PolymorphicComponent<'div', ChildOwnProps>;
type ChildOwnProps = {
/** bar prop */
bar?: string;
};
/** description for main component */
export const Compound = Object.assign(ParentComponent, {
/** description for subcomponent */
Child: ChildComponent,
});
export default Compound;
I would guess that react-docgen would need to support a few different things here:
- using the types that are inferred by props (in this case through
PolymorphicComponentutility). related: #590 - detecting that these multiple components are exported through a single
Object.assigndeclaration and reading jsdoc from there
Beitragsleitfaden
Erste Schritte
- Lies das ganze Issue und danach den Beitragsleitfaden des Projekts.
- Schreib ins Issue, dass du es übernimmst — das erspart doppelte Arbeit.
- Forke das Repository und arbeite in einem Branch.
- Öffne einen Pull Request, der die Issue-Nummer nennt.
Rechercherichtung
Beginne mit der Überprüfung, wie von TypeScript inferierte Props und Object.assign-Deklarationen behandelt werden, und verwende das Beispiel PolymorphicComponent und das zugehörige Issue #590 als Einstiegspunkte. Als erledigt gilt die Aufgabe, wenn zusammengesetzte Exporte erkannt und die JSDoc-Beschreibungen des Eltern- und des Kindelements korrekt gelesen werden.
Vom Indexierungsmodell aus dem Issue-Text verfasst.
Bewertung
- Tech-Stack
- react, typescript
- Bereich
- documentation, tooling
- Issue-Typ
- Feature
- Schwierigkeit
- 5/5
- Geschätzter Aufwand
- Über eine Woche
- Aktivitätsstatus
- Veraltet
- Klarheit
- Größtenteils klar
- Anfängerfreundlichkeit
- 25/100