Core: Enable custom indexers to implement "Save From Controls" features

[JReinhold]

Works on storybookjs/addon-svelte-csf#288

What I did

This is an experiment to try and refactor the "Save From Controls" feature set, so it is possible for custom indexers to implement support for the feature. The existing support for regular CSF has been kept in tact by moving it to the default CSF indexer.

Currently it adds the following two optional properties to the existing indexer API:

saveStory

A function that takes information about the (existing) source story file (path and story ID), as well as args and and optionally a name.

The implementor will use the source data to get the existing source code, parse it and find the relevant story.
If no name is passed, it means the implementor needs to update the existing story with new args. The implementor must return { sourceStoryName: string; code: string }, where code is the new, complete (and hopefully formatted) source code of the file to write to the disk with the updated story.
If name is passed, the implementor is to duplicate the story from sourceStoryId, with the changed args, and return the new information and code that does this.

createNewStoryFile

A property with a test RegEx that should match any file path that the function support, eg. /\.svelte?/, and a create function. The purpose of this flow is to be able to search for existing components and generate a new story file for the component with default args.

The create function takes in information about the component that the user selected, as well as the name of the new story to generate (currently always 'Default'). It must return newStoryFilePath - eg. if the component is MyComp.tsx the newStoryFilePath would be MyComp.stories.tsx - and the complete code, that should be written to that path to get a valid story.

Todo

• Update tests
• Update indexer docs

Checklist for Contributors

Testing

The changes in this PR are covered in the following automated tests:

• stories
• unit tests
• integration tests
• end-to-end tests

Manual testing

This section is mandatory for all contributions. If you believe no manual test is necessary, please state so explicitly. Thanks!

Documentation

• Add or update documentation reflecting your changes
• If you are deprecating/removing a feature, make sure to update
  MIGRATION.MD

Checklist for Maintainers

• When this PR is ready for testing, make sure to add ci:normal, ci:merged or ci:daily GH label to it to run a specific set of sandboxes. The particular set of sandboxes can be found in code/lib/cli-storybook/src/sandbox-templates.ts

• Make sure this PR contains one of the labels below:

  Available labels

  • bug: Internal changes that fixes incorrect behavior.
  • maintenance: User-facing maintenance tasks.
  • dependencies: Upgrading (sometimes downgrading) dependencies.
  • build: Internal-facing build tooling & test updates. Will not show up in release changelog.
  • cleanup: Minor cleanup style change. Will not show up in release changelog.
  • documentation: Documentation only changes. Will not show up in release changelog.
  • feature request: Introducing a new feature.
  • BREAKING CHANGE: Changes that break compatibility in some way with current major version.
  • other: Changes that don't fit in the above categories.

🦋 Canary release

This pull request has been released as version 0.0.0-pr-31087-sha-ede76e62. Try it out in a new sandbox by running npx storybook@0.0.0-pr-31087-sha-ede76e62 sandbox or in an existing project with npx storybook@0.0.0-pr-31087-sha-ede76e62 upgrade.

More information

Published version	0.0.0-pr-31087-sha-ede76e62
Triggered by	@JReinhold
Repository	storybookjs/storybook
Branch	jeppe/indexers-save-story-from-controls
Commit	ede76e62
Datetime	Mon Apr 7 15:34:09 UTC 2025 (1744040049)
Workflow run	14313341653

To request a new release of this pull request, mention the @storybookjs/core team.

core team members can create a new canary release here or locally with gh workflow run --repo storybookjs/storybook canary-release-pr.yml --field pr=31087

[github-actions]

	Fails
🚫	PR is marked with "ci: do not merge" label.
🚫	PR is not labeled with one of: ["ci:normal","ci:merged","ci:daily","ci:docs"]

Generated by 🚫 dangerJS against ede76e6

[nx-cloud]

View your CI Pipeline Execution ↗ for commit ede76e6.

Command	Status	Duration	Result
nx run-many -t build --parallel=3	✅ Succeeded	1m 33s	View ↗

---

☁️ Nx Cloud last updated this comment at 2025-04-07 15:32:43 UTC