feat: Add CSF Next compatibility for definePreview addons pattern

[jthrilly]

Below was generated via Claude code, but based on my own research into the cause of this issue: #400

I manually reviewed the change and also tested it locally to verify. Please let me know if there's more you'd like me to do.

Summary

This PR adds compatibility with Storybook's CSF Next pattern where addons are imported and invoked as functions in the preview configuration.

Problem

In CSF Next, the preview file uses definePreview() and addons are expected to be functions that return PreviewAddon objects:

import addonChromatic from '@chromatic-com/storybook';
import { definePreview } from '@storybook/your-framework';

export default definePreview({
  addons: [addonChromatic()],  // ❌ Currently fails: {} is not a function
});

The current implementation exports an empty object {}, which causes a runtime error when invoked as a function.

Solution

Update the default export to be a function that returns a proper PreviewAddon via definePreviewAddon({}):

import { definePreviewAddon } from 'storybook/internal/csf';

export default () => definePreviewAddon({});

Since this addon only provides:

• Server-side preset functionality (build monitoring, static assets)
• Manager UI (the Visual Tests panel)

...and no preview annotations (decorators, parameters, globals), the preview addon exports an empty configuration object.

Breaking Changes

None. The addon can still be used in main.ts via the string format for preset loading, and now additionally works in the CSF Next definePreview({ addons: [...] }) pattern.

Test plan

• Build succeeds with yarn build
• TypeScript type checking passes with yarn typecheck
• [ X] Manual testing with CSF Next project (Storybook 10.1+)

🤖 Generated with Claude Code

[Copilot]

Pull request overview

This PR adds compatibility with Storybook's CSF Next pattern, enabling the addon to be used as a function in definePreview({ addons: [...] }) configurations. Previously, the addon exported an empty object which caused runtime errors when invoked as a function in CSF Next projects.

Changes:

• Modified the default export from an empty object to a function returning a PreviewAddon
• Added comprehensive documentation explaining the addon's purpose and usage pattern
• Imported definePreviewAddon from storybook/internal/csf to create proper addon structure

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

Consider adding a test to verify that the default export is a function that returns a valid PreviewAddon object. This would ensure the CSF Next compatibility works as intended and prevent regressions. The test could verify that calling the exported function returns an object with the expected structure from definePreviewAddon.

[kasperpeulen]

Looks good! Verified locally:

• yarn build succeeds — produces dist/index.d.ts (3.95 KB) with proper type declarations
• yarn typecheck passes with no errors
• Generated .d.ts correctly exports () => PreviewAddon<ChromaticTypes>
• No breaking changes for existing users (string-based addon loading in main.ts still works)

The core fix is clean and minimal — changing export default {} to export default () => definePreviewAddon<ChromaticTypes>({}) is the right approach since this addon has no preview annotations to inject.

Minor note: the generated declaration file includes the CONFIG_TYPE and LOGLEVEL global declarations from types.ts since tsup bundles everything into one .d.ts. Not a blocker, but worth being aware of.