TITLE string const as fallback for meta.title default export

[lunelson]

Since the default export of a non-primitive value breaks react-refresh functionality in Vite, this PR proposes an alternative for providing a Story title that is react-refresh compatible:

Instead of this:

export default { title: "My/Story/Path" }

Do this:

export const TITLE = "My/Story/Path"

[changeset-bot]

⚠️ No Changeset found

Latest commit: 5bda641

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[tajo]

Appreciate the effort but I am not a big fan of adding this:

1. It's a completely new API that we would have to support forever.
2. It conflicts with the existing APIs (what gets the precedence?)
3. There are more things that go into export default like decorators, args and meta.
4. The improvement of user experience is pretty small and you can already avoid export default if you really care about HMR in stories that much. Also you can always keep story files light and do most of the work in the downstream modules.

I wonder if we could fork https://github.com/facebook/react/tree/main/packages/react-refresh instead to keep HMR working for the current API?

[lunelson]

Hey @tajo, thanks for your response and comments. I get that this might seem like a hack (it is); but given that Ladle already implements not-quite-standard CSFv3, I though it might be thinkable to offer a solution to something that is an acknowledged problem with CSF.

The goal in any case, is just to have more control over the story title, (which is to say mainly the nesting pattern of the title), so users can maintain a structured story organization without disabling HMR.

And in my opinion, HMR is not just a "small improvement": being able to refresh without losing state for example, is a big deal in dev efficiency (and I would guess that Ladle's faster DX is one of the reasons for choosing it over Storybook, no?)

Anyway, if there's a better way of doing this, I'm all ears. To your points:

It's a completely new API that we would have to support forever.

Certainly that's true.

It conflicts with the existing APIs (what gets the precedence?)

The way I wrote it so far, it's only a fallback option. So the default export would take precedence.

you can always keep story files light and do most of the work in the downstream modules

This part I don't understand. Could you explain what you mean here? Are there other/better ways of doing what I'm trying to do?