Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support for compound components #775

Open
mayank99 opened this issue Apr 3, 2023 · 2 comments
Open

Support for compound components #775

mayank99 opened this issue Apr 3, 2023 · 2 comments

Comments

@mayank99
Copy link

mayank99 commented Apr 3, 2023

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:

@Powerplex
Copy link

I have the same issue. We define our compound components the same way, using Object.assign. I can use the library to get the props from the root element of the compound only. Our components are written in Typescript.

I tried react-docgen-typescript too but it doesn't have the reactDocs.parse(src, reactDocgen.resolver.findAllComponentDefinitions)

@dimitur2204
Copy link

I am running into the same problem. Did you find a workaround?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants