How to change component display name in UI but not break example imports

[aldeed]

This may be partially a docgen issue, but I am trying to change the name used for the component heading and TOC. Something like this:

function customDisplayName(componentPath) {
  return (documentation, definition) => {
    documentation.set("displayName", "v1");
  };
}

The use case is that we have multiple versions of a component maintained at one time, but we want those version groupings beneath the component name in the hierarchy. Example:

Components
  Button
    v1
    v2

Where the folder structure is:

/src/components/Button/v1/Button.js <-- default export is Button component
/src/components/Button/v1/Button.md <-- v1 docs
/src/components/Button/v2/Button.js <-- default export is slightly different Button component
/src/components/Button/v2/Button.md <-- v2 docs

So I am doing "Button" as a section and adding all versions of that component within /src/components/Button in the components array.

The problem

When I set displayName to something different from the component name as it's used in the examples, the TOC/headings look good but the examples now can't find it.

If my example is <Button />, how can I tell it "use the button in the same directory as you"? OR how can I change the TOC/heading text without setting the displayName and breaking everything?

[sapegin]

I see two issues here:

1. Different component name, visible in the UI. This would be nice to have, it’s mentioned in Improve single-component usage #195.
2. Access to different components with the same name, because all will have the same name. So you'll need to require the right component in each example, or invent something else ;-)

[aldeed]

Agree, that sums up my two questions. My preference for 2 would be that any example in the .md for a specific component would be able to assume it should import the component that's in the same folder. But in any other .md file example, it would need to be required from a specific version as you say.

I could PR this if there's any guidance on where/how it would be done.

[sapegin]

Would be cool if you can PR 1 ;-) I'm not really sure there's an easy way to do 2 before #325, and I doubt there are many use cases for that to actually do that.